.content-wrapper {
  padding-bottom: 0px !important;
  margin-top: 63px !important;
}

.info-box-agency {
  display: flex;
  padding: 2px 2px 32px 2px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex: 1 0 0;
  border-radius: 10px;
  border: var(--stroke-weight-1, 1px) solid var(--themeadapt-com-white-12, rgba(255, 255, 255, 0.12));
  background: var(--White-Smoke, #F3F3F3);
}

.content-box-top {
  display: flex;
  flex-direction: column;
  height: 100%;
  gap: 12px;
}

.shadow-content-box {
  padding: 19px 21px;
  border-radius: 10px;
  background: var(--White, #FFF);
  box-shadow: -7.829px 11.607px 21px 0px rgba(25, 42, 70, 0.13);
}

.img-withdrawal-request {
  width: 45px;
  height: 45px;
  background: url(/public/img/agency/card-ATM.png) lightgray 50% / contain no-repeat;
}

.btn-withdrawal-request-agency {
  display: flex;
  /* padding: 9px 17px; */
  justify-content: center;
  align-items: center;
  gap: var(--item-spacing-3_93, 3.93px);
  border-radius: 700px;
  border: var(--stroke-weight-1, 1px) solid var(--Border, #DADADA);
  background: #FFF;
}

.btn-withdrawal-request-agency:hover {
  background: #EFEFEF;
  border-color: #DADADA;
}

.img-people {
  width: 45px;
  height: 45px;
  background: url(/public/img/agency/people.png) rgb(255, 255, 255) 0px 0px / 100% 100% no-repeat;
}

.img-coupen {
  width: 45px;
  height: 45px;
  background: url(/public/img/agency/coupen_3.png) rgb(255, 255, 255) 0px 0px / 100% 100% no-repeat;
}

/* .content-box-top>div.people {
  gap: 12px;
} */

/* .content-box-top>div>p.text-people {
  line-height: 28.8px;
} */

.btn-copy {
  position: relative;
  display: flex;
  width: 35px;
  height: 35px;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
  border: 1px solid #CC3A3D;
  background: var(--red-main, #CC3A3D);
}

.btn-copy>svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

/* .btn-copy:hover {
  border: 1px solid #ad4244;
  background: #ad4244;
} */

.text-link-invite {
  max-width: 30%;
}

.invite-code {
  max-width: 50%;
}

.text-link-invite-code {
  word-break: break-all;
}

.btn-copy:active {
  background: #ad4244;
}

.btn-copy::before {
  content: "Copied";
  position: absolute;
  bottom: -45px;
  right: -20px;
  background: #CC3A3D;
  color: #FFF;
  padding: 8px 10px;
  border-radius: 20px;
  font-size: 15px;
  display: none;
}

.btn-copy::after {
  content: "";
  position: absolute;
  bottom: -12px;
  right: 11px;
  width: 10px;
  height: 10px;
  background: #CC3A3D;
  transform: rotate(45deg);
  display: none;
}

.btn-copy.active::before,
.btn-copy.active::after {
  display: block;
}

.table td,
.table th {
  padding: 8px !important;
}

.teacherWrap>.w-100>.alert {
  padding: 8px 14px;
}

/* .layout {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: auto repeat(1, 1fr);
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  padding: 12px;
  height: calc(100vh - 85px);
}

.layout>.layout-left>.card,
.layout>.layout-right>.card {
  margin-bottom: 0;
  height: 100%;
}

.layout>.div1 {
  grid-area: 1 / 1 / 2 / 13;
}

.layout-left {
  grid-area: 2 / 1 / 3 / 7;
  height: 100%;
  overflow: auto;
}

.layout-right {
  grid-area: 2 / 7 / 3 / 13;
  height: 100%;
  overflow: auto;
}

thead {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #FFF;
}

@media (max-width: 1400px) {
  .layout {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    grid-column-gap: 0;
    grid-row-gap: 12px;
    padding: 8px;
  }

  .layout-left,
  .layout-right {
    grid-area: auto / 1 / auto / 2;
    height: auto;
  }
}

@media (max-width: 1200px) {
  .shadow-content-box {
    padding: 10px;
  }

} */

.layout .layout-right table th:first-child,
.layout .layout-right table td:first-child {
  min-width: 10px !important;
  max-width: 100px !important;
}

.layout {
  height: calc(100vh - 85px);
}

.layout-content {
  height: 100%;
  gap: 32px;
}

.layout-left,
.layout-right {
  width: 50%;
  height: 100%;
  /* overflow: auto; */
}

.card.teachInfo.teacherOnline {
  height: 100%;
}

thead {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #FFF;
}

@media (max-width: 1400px) {
  .layout-content {
    flex-direction: column;
    height: 100%;
    gap: unset;
  }

  .layout-left,
  .layout-right {
    width: 100%;
    height: 50%;
    max-height: 50%;
  }
}