.teacherDocument-wrap,
    .documentWrap {
      overflow: hidden;
    }

    .documentWrap {
      border: none;
      border-radius: 10px;
      box-shadow: 0 4px 4px #00000040;
    }

    .teacherDocument-wrap .table tr.bgColor {
      background-color: #F2F2F2;
    }

    .teacherDocument-wrap .table tr.bgColor th {
      padding: 20px;
    }

    .banner-main-wrap::before {
      background-image: none !important;
    }

    .teacherDocument-wrap .fileWrap a,
    .teacherDocument-wrap .fileWrap span {
      display: inline-block;
      width: 100%;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      direction: rtl;
      text-align: left;
    }

    .teacherDocument-wrap .table-bordered td,
    .teacherDocument-wrap .table-bordered th {
      /* border: none; */
      color: var(--Rating-Color, #3F3F3F);
      font-family: Montserrat;
      font-size: 13px;
      font-style: normal;
      font-weight: 500;
      line-height: normal;
    }

    .teacherDocument-wrap .table-bordered>:not(caption)>* {
      border-color: #E2E8F0;
    }

    button.btnData {
      /* padding: 8px 24px; */
      color: var(--Bule, #004DA9);
      border-radius: 4px;
      border: 1px solid var(--Bule, #004DA9);
      font-size: 16.421px;
      font-style: normal;
      font-weight: 500;
      display: inline;
    }

    button.btnData:hover {
      background-color: var(--Bule, #6da9f1);
      color: var(--White, #FFFFFF);
    }

    #save-button {
      padding: 13px 26px;
      border-radius: 35px;
      /* background: var(--New-red, #CC3A3D); */
    }

    #add-row,
    a.preview {
      padding: 13px 26px;
      border-radius: 35px;
      background: var(--White, #FFF);
      box-shadow: 0px 4px 4px 0px rgba(150, 139, 139, 0.25);
      color: var(--Bule, #004DA9);
      text-align: center;
      font-size: 16.421px;
      font-style: normal;
      font-weight: 600;
    }

    .delete-row-btn,
    .deleteRowBtn,
    .btnEdit {
      width: 36px;
      height: 36px;
      border: 1px solid #C4CDD4;
      border-radius: 50%;
      text-align: center;
      align-items: center;
    }

    #exerciseModalLabel,
    #testModalLabel,
    #examModalLabel {
      color: var(--Heading-Color, #1B1717);
      font-family: Montserrat;
      font-size: 24px;
      font-style: normal;
      font-weight: 600;
      line-height: 120%;
      /* 28.8px */
      text-transform: capitalize;

    }

    p.lessonName {
      color: var(--Primary, #757575);
      font-family: Montserrat;
      font-size: 14px;
      font-style: normal;
      font-weight: 500;
      line-height: 120%;
      /* 16.8px */

    }

    .labelBlue {
      color: var(--Blue, #004DA9);
      font-family: Montserrat;
      font-size: 16px;
      font-style: normal;
      font-weight: 500;
      line-height: 130%;
      /* 20.8px */
      text-transform: capitalize;
    }

    .labelBlack {
      color: var(--Rating-Color, #3F3F3F);
      font-family: Montserrat;
      font-size: 16px;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
    }

    #exerciseModal .modal-content,
    #testModal .modal-content,
    #examModal .modal-content {
      border-radius: 35px;
    }

    .btnView {
      background-color: #004DA9;
      color: white;
    }

    .custom-file-upload {
      display: inline-flex;
      align-items: center;
      color: #004DA9;
      font-weight: 500;
      cursor: pointer;
      background-color: white;
      padding: 8px 24px;
      justify-content: center;
      align-items: center;
      gap: 12px;
      border-radius: 4px;
      border: 1px solid var(--Bule, #004DA9);
    }

    .answer-container span.answer {
      height: unset;
      max-height: 200px;
      overflow-y: auto;

    }

    .btn-view-edit-answer,
    .btn-delete-answer {
      height: 45px;
    }

    .wrs_layoutFor2Rows th,
    .wrs_layoutFor2Rows td,
    .wrs_layoutFor3Rows th,
    .wrs_layoutFor3Rows td {
      min-width: unset !important;
    }
    /* Start: Modal custom*/
    .custom-modal-overlay {
      display: none; /* Hidden by default */
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
      z-index: 1050; /* Ensure it's above other elements */
      overflow: auto; /* Enable scroll for the overlay if modal is too long */
      display: flex; /* Enable flexbox for centering */
      justify-content: center; /* Center horizontally */
      align-items: center; /* Center vertically */
    }

    .custom-modal {
      background-color: #fff;
      border-radius: 30px;
      padding: 12px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
      width: 80%; /* Maximum width */
      max-width: 80%;
      max-height: 80vh; /* Maximum height */
      display: flex;
      flex-direction: column;
      overflow: hidden; /* Prevent modal content from overflowing */
    }

    .custom-modal-header {
      padding: 15px;
      /* border-bottom: 1px solid #e9ecef; */
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-shrink: 0; /* Prevent header from shrinking */
    }

    .custom-modal-title {
      margin: 0;
      font-size: 1.5rem;
    }

    .custom-modal-close-button {
      background: none;
      border: none;
      font-size: 1.5rem;
      font-weight: bold;
      cursor: pointer;
      padding: 0;
    }

    .custom-modal-body {
      padding: 15px;
      overflow-y: auto; /* Enable vertical scroll within the body */
      flex-grow: 1; /* Allow body to take up remaining vertical space */
    }

    .custom-modal-footer {
      padding: 15px;
      /* border-top: 1px solid #e9ecef; */
      display: flex;
      justify-content: flex-end;
      gap: 10px;
      flex-shrink: 0; /* Prevent footer from shrinking */
    }
    a.preview,
    button.add-more,
    button.btn-save-exercise,
    button.btn-save-test,
    button.btn-save-exam,
    button.closeExerciseModal,
    button.closeTestModal,
    button.closeExamModal
    {
      padding: 13px 26px !important;
      border-radius: 35px !important;
    }
    #closeCustomModal{
      padding: 0px !important;
    }

    /* Responsive adjustments for smaller screens (tablets) */
    @media (max-width: 1200px) {
      a.preview,
      button.add-more,
      button.btn-save-exercise,
      button.btn-save-test,
      button.btn-save-exam,
      button.closeExerciseModal,
      button.closeTestModal,
      button.closeExamModal
      {
        padding: 6px 13px !important;
        border-radius: 16px !important;
      }
      button.btn-save-exercise span svg,
      button.btn-save-test span svg,
      button.btn-save-exam span svg {
        width: 15px !important;
        height: 15px !important;
      }
    }
    @media (max-width: 768px) {
      .custom-modal {
        width: 95%; /* Adjust width for smaller screens */
        max-width: 95%;
        max-height: 65vh; /* Adjust max-height for smaller screens */
      }
    }
    /* End: Modal custom*/