body {
      font-family: iransansweb;
}

.body-section {
      padding: 2%;
}

.section-frame {
      padding: 2%;
}

.section-box {
      border: 2px #888 solid;
      background-color: #e6e6e6;
      border-radius: 9px;
      font-size: 0.8rem;
      box-shadow: #17263a44 0px 0px 10px;

}

.section-part {
      display: flex;
      justify-content: space-between;
}

.section-part-2 {
      display: block;
      justify-content: space-between;
}


/* #region Input style */

.desk-grid {
      width: 30%;
      padding: 1.5%;
}

.desk-grid-2 {
      width: 30%;
      padding: 1.5%;
      display: flex;
      width: 96% !important;
      justify-content: space-evenly;
}

.desk-grid-75 {
      width: 75%;
      padding: 1.5%;
}

.desk-grid-96 {
      width: 96%;
      padding: 1.5%;
}


.action-row-wrapper {
      display: flex;
      justify-content: center;
      padding-bottom: 12px;
}

.action-row {
      display: block;
      width: 220px;
      font-size: large;
}

.action-row-wide {
      display: block;
      width: 100%;
      font-size: large;
}

.action-line {
      display: flex;
      justify-content: space-between;
      font-size: medium;

}

.action-row select {
      width: 100%;
      border: 2px gray solid;
      border-radius: 8px;
      height: 2rem;
      text-align: center;
}

select {
      width: 100%;
      border: 2px gray solid;
      border-radius: 8px;
      height: 2rem;
      text-align: center;
}

.action-row input {
      width: 39%;
      border: 2px gray solid;
      border-radius: 8px;
      height: 1.5rem;
      text-align: center;
}

.action-comment {
      padding: 24px 12px;
      align-content: center;
      text-align: center;
}

.action-comment * {
      text-align: center;
}


.w25 {
      width: 25%;
}


.inp-cm-frame {
      display: block;

}

.inp-cm-box {
      height: 2rem;

}

.inp-cm-box p {
      font-size: x-small;
}

.inp-cm-box li {
      font-size: x-small;
}

#doWaiting {
      display: none;
}

#promptText {
      width: 100%;
      min-height: 500px;
      font-family: iransansweb;
      font-size: 17px;
}

#adressDefinition {
      width: 100%;
      min-height: 100px;
      font-family: iransansweb;
      font-size: 17px;
      margin-top: 0px;
}







.output-action-btn {
      border: 2px rgb(56, 56, 56) solid;
      background-color: #e6e6e6;
      padding: 6px;
      border-radius: 4px;
      max-width: 16px;
      opacity: 0.8;
      cursor: pointer;
}

.smaller {
      max-width: 10px;
}


/* #region report */
.operation-report-frame {
      background-color: #88888844;
      border-radius: 8px;
}

.operation-report-frame h5 {
      margin-top: 0px;
      margin-bottom: 6px;
}


.status-report {
      background-color: #88888844;
      display: flex;
      justify-content: baseline;
      border-radius: 0px 0px 8px 8px;
      padding: 0px 8px 4px 4px;
      font-size: small;
}

.red-alert {
      color: rgb(163, 7, 7);
      font-weight: bold;
}

.noraml {
      color: rgb(29, 1, 1);
      font-weight: normal;
}


.sent-bubble {
      margin-right: auto;
      margin-top: 12px;
      padding: 16px;
      max-width: 400px;
      border-radius: 18px 18px 18px 0px;
      background-color: #55555544;
      font-size: small;
}

.received-bubble {
      margin-left: auto;
      margin-top: 12px;
      padding: 16px;
      /* max-width: 400px; */
      border-radius: 18px 0px 18px 18px;
      background-color: #ffffff66;
      font-size: small;
}

.result-report {
      max-height: 70vh;
      overflow-y: scroll;
      min-height: 3rem;
      padding: 8px;
}

.result-report::-webkit-scrollbar {
      display: none;
}

/* #endregion report */


.surah-waiting-frame {
      padding: 14px;
}

.surah-waiting-frame img {
      max-width: 18px;
      animation: rotate 2s infinite;
}










/* ============ Mobile responsive ============ */
@media (max-width:599px) {
      .section-box {
            display: block;
      }


      .section-part {
            display: block;
      }

      .section-part-2 {
            display: block;
      }

      .desk-grid {
            width: unset;
            padding: 16px;
      }

      .desk-grid-2 {
            width: unset;
            padding: 16px;
            display: block;
      }

      .desk-grid-75 {
            width: unset;
            padding: 16px;
      }

      .desk-grid-frame {
            width: 90vw;
            display: flex;
            justify-content: space-around;
      }

      .action-row {
            width: 100%;
            display: unset;
            justify-content: space-between;
      }

      .action-row * {
            margin: 1px 5px;
      }

      .margin-bottom--10 * {
            margin-bottom: -10px;
      }

      .action-row select {
            width: -webkit-fill-available;
      }

      .inp-detail {
            display: flex;
      }

      .inp-detail label {
            height: 2rem;
      }

      .action-line {
            display: block;
      }

      .action-comment {
            display: flow;
            padding: 4px 12px;
            align-content: center;
            text-align: center;
      }

      .extra-padding {
            padding: 6%;
      }

      .inp-cm-box {

            height: unset;
      }
}

/* #endregion Input style */