html {
    direction: rtl;
}

body {
    text-align: right;
}

.text-right {
    text-align: left !important;
}

.text-left {
    text-align: right !important;
}

i.fa.fa-arrow-left.mr-1 {
    transform: rotate(180deg);
    margin-left: 4px;
}

.d-none {
    display: none;
}

.tableContainer .form-check label {
    margin-right: 20px;
}

.loggedinUser {
    float: left;
}

.mvc-grid-pager .active, .mvc-grid-pager .active:focus, .mvc-grid-pager .active:hover {
    text-align: center;
}

.ml-auto, .mx-auto {
    margin-right: auto !important;
    margin-left: initial !important;
}

.contentCol {
    padding-left: 0;
    padding-right: 5px !important;
}

.sideNavCol {
    padding-right: 0;
    padding-left: 5px !important;
}

.siteTitle {
    text-align: right;
}

.sideNavCol {
    text-align: right !important;
}

.menuToggle {
    top: 0px;
    left: initial;
    right: -4px;
    border-radius: 3px 0 0 3px;
}

.container {
    text-align: right;
}

.linkedList {
    margin-right: 20px;
}

    .linkedList li:before {
        left: 0;
        right: -19px;
    }

    .linkedList li:after {
        left: inherit;
        right: -16px;
    }

.heroCircle {
    left: -12%;
    top: -142px;
}

.modal-body {
    text-align: right;
}

