/* @media print {
            @page {
                size: landscape;
            }
            body {
                -webkit-print-color-adjust: exact;
            }
        } */



        .Header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            height: 55px;
            box-sizing: border-box;
        }

        .ins {
            width: auto;
            height: auto;
            border: 2px solid black;
            border-radius: 18px;
            text-align: center;
            background-color: #581845;
            color: white;
            position: relative;
            top: 10px;
            left: -1%;
            padding: 4px 38px;


        }

        .img {
            width: auto;
            height: auto;
            border: 1px solid black;
        }

        .inputs {
            width: 40%;
            display: flex;
            align-items: center;

        }

        .inputs input[type="text"] {
            border: none;
            border-bottom: 1px solid black;
            width: 55%;

        }

        #doctor {
            border: none;
            outline: none;
            position: relative;
            left: 39%;
            top: -4px;
            margin-left: -12PX;
        }

        #patient {
            border: none;
            outline: none;
            position: relative;
            left: 39%;
            top: -7px;
            margin-top: -10px;
            margin-left: -12PX;
        }

        .case_number {
            border: none;
            outline: none;
            position: relative;
            left: 39%;
            top: -9px;
            margin-top: -10px;
            margin-left: -12PX;
        }

        .indicators-span {
            width: 180px;
            height: 29px;
            background: #581845;
            color: white;
            border-radius: 20px;
            padding-top: 5px;
            transform: translateX(-52%);
            position: relative;
            top: -16px;
            left: 98px;
            margin-bottom: 0px;

        }

        .footer {
            left: 35%;
            transform: translateX(-50%);
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            border: 2px solid #581845;
            border-radius: 50px;
            position: absolute;
            /* width:29%; */
            max-width: 29%;
            top: 650PX;
            height: 74px;

            flex-direction: row;
            align-content: flex-start;

        }

        .footer1 {
            left: 65%;
            transform: translateX(-50%);
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            border: 2px solid #581845;
            border-radius: 50px;
            position: absolute;
            /* width: 29%; */
            max-width: 29%;
            top: 650PX;
            height: 74px;

            flex-direction: row;
            align-content: flex-start;



        }

        .bellow_footer {
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            flex-wrap: wrap;
            justify-content: center;

            position: absolute;
            width: 40%;
            /* max-width:40%; */
            top: 735PX;
            height: 54px;

        }




        ul {
            list-style: none;
            padding: -1px;
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-start;
            width: 100%;
            margin: -16px 0px 0px 9px;


        }

        ul li {
            /* margin: 2px 10px 5px 10px; */
            padding: 1px;
        }

        ul li a {
            text-decoration: none;
            color: #581845 !important;
            font-size: 16px;
            font-weight: bold;
            display: flex;
            align-items: center;
        }

        ul li a .icon img,
        ul li a .icon-missing img,
        ul li a .icon-extraction img {
            margin: 0px 7px 0px 6px;
        }


        ul li a .icon img {
            width: 18px;
            height: 12px;
        }

        ul li a .icon-missing img {
            width: 20px;
            height: 18px;
        }

        ul li a .icon-extraction img {
            width: 12px;
            height: 20px;
        }

        /* #note {
    width: 100%;
    text-align: center;
    margin-top: 10px;
} */


        .description {
            width: 100%;
            height: auto;
            /* height: 200px; */
            position: relative;
            top: 500px;

        }


        .side {
            float: left;
            position: relative;
            top: -140px;
            right: 108%;
            width: 206px;
            /* border:2px solid black; */


        }


        .child {
            width: 100%;
            border: 2px solid #581845;
            margin: 0px 0px 6px 0px;
            padding: 0px 6px;
            border-radius: 12px;
            font-size: 12px;
            font-weight: bold;

        }

        .page-break {
            page-break-before: always;
        }

        .child_font {
            font-size: 14px;
            font-weight: bold;
        }

        .chit {
            font-size: 14px;
            /* border-bottom: aliceblue; */
            font-weight: 600;

            border-bottom: 2px solid black;
        }

        .chit_heading {
            font-size: 14px;
            font-weight: bold;
        }

        .parent {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            /* 4 columns */
            grid-template-rows: auto;
            /* Rows auto adjust based on content */
            gap: 8px;
            /* Optional: space between items */
            width: 92%;
            /* 80% width */
            margin: 0 auto;
            /* Center align the parent */
            position: relative;
            top: 550px;
            /* left:40px; */
            /* border:2px dotted black; */
        }

        /* Style for child divs */
        .lower_children {
            /* background-color: #f2f2f2; */
            padding: 13px;
            border: 1px dotted black;
            box-sizing: border-box;
            word-wrap: break-word;
            height: 239px;
            margin: 9px 0px 8px 0px;
        }

        .lower_child_font {
            font-size: 14px;
            font-weight: bold;
        }

        .side2 {
            float: right;
            position: relative;
            top: -165px;
            right: -6%;
        }

        /* textarea 
               {
                font-size: 12px;
    font-weight: bold;
    border-radius: 17px;
    text-align: center;
    width: 220px;
    box-sizing: border-box;
    min-height: 30px;
    max-height: 100px; 
    resize: none; 
    border: 2px solid #581845;
    padding-left: 4px;
    padding-right: 4px;
    overflow: scroll; 
              
        } */
        /* .custom-font-size {
                font-size: 12px;
    font-weight: bold;
    border-radius: 17px;
    text-align: center;
    width: 220px;
    box-sizing: border-box;
    min-height: 25px;
    max-height: 85px;
    border: 2px solid #581845;
    padding-left: 4px;
    padding-right: 4px;
    overflow-y: hidden; 
    line-height: 1.3;
        } */

        .custom-font-size {
            font-size: 12px;
            font-weight: bold;
            border-radius: 12px;
            text-align: center;
            width: 220px;
            box-sizing: border-box;
            height: auto;
            max-height: 77px;
            border: 2px solid #581845;
            padding-left: 4px;
            padding-right: 4px;
            overflow-y: hidden;
            min-height: 25px;
            line-height: 1.3;
        }

        /* textarea 
               {
                font-size: 12px;
    font-weight: bold;
    border-radius: 12px;
    text-align: center;
    width: 220px;
    box-sizing: border-box;
    min-height: 25px;
    max-height: 77px;
    border: 2px solid #581845;
    padding-left: 4px;
    padding-right: 4px;
    overflow-y: hidden; 

    line-height: 1.3;
              
        } */



        @media screen and (max-width: 1195px) {

            .side,
            .side2 {

                position: relative;

            }

            .side {

                right: 75% !important;
                top: 342px;
            }

            .side2 {

                right: 33% !important;
                top: 342px;
            }

            .footer {
                margin-top: 10px !important;
                left: -17%;
                transform: translateX(-50%);
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                border: 2px solid #581845;
                border-radius: 17px;
                position: relative;
                width: 29%;
                max-width: 29%;
                top: 394px;
                height: auto;

            }

            .footer1 {
                margin-top: 10px !important;
                left: 72%;
                transform: translateX(-50%);
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                border: 2px solid #581845;
                border-radius: 17px;
                position: relative;
                width: 29%;
                max-width: 29%;
                top: 394px;
                height: auto;

            }



        }

        .hide {

            display: none;
        }

        @media print {

            .parent {
                /*           
        position:absolute;
            top:1600px;
            left:40px; */
                position: absolute !important;
                top: 1596px !important;
                left: 40px !important;

            }

            /* .heading_doc
{
    margin-left:50px !important;
}
.heading_pt{
    margin-left:12px !important;
} */

            .footer {


                max-width: 31% !important;
                height: 80px !important;

            }

            .footer1 {
                height: 80px !important;
            }


            ul li a .icon img,
            ul li a .icon-missing img,
            ul li a .icon-extraction img {
                margin: 0px 5px 0px 3px !important;
            }


            ul li a .icon img {
                width: 17px !important;
                height: 11px !important;
            }

            ul li a .icon-missing img {
                width: 18px !important;
                height: 17px !important;
            }

            ul li a .icon-extraction img {
                width: 12px !important;
                height: 19px !important;
            }


            .jaw-grid {
                width: 40% !important;
            }

            #jaw-grid1 {
                position: relative;
                left: 25% !important;
            }

            #jaw-grid2 {
                position: relative;
                left: -6% !important;
            }



            .side {

                position: relative;

                right: 135% !important;
                width: 199px !important;
            }

            .side2 {

                position: relative;
                top: -170px !important;
                right: -10% !important;
            }

            .custom-font-size {

                text-align: center;
                width: 222px !important;
                /* height:auto !important; */
                padding-bottom: 5px !important;
            }

            @page {
                size: landscape !important;
                /* height:1000px; */
                /* page-break-inside: avoid;
    page-break-before: always;
    page-break-after: auto; */
                /* size: landscape !important; */
                margin: 0 !important;
            }

            body {
                width: 100% !important;
                height: 100% !important;
                margin: 0 !important;
                padding: 0 !important;
            }

            body {
                overflow-y: scroll !important;

                margin: 0 !important;
            }

            body {
                width: 100% !important;
                height: 100% !important;
                margin: 0 !important;
                padding: 0 !important;
            }

            body {
                overflow-y: scroll !important;
                /* height: 1600px;     */
            }

            .dental-work {
                position: relative;
                left: 25% !important;
                /* Adjust this value to move the div further left */
                /* top: 3px !important;
        width: 18% !important;
        height: 60% !important;
        border: 2px solid black !important;
        border-radius: 22px !important;
        text-align: center !important; */
            }

        }


        textarea {
            overflow: hidden;
            resize: none;
            box-sizing: border-box;
            /* Ensure padding and border are included in the height */
        }

        .child::before {
            content: "Step " attr(data-step) ":";
            font-weight: bold;
            display: block;
            font-size: 14px;
            color: #333;
        }

        .lower_children::before {
            content: "Step " attr(data-step) ":";
            display: block;
            font-weight: bold;
            font-size: 14px;
            color: #333;
            margin-bottom: 4px;
        }

        .fancy-load-btn {
            /* margin-top: 15px; */
            padding: 6px 20px;
            background-color: #3498db;
            color: white;
            border: none;
            border-radius: 6px;
            font-size: 16px;
            font-weight: bold;
            cursor: pointer;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            transition: background-color 0.3s ease;
            margin-bottom: 10px;
        }

        .fancy-load-btn:hover {
            background-color: #2c80b4;
        }


        .access-denied-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100vh;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: #f8f9fa;
    color: #333;
    text-align: center;
    animation: fadeIn 1s ease-in-out;
  }

  .access-denied-icon {
    font-size: 80px;
    color: #dc3545;
    margin-bottom: 20px;
  }

  .access-denied-heading {
    font-size: 36px;
    color: #dc3545;
    font-weight: bold;
  }

  .access-denied-message {
    font-size: 18px;
    margin-top: 10px;
  }

  .go-back-button {
    margin-top: 30px;
    padding: 10px 20px;
    background-color: #0668A0;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
  }

  .go-back-button:hover {
    background-color: #054e79;
  }

  @keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
  }