@media print {
    #printableArea {
        width: 100%;
        font-size: 16px;
        color: black;
        direction: rtl;
    }
    #daily-printable-area {
        width: 100%;
        font-size: 16px;
        color: black;
        direction: rtl;
    }
    table {
        width: 100%;
        border-collapse: collapse;
    }

    th, td {
        padding: 5px;
    }

    tr {
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    .header-container {
        display: grid;
        justify-items: center;
        border-bottom: 1px solid black;
        min-height:50px;
    }
    #printableArea .title {
        width: 100%;
        border-bottom: solid 1px gray;
        font-weight: bold;
        background-color: lightblue;
        justify-content: center;
        display: flex;
    }
    #printableArea .header-container {
        grid-template-columns: 5% 20% 20% 15% 10% 10% 10% 10% !important;

    }
        #printableArea .header-container > * {
            display: flex;
            border: 1px solid #ccc;
            padding: 5px;
            box-sizing: border-box;
            width: 100%;
            height: 100%;
            justify-content: center;
        }
    #daily-printable-area .header-container {
        grid-template-columns: 7% 20% 15% 15% 13% 15% 10%;
    }

    .header-container label {
        display: flex;
        justify-content: right;
    }

    .total-cost {
        justify-content: center !important;
    }

    .total-container {
        display: grid;
        grid-template-columns: 1fr 1fr .5fr .5fr .5fr;
        justify-content: space-between;
    }

    .analysis-row-main-container {
        /*    ;*/
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 30px;
        color: #242222;
    }
    .top-container {
        width: 100%;
        display: grid;
        grid-template-columns: auto auto auto;
        justify-content: space-between;
        border: solid 2px gray;
        border-radius: 5px;
/*        padding: 5px;*/
    }
    .header-container label, .header-container div {
        display: flex;
        justify-content: right;
        padding: 5px;
    }
}