.input-group > .input-group-append > .btn {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group > .form-control:not(:last-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.fileList li label {
    min-width: 187px;
}


.navToggle {
    right: inherit !important;
    left: 0;
}

@media (max-width: 768px) {
    .heroLogo {
        margin-left: 0px !important;
        margin-right: 5px;
    }

    li.nav-item {
        margin-right: 10px;
    }

    li.nav-item {
        text-align: right;
    }
}

/*** To remove arrow from "number type textbox" Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

#compText {
    text-align: left !important;
}

#centerText {
    text-align: center !important;
}

@font-face {
    font-family: 'Majalla';
    src: url('../fonts/Majalla.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

#PrintArea * {
    font-family: 'Majalla','FontAwesome', Arial, sans-serif !important;
}
.tableContainer {
    width: 900px;
    margin: auto;
    border-collapse: collapse;
    border: 1px solid #cecece;
    font-family: 'Majalla', Arial, sans-serif !important;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
    border-collapse: collapse;
}

.tableContainer tr td {
    border-collapse: collapse;
    border-spacing: 0;
    border-collapse: collapse;
    padding: 5px;
    font-size: 24px !important;
   
}

.tableContainer h5 {
    font-size: 24px !important;
}

.bgBlue {
    background-color: #0060A9;
    color: #fff;
}

.bgLightBlue {
    background-color: #4D93D9;
    color: black;
}

.tableContainer td {
    border: 1px solid #bab9b9;
}

.bgGray {
    background-color: #D9D9D9;
}

.text-center {
    text-align: center;
}

.bold {
    font-weight: bold;
}

.w-100 {
    width: 100%;
}

.w-50 {
    width: 50%;
}

.w-20 {
    width: 20%;
}

.lh10 {
    line-height: 10px !important;
}

.lh20 {
    line-height: 20px !important;
}

.lh30 {
    line-height: 30px !important;
}

.lh40 {
    line-height: 40px !important;
}

.whiteBox {
    padding: 5px;
    background-color: #fff;
    height: fit-content !important;
}

.boxxlg {
    height: 150px;
    padding: 5px;
}

.boxlg {
    height: 100px;
    padding: 5px;
}

.boxsm {
    height: 60px;
    padding: 5px;
}

.box80 {
    height: 80px;
    padding: 5px;
}


.signature {
    height: 68px;
    margin: auto;
    display: block;
}

.stamp {
    height: 150px;
    margin: auto;
    display: block;
    padding: 6px;
}


/*PACI civil id*/

.bg {
    /*background: url('../Img/koclogowhite.svg') no-repeat center center;*/
    background-size: cover;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: white;
}

.card {
    background-color: white;
    color: black;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border-color: #E6ECF2;
}

.loginCard {
    width: 420px;
    max-width: 96%;
    background-color: #f5fbff;
}

.idInput {
    background-image: url('img/id.svg');
    background-size: 24px 24px;
    background-position: right 10px center;
    background-repeat: no-repeat;
    padding-right: 45px !important;
}

    .idInput:focus {
        background-image: url('~/Content/Img/id.svg');
    }

.mobileID {
    width: 70px;
    margin: auto;
}

.cardValTitle {
    font-size: 30px;
    font-weight: 400;
    color: #477091;
}

.countdown-timer {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 600;
    font-size: 2.5rem;
    color: #333;
    background-color: #f8f9fa;
    border-radius: 10px;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    /* box-shadow: 0 4px 6px rgba(0,0,0,0.1); */
    margin: auto;
    justify-content: center;
    margin-bottom: 14px;
}

    .countdown-timer .time-unit {
        background-color: #ffffff;
        border: 2px solid #e9ecef;
        border-radius: 5px;
        padding: 5px 10px;
        min-width: 80px;
        text-align: center;
    }

    .countdown-timer .separator {
        color: #6c757d;
    }

.mobileID {
    width: 70px;
    margin: auto;
}

.multiline-text {
    white-space: pre-line;
}

.visually-hidden, .visually-hidden-focusable:not(:focus):not(:focus-within) {
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
    border: 0 !important
}

    .visually-hidden-focusable:not(:focus):not(:focus-within):not(caption), .visually-hidden:not(caption) {
        position: absolute !important
    }

.formHeading {
    font-size: 30px;
}
.bgGray .border {
    border: 1px solid #bab9b9 !important;
}
.bgGray  {
    border: 1px solid #bab9b9 !important;
}
.table-bordered td.bgGray {
    border: 1px solid #bab9b9 !important;
}
.showOnPrint{
    display:none;
}
@media print {
    .printBold{
        font-weight:600!important;
    }
    @page {
        margin: 10mm;
    }
    .showOnPrint {
        display: contents;
    }
    body {
        width: 100%;
        min-width: 0; /* reset min-width */
        box-sizing: border-box; /* ensures padding & borders don’t overflow */
        margin: 0;
        padding: 0;
        direction: rtl;
        text-align: right;
    }
    .print-pr-1 {
        padding-right: 4px !important;
        padding-top: 12px;
    }
    .bgLightBlue {
        background-color: #7cabdb;
    }

    .container {
        box-shadow: none;
        padding: 0;
        width: 100%;
    }

    .containerCard {
        margin: auto;
    }

    .heroBanner,
    #footer,
    .print-controls {
        display: none;
    }

    .tableContainer {
        page-break-inside: auto; /* allow breaking to avoid blank page */
    }

        .tableContainer,
        .tableContainer > table {
            width: 100% !important;
            max-width: 100% !important;
            table-layout: auto !important;
            border-collapse: collapse !important;
            margin: 0 auto !important;
            text-align: right;
            direction: rtl;
        }

            .tableContainer table table {
                page-break-inside: avoid; /* nested tables can break */
            }

            .tableContainer td {
                /*padding: 2mm 3mm !important;*/
                font-size: 24px !important;
                line-height: 1.4 !important; /* reduce from 40px to 1.4 to prevent blank page */
                vertical-align: top;
                word-wrap: break-word;
                box-sizing: border-box;
                border: 1px solid #000000;
            }
    .border-left {
        border-left: 1px solid #000000 !important;
    }
    .border-right {
        border-right: 1px solid #000000 !important;
    }
    .border-top {
        border-top: 1px solid #000000 !important;
    }
    .border-bottom {
        border-bottom: 1px solid #000000 !important;
    }
    
    .bgGray .border {
        border: 1px solid #000 !important;
    }
    .border {
        border: 1px solid #000 !important
    }
    hr {
        border-top: 1px solid #000;
    }
    .tableContainer tr td {
        padding: 0px 0px !important;
        font-size: 27px !important;
        vertical-align: middle;
        line-height: 1.4; /* reduced */
    }

            .tableContainer table table tr td {
                padding: 0px 0px !important;
                font-size: 27px !important;
                line-height: 1.4; /* reduced */
            }

            .tableContainer .bgGray tr td {
                /*padding: 10px !important;*/
            }

    .tableDataCol {
        display: block !important; 
        padding: 2px 5px !important;
    }

    .formHeading {
        font-size: 32px;
        padding: 18px;
    }
    .formHeading2 {
        font-size: 32px;       
    }
    .bgGray {
        background-color: #D9D9D9;
        font-weight: 600 !important;
    }
    .bgBlue, .bgLightBlue {
        font-weight: 600;
    }
    table, tr {
        page-break-inside: auto; /* allow tables and rows to break */
    }

    img {
       // max-height: 15mm;
    }
}