
/* =========================================================
   RUYA ADMIN MESSAGES PREMIUM V1
   scoped - admin only
   ========================================================= */

.ruyaAdminMessagesPremiumPage{
  position:relative;
  width:100%;
  color:#2f405b;
}

.ruyaAdminMessagesHeader{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin:0 0 16px;
  padding:20px 22px;
  border:1px solid #e7ebf2;
  border-radius:23px;
  background:linear-gradient(135deg,#fbfcff,#f5f8fc);
  box-shadow:0 8px 28px rgba(42,55,83,.04);
}

.ruyaAdminMessagesEyebrow{
  display:block;
  margin-bottom:5px;
  color:#73829a;
  font-size:9px;
  font-weight:800;
  letter-spacing:.14em;
}

.ruyaAdminMessagesTitle h2{
  margin:0;
  color:#283a56;
  font-size:24px;
  line-height:1.1;
  font-weight:850;
}

.ruyaAdminMessagesTitle p{
  margin:7px 0 0;
  color:#8290a4;
  font-size:11px;
}

.ruyaAdminMessagesActions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.ruyaAdminMessageAction,
.ruyaAdminSubBack{
  min-height:39px;
  padding:0 14px;
  border:1px solid #17307a;
  border-radius:12px;
  background:#17307a;
  color:#fff;
  font-size:10px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 7px 18px rgba(23,48,122,.12);
}

.ruyaAdminMessageAction.secondary,
.ruyaAdminSubBack{
  border-color:#e0e6ef;
  background:#fff;
  color:#40516b;
  box-shadow:none;
}

.ruyaAdminMessageTabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:0 0 15px;
  padding:5px;
  border:1px solid #e7ebf2;
  border-radius:17px;
  background:#f1f4f8;
}

.ruyaAdminMessageTabs button{
  min-height:44px;
  padding:8px 13px;
  border:0;
  border-radius:13px;
  background:transparent;
  color:#77859b;
  font-size:10px;
  font-weight:800;
  cursor:pointer;
}

.ruyaAdminMessageTabs button.active{
  background:#fff;
  color:#17307a;
  box-shadow:0 6px 18px rgba(36,52,82,.08);
}

.ruyaAdminTeacherAudit{
  display:grid;
  grid-template-columns:
    minmax(245px,.82fr)
    minmax(290px,1fr)
    minmax(340px,1.35fr);
  gap:13px;
  min-height:625px;
}

.ruyaAdminTeacherPane,
.ruyaAdminConversationPane,
.ruyaAdminThreadPane{
  min-width:0;
  overflow:hidden;
  border:1px solid #e7ebf2;
  border-radius:22px;
  background:#fff;
  box-shadow:0 8px 28px rgba(42,55,83,.04);
}

.ruyaAdminTeacherPane,
.ruyaAdminConversationPane{
  padding:9px;
  overflow-y:auto;
  max-height:calc(100dvh - 245px);
}

.ruyaAdminThreadPane{
  display:flex;
  flex-direction:column;
  max-height:calc(100dvh - 245px);
}

.ruyaAdminPaneHead{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:55px;
  padding:5px 6px 9px;
}

.ruyaAdminPaneHead h3{
  margin:0;
  color:#2b3d59;
  font-size:13px;
  font-weight:850;
}

.ruyaAdminPaneHead small{
  display:block;
  margin-top:3px;
  color:#97a1b0;
  font-size:9px;
}

.ruyaAdminMessageSearch{
  display:grid;
  grid-template-columns:19px minmax(0,1fr) 28px;
  align-items:center;
  gap:7px;
  min-height:42px;
  margin:0 0 9px;
  padding:0 7px 0 11px;
  border:1px solid #e5eaf1;
  border-radius:14px;
  background:#fafbfd;
}

.ruyaAdminSearchIcon{
  color:#8390a3;
  font-size:18px;
}

.ruyaAdminMessageSearch input{
  min-width:0;
  height:40px;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#34455f;
  font-size:10.5px;
}

.ruyaAdminMessageSearch button{
  display:flex;
  align-items:center;
  justify-content:center;
  width:27px;
  height:27px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#eef2f7;
  color:#68778d;
  font-size:17px;
  cursor:pointer;
}

.ruyaAdminTeacherList,
.ruyaAdminConversationList{
  display:grid;
  gap:6px;
}

.ruyaAdminTeacherRow,
.ruyaAdminConversationRow{
  position:relative;
  display:grid;
  align-items:center;
  width:100%;
  min-width:0;
  min-height:68px;
  gap:10px;
  padding:9px;
  border:1px solid #edf0f5;
  border-radius:17px;
  background:#fff;
  text-align:left;
  cursor:pointer;
  transition:.16s ease;
}

.ruyaAdminTeacherRow{
  grid-template-columns:44px minmax(0,1fr) 20px;
}

.ruyaAdminConversationRow{
  grid-template-columns:44px minmax(0,1fr) auto;
}

.ruyaAdminTeacherRow:hover,
.ruyaAdminConversationRow:hover,
.ruyaAdminTeacherRow.active,
.ruyaAdminConversationRow.active{
  border-color:#dce3ef;
  background:#f8faff;
}

.ruyaAdminTeacherAvatar,
.ruyaAdminStudentAvatar{
  display:flex;
  align-items:center;
  justify-content:center;
  width:43px;
  height:43px;
  border-radius:15px;
  background:#edf3ff;
  color:#38598e;
  font-size:11px;
  font-weight:850;
}

.ruyaAdminStudentAvatar{
  background:#f2edff;
  color:#6c59ca;
}

.ruyaAdminTeacherMeta,
.ruyaAdminConversationMeta{
  display:block;
  min-width:0;
}

.ruyaAdminTeacherMeta b,
.ruyaAdminConversationMeta b{
  display:block;
  overflow:hidden;
  color:#2d3f5b;
  font-size:11px;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ruyaAdminTeacherMeta small,
.ruyaAdminConversationMeta small{
  display:block;
  margin-top:3px;
  overflow:hidden;
  color:#929dac;
  font-size:8.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ruyaAdminConversationMeta p{
  margin:5px 0 0;
  overflow:hidden;
  color:#69778d;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ruyaAdminConversationTime{
  align-self:start;
  padding-top:3px;
  color:#9ba5b3;
  font-size:8px;
  white-space:nowrap;
}

.ruyaAdminRowArrow{
  color:#b5bdca;
  font-size:22px;
  font-weight:300;
}

.ruyaAdminThreadHeader{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:66px;
  padding:10px 13px;
  border-bottom:1px solid #edf0f5;
  background:linear-gradient(135deg,#fbfcff,#f6f8fc);
}

.ruyaAdminThreadIdentity{
  min-width:0;
  flex:1 1 auto;
}

.ruyaAdminThreadIdentity b{
  display:block;
  color:#293b57;
  font-size:12px;
  font-weight:850;
}

.ruyaAdminThreadIdentity small{
  display:block;
  margin-top:3px;
  color:#909bac;
  font-size:9px;
}

.ruyaAdminReadOnlyBadge{
  padding:6px 9px;
  border-radius:999px;
  background:#eef3f8;
  color:#687990;
  font-size:8px;
  font-weight:800;
  white-space:nowrap;
}

.ruyaAdminMessageThread{
  flex:1 1 auto;
  min-height:0;
  padding:16px 14px 24px;
  overflow-y:auto;
  background:linear-gradient(180deg,#fcfdff,#f7f9fc);
}

.ruyaAdminMessageThread .chatBubble{
  max-width:min(80%,560px);
  padding:10px 12px 8px;
  border:1px solid #e8ecf2;
  border-radius:17px 17px 17px 5px;
  background:#fff;
  color:#34445c;
  box-shadow:0 5px 15px rgba(46,61,89,.035);
}

.ruyaAdminMessageThread .chatBubbleRow.mine{
  justify-content:flex-end;
}

.ruyaAdminMessageThread .chatBubbleRow.mine .chatBubble{
  border-color:#e1dcf5;
  border-radius:17px 17px 5px 17px;
  background:linear-gradient(135deg,#f1edff,#ebe6fb);
  color:#34445c;
}

.ruyaAdminMessageThread .chatBubble p{
  margin:4px 0 0;
  color:inherit;
  font-size:11px;
  line-height:1.46;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.ruyaAdminMessageSender{
  display:block;
  margin-bottom:2px;
  color:#54647b;
  font-size:8px;
  font-weight:850;
}

.ruyaAdminMessagePlaceholder{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  min-height:420px;
  padding:30px;
  text-align:center;
}

.ruyaAdminPlaceholderIcon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  margin-bottom:12px;
  border-radius:18px;
  background:#f0f3f8;
  font-size:21px;
}

.ruyaAdminMessagePlaceholder b{
  color:#42516a;
  font-size:12px;
}

.ruyaAdminMessagePlaceholder small{
  max-width:260px;
  margin-top:6px;
  color:#98a2b1;
  font-size:9px;
  line-height:1.45;
}

.ruyaAdminMessageLoading{
  padding:30px 15px;
  color:#8793a5;
  text-align:center;
  font-size:10px;
}

.ruyaAdminMobileBack{
  display:none;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:33px;
  height:33px;
  padding:0;
  border:1px solid #e2e7ef;
  border-radius:11px;
  background:#fff;
  color:#334967;
  font-size:23px;
}

.ruyaAdminMessagesPremiumPage > .messagingLayout{
  grid-template-columns:minmax(290px,340px) minmax(0,1fr);
  gap:14px;
}

.ruyaAdminMessagesPremiumPage > .messagingLayout
.conversationList.card,
.ruyaAdminMessagesPremiumPage > .messagingLayout
.conversationThread.card{
  border:1px solid #e7ebf2;
  border-radius:22px;
  background:#fff;
  box-shadow:0 8px 28px rgba(42,55,83,.04);
}

.ruyaAdminSubFlow{
  padding:2px 0 0;
}

.ruyaAdminSubBack{
  margin:0 0 12px;
}

@media(max-width:1100px){
  .ruyaAdminTeacherAudit{
    grid-template-columns:
      minmax(220px,.75fr)
      minmax(260px,.95fr)
      minmax(300px,1.2fr);
  }
}

@media(max-width:780px){

  .ruyaAdminMessagesHeader{
    align-items:stretch;
    flex-direction:column;
    padding:16px;
    border-radius:20px;
  }

  .ruyaAdminMessagesActions{
    justify-content:stretch;
  }

  .ruyaAdminMessageAction{
    flex:1 1 auto;
  }

  .ruyaAdminMessageTabs{
    grid-template-columns:1fr;
    gap:5px;
  }

  .ruyaAdminTeacherAudit{
    display:block;
    min-height:0;
  }

  .ruyaAdminTeacherPane,
  .ruyaAdminConversationPane,
  .ruyaAdminThreadPane{
    width:100%;
    max-height:none;
    min-height:0;
    border-radius:20px;
  }

  .ruyaAdminMobileStage0 .ruyaAdminConversationPane,
  .ruyaAdminMobileStage0 .ruyaAdminThreadPane{
    display:none;
  }

  .ruyaAdminMobileStage1 .ruyaAdminTeacherPane,
  .ruyaAdminMobileStage1 .ruyaAdminThreadPane{
    display:none;
  }

  .ruyaAdminMobileStage2 .ruyaAdminTeacherPane,
  .ruyaAdminMobileStage2 .ruyaAdminConversationPane{
    display:none;
  }

  .ruyaAdminTeacherPane,
  .ruyaAdminConversationPane{
    overflow:visible;
  }

  .ruyaAdminThreadPane{
    height:calc(
      100dvh -
      245px -
      env(safe-area-inset-bottom,0px)
    );
    overflow:hidden;
  }

  .ruyaAdminMessageThread{
    min-height:0;
    padding:13px 10px 110px;
    overflow-y:auto;
  }

  .ruyaAdminMobileBack{
    display:flex;
  }

  .ruyaAdminMessageThread .chatBubble{
    max-width:88%;
  }

  .ruyaAdminMessagesPremiumPage > .messagingLayout{
    display:block;
  }

  .ruyaAdminMessagesPremiumPage >
  .messagingLayout:not(.teacherThreadSelected)
  .conversationThread{
    display:none;
  }

  .ruyaAdminMessagesPremiumPage >
  .messagingLayout.teacherThreadSelected
  .conversationList{
    display:none;
  }
}

@media(max-width:520px){
  .ruyaAdminMessagesHeader{
    margin-bottom:11px;
  }

  .ruyaAdminMessagesTitle h2{
    font-size:21px;
  }

  .ruyaAdminMessagesTitle p{
    font-size:10px;
  }

  .ruyaAdminTeacherPane,
  .ruyaAdminConversationPane{
    padding:7px;
  }

  .ruyaAdminTeacherRow,
  .ruyaAdminConversationRow{
    min-height:65px;
  }

  .ruyaAdminReadOnlyBadge{
    display:none;
  }
}


/* ==========================================================
   RUYA ADMIN MESSAGES REFERENCE V2
   first approved reference alignment
   ========================================================== */

.ruyaAdminMessagesReferenceV2{
  padding:0!important;
}

/* ---------- compact page header ---------- */

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessagesHeaderV2{
  min-height:0!important;
  margin:0 0 12px!important;
  padding:15px 18px!important;

  align-items:center!important;

  border-radius:20px!important;

  background:
    linear-gradient(
      135deg,
      #fbfcff 0%,
      #f7f9fd 100%
    )!important;

  box-shadow:
    0 7px 24px
    rgba(42,55,83,.035)!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessagesTitle h2{
  font-size:21px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessagesTitle p{
  margin-top:5px!important;
  font-size:10px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessagesActions{
  flex-wrap:nowrap!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageAction{
  min-height:38px!important;
  padding:0 14px!important;

  border-radius:12px!important;

  font-size:9.5px!important;
}

/* ---------- compact reference tabs ---------- */

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageTabsV2{
  display:flex!important;

  align-items:stretch!important;

  width:max-content!important;
  max-width:100%!important;

  gap:8px!important;

  margin:0 0 13px!important;
  padding:0!important;

  border:0!important;

  background:transparent!important;

  overflow-x:auto!important;
  scrollbar-width:none!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageTabsV2::-webkit-scrollbar{
  display:none!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageTabsV2 button{
  display:grid!important;

  grid-template-columns:
    31px minmax(135px,1fr)!important;

  align-items:center!important;

  gap:9px!important;

  min-width:205px!important;
  min-height:54px!important;

  padding:8px 13px!important;

  border:
    1px solid
    #e4e9f1!important;

  border-radius:15px!important;

  background:#fff!important;

  color:#596a83!important;

  text-align:left!important;

  box-shadow:
    0 5px 16px
    rgba(38,52,79,.035)!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageTabsV2 button.active{
  border-color:#17307a!important;

  background:#17307a!important;

  color:#fff!important;

  box-shadow:
    0 8px 21px
    rgba(23,48,122,.16)!important;
}

.ruyaAdminTabIcon{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  width:31px!important;
  height:31px!important;

  border-radius:10px!important;

  background:#eef3fb!important;

  color:#17307a!important;

  font-size:14px!important;
  font-weight:850!important;
}

.ruyaAdminMessageTabsV2 button.active
.ruyaAdminTabIcon{
  background:
    rgba(255,255,255,.14)!important;

  color:#fff!important;
}

.ruyaAdminTabCopy{
  display:block!important;

  min-width:0!important;
}

.ruyaAdminTabCopy b{
  display:block!important;

  margin:0!important;

  color:inherit!important;

  font-size:10.5px!important;
  line-height:1.15!important;
  font-weight:850!important;
}

.ruyaAdminTabCopy small{
  display:block!important;

  margin-top:3px!important;

  color:#99a3b2!important;

  font-size:8px!important;
  line-height:1.1!important;

  white-space:nowrap!important;
}

.ruyaAdminMessageTabsV2 button.active
.ruyaAdminTabCopy small{
  color:
    rgba(255,255,255,.72)!important;
}

/* ---------- reference workspace ---------- */

.ruyaAdminMessagesWorkspace{
  min-width:0!important;
}

/* ---------- first tab: stronger 3 column reference ---------- */

.ruyaAdminMessagesReferenceV2
.ruyaAdminTeacherAudit{
  grid-template-columns:
    minmax(260px,320px)
    minmax(300px,360px)
    minmax(0,1fr)!important;

  gap:12px!important;

  min-height:600px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminTeacherPane,
.ruyaAdminMessagesReferenceV2
.ruyaAdminConversationPane,
.ruyaAdminMessagesReferenceV2
.ruyaAdminThreadPane{
  border-radius:20px!important;

  border-color:#e5eaf2!important;

  box-shadow:
    0 8px 26px
    rgba(42,55,83,.04)!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminTeacherPane,
.ruyaAdminMessagesReferenceV2
.ruyaAdminConversationPane{
  padding:8px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminPaneHead{
  min-height:52px!important;

  padding:
    4px 5px 8px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminPaneHead h3{
  color:#2b3d59!important;

  font-size:12.5px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminPaneHead small{
  font-size:8px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageSearch{
  min-height:40px!important;

  margin-bottom:8px!important;

  border-radius:13px!important;

  background:#fbfcfe!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminTeacherRow,
.ruyaAdminMessagesReferenceV2
.ruyaAdminConversationRow{
  min-height:64px!important;

  border-radius:15px!important;

  transition:
    background .16s ease,
    border-color .16s ease,
    box-shadow .16s ease!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminTeacherRow:hover,
.ruyaAdminMessagesReferenceV2
.ruyaAdminConversationRow:hover{
  transform:none!important;

  box-shadow:
    0 6px 18px
    rgba(43,59,91,.045)!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminTeacherRow.active,
.ruyaAdminMessagesReferenceV2
.ruyaAdminConversationRow.active{
  border-color:#cbd8ef!important;

  background:#f2f6fd!important;

  box-shadow:
    inset 3px 0 0
    #17307a!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminThreadHeader{
  min-height:62px!important;

  padding:9px 12px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageThread{
  padding:14px 13px 22px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageThread
.chatBubble{
  max-width:min(76%,540px)!important;

  border-radius:
    16px 16px 16px 5px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageThread
.chatBubbleRow.mine
.chatBubble{
  border-radius:
    16px 16px 5px 16px!important;

  background:
    linear-gradient(
      135deg,
      #edf3ff,
      #e8effd
    )!important;

  border-color:#d7e2f5!important;
}

/* ---------- inbox / staff same family ---------- */

.ruyaAdminDirectMessages{
  width:100%!important;
}

.ruyaAdminDirectMessages
.parentMessageHours{
  grid-template-columns:
    34px minmax(0,1fr) auto!important;

  gap:9px!important;

  min-height:48px!important;

  margin:0 0 10px!important;
  padding:8px 11px!important;

  border-radius:15px!important;

  font-size:9px!important;
}

.ruyaAdminDirectMessages
.parentMessageHours>span{
  width:32px!important;
  height:32px!important;

  border-radius:10px!important;
}

.ruyaAdminDirectMessages
.parentMessageHours b{
  font-size:10px!important;
}

.ruyaAdminDirectMessages
.parentMessageHours p{
  margin-top:2px!important;
  font-size:8px!important;
}

.ruyaAdminDirectMessages
.parentMessageHours em{
  font-size:8px!important;
}

.ruyaAdminDirectMessages
.messagingLayout{
  display:grid!important;

  grid-template-columns:
    minmax(285px,330px)
    minmax(0,1fr)!important;

  gap:12px!important;

  min-height:600px!important;
}

.ruyaAdminDirectMessages
.conversationList.card,
.ruyaAdminDirectMessages
.conversationThread.card{
  margin:0!important;

  border:
    1px solid
    #e5eaf2!important;

  border-radius:20px!important;

  background:#fff!important;

  box-shadow:
    0 8px 26px
    rgba(42,55,83,.04)!important;

  overflow:hidden!important;
}

.ruyaAdminDirectMessages
.conversationList{
  max-height:
    calc(100dvh - 270px)!important;

  padding:8px!important;

  overflow-y:auto!important;
}

.ruyaAdminDirectMessages
.conversationList .sectionHead{
  margin:0!important;

  padding:
    5px 5px 10px!important;

  border:0!important;
}

.ruyaAdminDirectMessages
.conversationList .sectionHead h3{
  color:#2b3d59!important;

  font-size:12.5px!important;
  font-weight:850!important;
}

.ruyaAdminDirectMessages
.conversationItem{
  min-height:66px!important;

  margin:0 0 6px!important;

  padding:9px 11px!important;

  border:
    1px solid
    #edf0f5!important;

  border-radius:15px!important;

  background:#fff!important;
}

.ruyaAdminDirectMessages
.conversationItem:hover{
  transform:none!important;

  background:#f8faff!important;

  box-shadow:none!important;
}

.ruyaAdminDirectMessages
.conversationItem.active{
  border-color:#cbd8ef!important;

  background:#f2f6fd!important;

  box-shadow:
    inset 3px 0 0
    #17307a!important;
}

.ruyaAdminDirectMessages
.conversationAvatar{
  width:43px!important;
  height:43px!important;

  border-radius:14px!important;
}

.ruyaAdminDirectMessages
.conversationMeta b{
  color:#2d3f5b!important;

  font-size:11px!important;
}

.ruyaAdminDirectMessages
.conversationMeta small{
  color:#929dac!important;

  font-size:8.5px!important;
}

.ruyaAdminDirectMessages
.conversationMeta p{
  color:#69778d!important;

  font-size:9px!important;
}

.ruyaAdminDirectMessages
.conversationThread{
  min-width:0!important;

  min-height:600px!important;

  max-height:
    calc(100dvh - 270px)!important;
}

.ruyaAdminDirectMessages
.threadHeader{
  min-height:62px!important;

  padding:9px 13px!important;

  border-bottom:
    1px solid
    #edf0f5!important;

  background:
    linear-gradient(
      135deg,
      #fbfcff,
      #f6f8fc
    )!important;
}

.ruyaAdminDirectMessages
.messageThread{
  background:
    linear-gradient(
      180deg,
      #fcfdff,
      #f8f9fc
    )!important;

  padding:
    14px 13px 20px!important;
}

.ruyaAdminDirectMessages
.chatBubble{
  max-width:min(76%,540px)!important;

  border-radius:
    16px 16px 16px 5px!important;

  box-shadow:
    0 5px 15px
    rgba(46,61,89,.03)!important;
}

.ruyaAdminDirectMessages
.chatBubbleRow.mine
.chatBubble{
  border-radius:
    16px 16px 5px 16px!important;

  background:
    linear-gradient(
      135deg,
      #edf3ff,
      #e8effd
    )!important;

  color:#34445c!important;

  border-color:#d7e2f5!important;
}

.ruyaAdminDirectMessages
.replyComposer.messageAttachmentComposer{
  padding:9px 10px!important;

  border-top:
    1px solid
    #edf0f5!important;

  background:#fff!important;
}

.ruyaAdminDirectMessages
.replyComposer textarea{
  border-radius:13px!important;
}

/* ---------- premium modal ---------- */

.ruyaAdminMessagesModalOverlay{
  position:fixed!important;

  z-index:5000!important;

  inset:0!important;

  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  padding:
    24px!important;

  background:
    rgba(19,31,52,.32)!important;

  backdrop-filter:
    blur(5px)!important;
}

.ruyaAdminMessagesModal{
  display:flex!important;

  flex-direction:column!important;

  width:
    min(
      820px,
      calc(100vw - 32px)
    )!important;

  max-height:
    min(
      86dvh,
      850px
    )!important;

  border:
    1px solid
    rgba(255,255,255,.7)!important;

  border-radius:24px!important;

  background:#fff!important;

  box-shadow:
    0 26px 80px
    rgba(18,28,50,.22)!important;

  overflow:hidden!important;
}

.ruyaAdminMessagesModalHead{
  display:flex!important;

  align-items:flex-start!important;
  justify-content:space-between!important;

  gap:18px!important;

  padding:
    18px 20px 15px!important;

  border-bottom:
    1px solid
    #edf0f5!important;

  background:
    linear-gradient(
      135deg,
      #fbfcff,
      #f7f9fd
    )!important;
}

.ruyaAdminMessagesModalHead h3{
  margin:0!important;

  color:#293b57!important;

  font-size:17px!important;
  font-weight:850!important;
}

.ruyaAdminMessagesModalHead p{
  margin:
    5px 0 0!important;

  color:#8b97a8!important;

  font-size:9.5px!important;
}

.ruyaAdminMessagesModalClose{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  flex:0 0 auto!important;

  width:36px!important;
  height:36px!important;

  padding:0!important;

  border:
    1px solid
    #e1e6ee!important;

  border-radius:12px!important;

  background:#fff!important;

  color:#43536c!important;

  font-size:23px!important;
  line-height:1!important;

  cursor:pointer!important;
}

.ruyaAdminMessagesModalBody{
  min-height:0!important;

  padding:16px!important;

  overflow-y:auto!important;

  background:#f9fafc!important;
}

.ruyaAdminMessagesModalBody
>.card,
.ruyaAdminMessagesModalBody
.adminNewMessageCard,
.ruyaAdminMessagesModalBody
.adminNewTeacherMessageCard,
.ruyaAdminMessagesModalBody
.adminBulkMessageCard{
  width:100%!important;
  max-width:none!important;

  margin:0!important;

  border:
    1px solid
    #e8ecf2!important;

  border-radius:18px!important;

  background:#fff!important;

  box-shadow:none!important;
}

/* ---------- mobile ---------- */

@media(max-width:780px){

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminMessagesHeaderV2{
    padding:13px!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminMessagesActions{
    display:grid!important;

    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      )!important;

    width:100%!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminMessageTabsV2{
    width:100%!important;

    overflow-x:auto!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminMessageTabsV2 button{
    flex:
      0 0
      190px!important;

    min-width:190px!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminTeacherAudit{
    min-height:0!important;
  }

  .ruyaAdminDirectMessages
  .messagingLayout{
    display:block!important;

    min-height:0!important;
  }

  .ruyaAdminDirectMessages
  .conversationList,
  .ruyaAdminDirectMessages
  .conversationThread{
    width:100%!important;

    min-height:
      calc(
        100dvh -
        245px
      )!important;

    max-height:none!important;
  }

  .ruyaAdminDirectMessages
  .messagingLayout:not(.teacherThreadSelected)
  .conversationThread{
    display:none!important;
  }

  .ruyaAdminDirectMessages
  .messagingLayout.teacherThreadSelected
  .conversationList{
    display:none!important;
  }

  .ruyaAdminMessagesModalOverlay{
    padding:10px!important;
  }

  .ruyaAdminMessagesModal{
    width:100%!important;

    max-height:
      calc(
        100dvh -
        20px
      )!important;

    border-radius:21px!important;
  }

  .ruyaAdminMessagesModalHead{
    padding:
      15px 15px 12px!important;
  }

  .ruyaAdminMessagesModalBody{
    padding:11px!important;
  }
}

@media(max-width:520px){

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminMessagesTitle h2{
    font-size:19px!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminMessagesActions{
    grid-template-columns:1fr!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminMessageTabsV2 button{
    min-height:51px!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminMessageThread .chatBubble,
  .ruyaAdminDirectMessages
  .chatBubble{
    max-width:87%!important;
  }
}



/* ==========================================================
   RUYA ADMIN MESSAGES V2.2
   Direct tabs aligned with Teacher Conversations
   ========================================================== */

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages{
  width:100%!important;
}

/* window status becomes a small, quiet information strip */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.parentMessageHours{
  min-height:42px!important;
  margin:0 0 12px!important;
  padding:7px 11px!important;

  border:1px solid #e7ebf2!important;
  border-radius:14px!important;

  background:#fbfcfe!important;
  box-shadow:none!important;

  color:#66758b!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.parentMessageHours>span{
  width:29px!important;
  height:29px!important;

  border-radius:9px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.parentMessageHours b{
  color:#33465f!important;
  font-size:9.5px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.parentMessageHours p,
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.parentMessageHours em{
  font-size:8px!important;
}

/* exact same surface language as tab 1 */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.messagingLayout{
  display:grid!important;

  grid-template-columns:
    minmax(300px,340px)
    minmax(0,1fr)!important;

  gap:12px!important;

  min-height:600px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationList.card,
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationThread.card{
  border:1px solid #e5eaf2!important;
  border-radius:20px!important;

  background:#fff!important;

  box-shadow:
    0 8px 26px
    rgba(42,55,83,.04)!important;
}

/* list must visually read: title -> search -> rows */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationList{
  display:flex!important;
  flex-direction:column!important;

  max-height:
    calc(100dvh - 270px)!important;

  padding:8px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationList
.sectionHead{
  order:1!important;

  display:flex!important;

  align-items:center!important;
  justify-content:space-between!important;

  min-height:52px!important;

  margin:0!important;
  padding:4px 5px 8px!important;

  border:0!important;
  background:transparent!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationList
.sectionHead h3{
  margin:0!important;

  color:#2b3d59!important;

  font-size:12.5px!important;
  font-weight:850!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationList
.sectionHead .badge{
  min-width:auto!important;
  height:auto!important;

  padding:4px 7px!important;

  border:1px solid #e6ebf3!important;
  border-radius:999px!important;

  background:#f5f7fb!important;

  color:#7a879a!important;

  font-size:7.5px!important;
  font-weight:800!important;
}

/* search becomes the same full-width search field used in tab 1 */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.teacherMessageSearchDock{
  order:2!important;

  display:block!important;

  width:100%!important;

  margin:0 0 8px!important;
  padding:0!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.teacherMessageSearchToggle{
  display:none!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.teacherMessageSearchField{
  display:flex!important;

  align-items:center!important;

  width:100%!important;
  min-height:40px!important;

  gap:8px!important;

  padding:0 10px!important;

  border:1px solid #e7ebf2!important;
  border-radius:13px!important;

  background:#fbfcfe!important;

  box-shadow:none!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.teacherMessageSearchField svg{
  flex:0 0 auto!important;

  width:15px!important;
  height:15px!important;

  color:#8290a4!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.teacherMessageSearchField input{
  flex:1!important;

  min-width:0!important;

  padding:0!important;

  border:0!important;
  outline:0!important;

  background:transparent!important;

  color:#34465f!important;

  font-size:9.5px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.teacherMessageSearchField button{
  flex:0 0 auto!important;

  width:27px!important;
  height:27px!important;

  padding:0!important;

  border:0!important;
  border-radius:9px!important;

  background:transparent!important;

  color:#8995a6!important;

  font-size:16px!important;
}

/* all list content after the search */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationList>.statusBox,
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationList>.teacherMessagesLoading,
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationList>.modernEmpty,
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationList>.conversationItem{
  order:3!important;
}

/* conversation cards aligned to teacher/parent cards */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationItem{
  display:grid!important;

  grid-template-columns:
    44px minmax(0,1fr) auto!important;

  align-items:center!important;

  gap:10px!important;

  min-height:64px!important;

  margin:0 0 6px!important;
  padding:8px 10px!important;

  border:1px solid #edf0f5!important;
  border-radius:15px!important;

  background:#fff!important;

  text-align:left!important;

  box-shadow:none!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationItem:hover{
  transform:none!important;

  border-color:#dde5f0!important;

  background:#f9fbfe!important;

  box-shadow:
    0 6px 18px
    rgba(43,59,91,.04)!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationItem.active{
  border-color:#cbd8ef!important;

  background:#f2f6fd!important;

  box-shadow:
    inset 3px 0 0
    #17307a!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationAvatar{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  width:44px!important;
  height:44px!important;

  border:1px solid #e1e8f2!important;
  border-radius:14px!important;

  background:#eef3fa!important;

  color:#17307a!important;

  font-size:12px!important;
  font-weight:900!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationMeta{
  min-width:0!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationMeta b{
  display:block!important;

  overflow:hidden!important;

  color:#2d3f5b!important;

  font-size:10.5px!important;
  line-height:1.2!important;
  font-weight:850!important;

  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationMeta small{
  display:block!important;

  margin-top:3px!important;

  color:#919dac!important;

  font-size:8px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationMeta p{
  display:block!important;

  margin:4px 0 0!important;

  overflow:hidden!important;

  color:#69778d!important;

  font-size:8.5px!important;
  line-height:1.2!important;

  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.unreadBubble{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  min-width:21px!important;
  height:21px!important;

  padding:0 6px!important;

  border-radius:999px!important;

  background:#17307a!important;

  color:#fff!important;

  font-size:8px!important;
  font-weight:850!important;
}

/* right side uses the exact visual grammar of tab 1 */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationThread{
  display:flex!important;

  flex-direction:column!important;

  min-width:0!important;
  min-height:600px!important;

  overflow:hidden!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.threadHeader{
  flex:0 0 auto!important;

  min-height:62px!important;

  padding:9px 13px!important;

  border-bottom:1px solid #edf0f5!important;

  background:
    linear-gradient(
      135deg,
      #fbfcff,
      #f6f8fc
    )!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.messageThread{
  flex:1 1 auto!important;

  min-height:0!important;

  padding:14px 13px 20px!important;

  overflow-y:auto!important;

  background:
    linear-gradient(
      180deg,
      #fcfdff,
      #f8f9fc
    )!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.ruyaAdminDirectPlaceholder{
  min-height:100%!important;
}

/* composer is part of the card, not a different design */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.replyComposer.messageAttachmentComposer{
  flex:0 0 auto!important;

  margin:0!important;
  padding:9px 10px!important;

  border:0!important;
  border-top:1px solid #edf0f5!important;

  background:#fff!important;

  box-shadow:none!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.replyComposer textarea{
  min-height:42px!important;

  border:1px solid #e1e7ef!important;
  border-radius:13px!important;

  background:#fbfcfe!important;

  box-shadow:none!important;
}

/* no extra quick-action / overflow treatment */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.quickActions,
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.quickActionMenu{
  display:none!important;
}

/* mobile keeps the same clean list -> thread flow */
@media(max-width:780px){

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .messagingLayout{
    display:block!important;

    min-height:0!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .conversationList,
  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .conversationThread{
    width:100%!important;

    min-height:
      calc(100dvh - 245px)!important;

    max-height:none!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .messagingLayout:not(.teacherThreadSelected)
  .conversationThread{
    display:none!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .messagingLayout.teacherThreadSelected
  .conversationList{
    display:none!important;
  }
}



/* ==========================================================
   RUYA ADMIN MESSAGES V2.3
   visual finalization / unified direct-message workspace
   ========================================================== */

/* Yönetime Gelenler artık diğer sekmelerle aynı hizada başlar.
   Saat kuralı composer tarafından zaten uygulanmaya devam eder. */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectInbox
.parentMessageHours{
  display:none!important;
}

/* ----------------------------------------------------------
   DIRECT THREAD HEADER
   ---------------------------------------------------------- */

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.ruyaAdminDirectThreadHeader{
  display:flex!important;

  align-items:center!important;

  gap:10px!important;

  min-height:62px!important;

  padding:9px 13px!important;

  border-bottom:1px solid #edf0f5!important;

  background:
    linear-gradient(
      135deg,
      #fbfcff 0%,
      #f7f9fd 100%
    )!important;
}

.ruyaAdminDirectThreadAvatar{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  flex:0 0 auto!important;

  width:42px!important;
  height:42px!important;

  border:1px solid #e2e8f2!important;

  border-radius:14px!important;

  background:#eef3fa!important;

  color:#17307a!important;

  font-size:11px!important;
  font-weight:900!important;
}

.ruyaAdminDirectThreadIdentity{
  display:flex!important;

  flex-direction:column!important;

  justify-content:center!important;

  min-width:0!important;
}

.ruyaAdminDirectThreadIdentity b{
  display:block!important;

  margin:0!important;

  overflow:hidden!important;

  color:#2c3e5b!important;

  font-size:11px!important;
  line-height:1.2!important;
  font-weight:850!important;

  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.ruyaAdminDirectThreadIdentity small{
  display:block!important;

  margin-top:3px!important;

  color:#8c98a9!important;

  font-size:8px!important;
  line-height:1.2!important;
}

/* ----------------------------------------------------------
   DIRECT MESSAGE THREAD
   ---------------------------------------------------------- */

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.messageThread{
  padding:14px 13px 20px!important;

  background:
    linear-gradient(
      180deg,
      #fcfdff 0%,
      #f8f9fc 100%
    )!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.chatBubbleRow{
  margin-bottom:9px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.chatBubble{
  max-width:min(72%,540px)!important;

  padding:9px 11px!important;

  border:1px solid #e5eaf2!important;

  border-radius:
    16px 16px 16px 5px!important;

  background:#fff!important;

  box-shadow:
    0 5px 16px
    rgba(42,55,83,.035)!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.chatBubbleRow.mine
.chatBubble{
  border-color:#d6e1f4!important;

  border-radius:
    16px 16px 5px 16px!important;

  background:
    linear-gradient(
      135deg,
      #eef4ff 0%,
      #e8f0fd 100%
    )!important;

  color:#33445e!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.chatBubble p{
  margin:0!important;

  color:inherit!important;

  font-size:9.5px!important;
  line-height:1.45!important;
  font-weight:500!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.chatMeta{
  margin-top:6px!important;

  color:#8c97a7!important;

  font-size:7.5px!important;
  line-height:1.1!important;
}

/* ----------------------------------------------------------
   PREMIUM COMPOSER
   ---------------------------------------------------------- */

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.replyComposer.messageAttachmentComposer{
  display:grid!important;

  grid-template-columns:
    minmax(0,1fr)
    auto!important;

  align-items:end!important;

  gap:9px!important;

  margin:0!important;

  padding:9px 10px!important;

  border:0!important;
  border-top:1px solid #edf0f5!important;

  background:#fff!important;

  box-shadow:none!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.messageComposerMain{
  display:flex!important;

  flex-direction:column!important;

  min-width:0!important;

  gap:6px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.replyComposer textarea{
  display:block!important;

  width:100%!important;

  min-height:44px!important;
  max-height:105px!important;

  padding:11px 12px!important;

  resize:vertical!important;

  border:1px solid #e0e6ef!important;
  border-radius:13px!important;

  outline:none!important;

  background:#fbfcfe!important;

  color:#34455e!important;

  font-size:9.5px!important;
  line-height:1.4!important;

  box-shadow:none!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.replyComposer textarea:focus{
  border-color:#bccbea!important;

  background:#fff!important;

  box-shadow:
    0 0 0 3px
    rgba(23,48,122,.055)!important;
}

/* Generic old red submit button is overridden only here. */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.replyComposer>button[type="submit"]{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  min-width:88px!important;
  height:44px!important;

  margin:0!important;
  padding:0 15px!important;

  border:0!important;

  border-radius:13px!important;

  background:#17307a!important;

  color:#fff!important;

  font-size:9.5px!important;
  font-weight:850!important;

  box-shadow:
    0 7px 18px
    rgba(23,48,122,.16)!important;

  cursor:pointer!important;

  transition:
    transform .15s ease,
    box-shadow .15s ease,
    opacity .15s ease!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.replyComposer>button[type="submit"]:hover:not(:disabled){
  transform:translateY(-1px)!important;

  box-shadow:
    0 9px 21px
    rgba(23,48,122,.20)!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.replyComposer>button[type="submit"]:disabled{
  opacity:.45!important;

  cursor:not-allowed!important;

  transform:none!important;

  box-shadow:none!important;
}

/* attachment area stays subtle */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.messageComposerMain
.messageAttachmentPicker{
  margin:0!important;
}

/* ----------------------------------------------------------
   EMPTY / LOADING STATES
   ---------------------------------------------------------- */

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationPlaceholder{
  color:#7f8ca0!important;

  font-size:10px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.ruyaAdminDirectPlaceholder{
  min-height:100%!important;

  background:transparent!important;
}

/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media(max-width:780px){

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .chatBubble{
    max-width:86%!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .replyComposer.messageAttachmentComposer{
    grid-template-columns:
      minmax(0,1fr)
      auto!important;

    padding:8px!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .replyComposer>button[type="submit"]{
    min-width:72px!important;

    padding:0 11px!important;
  }
}

@media(max-width:520px){

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .ruyaAdminDirectThreadHeader{
    min-height:58px!important;

    padding:8px 10px!important;
  }

  .ruyaAdminDirectThreadAvatar{
    width:39px!important;
    height:39px!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .chatBubble{
    max-width:89%!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .replyComposer.messageAttachmentComposer{
    gap:7px!important;
  }
}



/* ==========================================================
   RUYA ADMIN MESSAGES V2.4
   modal/readability/select normalization
   ========================================================== */

/* ----------------------------------------------------------
   MODAL: redundant inner headers
   ---------------------------------------------------------- */

.ruyaAdminMessagesModalBody
.adminNewMessageCard
>.sectionHead{
  display:none!important;
}

.ruyaAdminMessagesModalBody
.adminBulkMessageCard
>h3{
  display:none!important;
}

/* inner cards should feel like form surfaces, not second modals */
.ruyaAdminMessagesModalBody
.adminNewMessageCard,
.ruyaAdminMessagesModalBody
.adminNewTeacherMessageCard,
.ruyaAdminMessagesModalBody
.adminBulkMessageCard{
  padding:18px!important;

  border:1px solid #e6ebf2!important;
  border-radius:18px!important;

  background:#fff!important;
}

/* ----------------------------------------------------------
   FORM LABELS
   ---------------------------------------------------------- */

.ruyaAdminMessagesModalBody
.field label{
  display:block!important;

  margin:0 0 7px!important;

  color:#56657a!important;

  font-size:10px!important;
  line-height:1.2!important;
  font-weight:750!important;
}

/* ----------------------------------------------------------
   SELECT FIX
   Critical: selected text readable while closed
   ---------------------------------------------------------- */

.ruyaAdminMessagesModalBody
.adminNewMessageCard select,
.ruyaAdminMessagesModalBody
.adminNewTeacherMessageCard select,
.ruyaAdminMessagesModalBody
.adminBulkMessageCard select{
  display:block!important;

  width:100%!important;
  height:44px!important;

  padding:0 38px 0 12px!important;

  border:1px solid #dce4ee!important;
  border-radius:12px!important;

  background-color:#fbfcfe!important;

  color:#2f405a!important;
  -webkit-text-fill-color:#2f405a!important;

  font-size:11px!important;
  line-height:normal!important;
  font-weight:650!important;

  opacity:1!important;

  box-shadow:none!important;
}

.ruyaAdminMessagesModalBody
.adminNewMessageCard select:focus,
.ruyaAdminMessagesModalBody
.adminNewTeacherMessageCard select:focus,
.ruyaAdminMessagesModalBody
.adminBulkMessageCard select:focus{
  border-color:#afc0e2!important;

  outline:none!important;

  background-color:#fff!important;

  box-shadow:
    0 0 0 3px
    rgba(23,48,122,.06)!important;
}

.ruyaAdminMessagesModalBody select option{
  background:#fff!important;

  color:#24344d!important;

  font-size:12px!important;
  font-weight:500!important;
}

/* ----------------------------------------------------------
   TEXTAREA
   ---------------------------------------------------------- */

.ruyaAdminMessagesModalBody
.adminNewMessageCard textarea,
.ruyaAdminMessagesModalBody
.adminNewTeacherMessageCard textarea,
.ruyaAdminMessagesModalBody
.adminBulkMessageCard textarea{
  width:100%!important;

  min-height:128px!important;

  padding:12px 13px!important;

  border:1px solid #dce4ee!important;
  border-radius:12px!important;

  outline:none!important;

  background:#fbfcfe!important;

  color:#2e4059!important;
  -webkit-text-fill-color:#2e4059!important;

  font-size:11px!important;
  line-height:1.5!important;

  box-shadow:none!important;
}

.ruyaAdminMessagesModalBody
.adminNewMessageCard textarea:focus,
.ruyaAdminMessagesModalBody
.adminNewTeacherMessageCard textarea:focus,
.ruyaAdminMessagesModalBody
.adminBulkMessageCard textarea:focus{
  border-color:#afc0e2!important;

  background:#fff!important;

  box-shadow:
    0 0 0 3px
    rgba(23,48,122,.06)!important;
}

/* ----------------------------------------------------------
   NEW MESSAGE ACTIONS
   ---------------------------------------------------------- */

.ruyaAdminMessagesModalBody
.adminNewMessageActions{
  display:flex!important;

  align-items:center!important;
  justify-content:flex-end!important;

  gap:8px!important;

  margin-top:16px!important;
}

.ruyaAdminMessagesModalBody
.adminNewMessageActions
>button{
  min-height:42px!important;

  padding:0 16px!important;

  border-radius:12px!important;

  font-size:10px!important;
  font-weight:800!important;
}

/* cancel */
.ruyaAdminMessagesModalBody
.adminNewMessageActions
>button:first-child{
  border:1px solid #dde4ed!important;

  background:#fff!important;

  color:#617087!important;

  box-shadow:none!important;
}

/* submit / Btn - remove purple legacy language */
.ruyaAdminMessagesModalBody
.adminNewMessageActions
>button:last-child{
  border:0!important;

  background:#17307a!important;

  color:#fff!important;

  box-shadow:
    0 7px 18px
    rgba(23,48,122,.16)!important;
}

/* ----------------------------------------------------------
   BULK MESSAGE LAYOUT + BUTTON
   ---------------------------------------------------------- */

.ruyaAdminMessagesModalBody
.adminBulkMessageCard{
  display:block!important;
}

.ruyaAdminMessagesModalBody
.adminBulkMessageCard
.formGrid{
  gap:12px!important;
}

.ruyaAdminMessagesModalBody
.adminBulkMessageCard
>button:last-child{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  width:max-content!important;
  min-width:112px!important;
  min-height:42px!important;

  margin:16px 0 0 auto!important;

  padding:0 16px!important;

  border:0!important;
  border-radius:12px!important;

  background:#17307a!important;

  color:#fff!important;

  font-size:10px!important;
  font-weight:850!important;

  box-shadow:
    0 7px 18px
    rgba(23,48,122,.16)!important;
}

.ruyaAdminMessagesModalBody
.adminBulkMessageCard
>button:last-child:disabled,
.ruyaAdminMessagesModalBody
.adminNewMessageActions
>button:last-child:disabled{
  opacity:.46!important;

  box-shadow:none!important;

  cursor:not-allowed!important;
}

/* ----------------------------------------------------------
   ATTACHMENT PICKER INSIDE MODAL
   ---------------------------------------------------------- */

.ruyaAdminMessagesModalBody
.messageAttachmentPicker{
  margin-top:8px!important;
}

/* ----------------------------------------------------------
   CONVERSATION READABILITY - ALL 3 TABS
   ---------------------------------------------------------- */

/* Teacher audit: list */
.ruyaAdminMessagesReferenceV2
.ruyaAdminTeacherMeta b,
.ruyaAdminMessagesReferenceV2
.ruyaAdminConversationMeta b{
  font-size:11.2px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminTeacherMeta small,
.ruyaAdminMessagesReferenceV2
.ruyaAdminConversationMeta small{
  font-size:8.8px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminConversationMeta p{
  font-size:9.4px!important;
  line-height:1.35!important;
}

/* Teacher audit: thread */
.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageThread
.chatBubble p{
  font-size:10.7px!important;
  line-height:1.5!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminMessageThread
.chatMeta{
  font-size:8px!important;
}

/* Direct inbox/staff: list */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationMeta b{
  font-size:11.2px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationMeta small{
  font-size:8.8px!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.conversationMeta p{
  font-size:9.4px!important;
  line-height:1.35!important;
}

/* Direct inbox/staff: thread */
.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.chatBubble p{
  font-size:10.7px!important;
  line-height:1.5!important;
}

.ruyaAdminMessagesReferenceV2
.ruyaAdminDirectMessages
.chatMeta{
  font-size:8px!important;
}

/* Direct thread person identity slightly easier to read */
.ruyaAdminDirectThreadIdentity b{
  font-size:11.5px!important;
}

.ruyaAdminDirectThreadIdentity small{
  font-size:8.6px!important;
}

/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media(max-width:780px){

  .ruyaAdminMessagesModalBody
  .adminNewMessageCard,
  .ruyaAdminMessagesModalBody
  .adminNewTeacherMessageCard,
  .ruyaAdminMessagesModalBody
  .adminBulkMessageCard{
    padding:13px!important;
  }

  .ruyaAdminMessagesModalBody
  .formGrid{
    grid-template-columns:1fr!important;
  }

  .ruyaAdminMessagesModalBody
  .adminNewMessageActions{
    display:grid!important;

    grid-template-columns:
      1fr 1fr!important;

    width:100%!important;
  }

  .ruyaAdminMessagesModalBody
  .adminNewMessageActions
  >button{
    width:100%!important;
  }

  .ruyaAdminMessagesModalBody
  .adminBulkMessageCard
  >button:last-child{
    width:100%!important;

    margin-top:14px!important;
  }

  .ruyaAdminMessagesReferenceV2
  .ruyaAdminMessageThread
  .chatBubble p,
  .ruyaAdminMessagesReferenceV2
  .ruyaAdminDirectMessages
  .chatBubble p{
    font-size:11px!important;
  }
}



/* ==========================================================
   RUYA ADMIN MESSAGES V2.5
   unified premium modal standard
   ========================================================== */

/* ---------- modal shell ---------- */

.ruyaAdminMessagesModal{
  width:min(760px,calc(100vw - 32px))!important;

  border:1px solid rgba(255,255,255,.86)!important;
  border-radius:22px!important;

  background:#fff!important;

  box-shadow:
    0 28px 80px
    rgba(20,31,52,.24)!important;
}

.ruyaAdminMessagesModalHead{
  padding:18px 20px 16px!important;

  border-bottom:1px solid #e9edf3!important;

  background:
    linear-gradient(
      135deg,
      #fbfcff 0%,
      #f7f9fd 100%
    )!important;
}

.ruyaAdminMessagesModalHead h3{
  color:#293b57!important;

  font-size:16px!important;
  line-height:1.2!important;
  font-weight:850!important;
}

.ruyaAdminMessagesModalHead p{
  margin-top:5px!important;

  color:#8794a7!important;

  font-size:9.5px!important;
}

.ruyaAdminMessagesModalClose{
  width:36px!important;
  height:36px!important;

  border:1px solid #dfe5ee!important;
  border-radius:11px!important;

  background:#fff!important;

  color:#40516b!important;

  box-shadow:none!important;
}

/* ---------- remove inner-modal / second-card effect ---------- */

.ruyaAdminMessagesModalBody{
  padding:0!important;

  background:#fff!important;
}

.ruyaAdminMessagesModalBody
.adminNewMessageCard,
.ruyaAdminMessagesModalBody
.adminNewTeacherMessageCard,
.ruyaAdminMessagesModalBody
.adminBulkMessageCard{
  width:100%!important;

  margin:0!important;
  padding:20px!important;

  border:0!important;
  border-radius:0!important;

  background:#fff!important;

  box-shadow:none!important;
}

/* redundant inner headings remain hidden */
.ruyaAdminMessagesModalBody
.adminNewMessageCard
>.sectionHead,
.ruyaAdminMessagesModalBody
.adminBulkMessageCard
>h3{
  display:none!important;
}

/* ---------- form spacing ---------- */

.ruyaAdminMessagesModalBody
.formGrid{
  gap:12px!important;

  margin:0 0 14px!important;
}

.ruyaAdminMessagesModalBody
.field{
  margin-bottom:14px!important;
}

.ruyaAdminMessagesModalBody
.formGrid .field{
  margin-bottom:0!important;
}

.ruyaAdminMessagesModalBody
.field label{
  margin-bottom:7px!important;

  color:#526178!important;

  font-size:10px!important;
  font-weight:800!important;
}

/* ---------- select: keep V2.4 readability ---------- */

.ruyaAdminMessagesModalBody select{
  height:44px!important;

  padding:0 38px 0 12px!important;

  border:1px solid #dce4ee!important;
  border-radius:11px!important;

  background-color:#fbfcfe!important;

  color:#2e4059!important;
  -webkit-text-fill-color:#2e4059!important;

  font-size:11px!important;
  font-weight:650!important;

  opacity:1!important;

  box-shadow:none!important;
}

.ruyaAdminMessagesModalBody select:focus{
  border-color:#aebfe1!important;

  outline:none!important;

  background:#fff!important;

  box-shadow:
    0 0 0 3px
    rgba(23,48,122,.055)!important;
}

.ruyaAdminMessagesModalBody select option{
  color:#25364f!important;

  background:#fff!important;

  font-size:12px!important;
}

/* ---------- textarea ---------- */

.ruyaAdminMessagesModalBody textarea{
  min-height:138px!important;

  padding:12px 13px!important;

  border:1px solid #dce4ee!important;
  border-radius:11px!important;

  background:#fbfcfe!important;

  color:#2f4059!important;
  -webkit-text-fill-color:#2f4059!important;

  font-size:11px!important;
  line-height:1.5!important;

  outline:none!important;

  box-shadow:none!important;
}

.ruyaAdminMessagesModalBody textarea:focus{
  border-color:#aebfe1!important;

  background:#fff!important;

  box-shadow:
    0 0 0 3px
    rgba(23,48,122,.055)!important;
}

/* ---------- attachments ---------- */

.ruyaAdminMessagesModalBody
.messageAttachmentPicker{
  margin:0!important;
}

/* ---------- footer ---------- */

.ruyaAdminMessagesModalBody
.adminNewMessageActions{
  display:flex!important;

  align-items:center!important;
  justify-content:flex-end!important;

  gap:9px!important;

  margin:18px -20px -20px!important;
  padding:14px 20px!important;

  border-top:1px solid #edf0f5!important;

  background:#fbfcfe!important;
}

/* neutral cancel */
.ruyaAdminMessagesModalBody
.ruyaAdminModalCancelButton{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  min-width:84px!important;
  height:42px!important;

  padding:0 15px!important;

  border:1px solid #dce3ec!important;
  border-radius:11px!important;

  background:#fff!important;
  background-image:none!important;

  color:#617087!important;

  font-size:10px!important;
  font-weight:800!important;

  box-shadow:none!important;

  cursor:pointer!important;
}

/* IMPORTANT:
   fully detach legacy .btn.primary purple styling */
.ruyaAdminMessagesModalBody
.btn.ruyaAdminModalPrimaryButton,
.ruyaAdminMessagesModalBody
.ruyaAdminModalPrimaryButton{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  min-width:112px!important;
  height:42px!important;

  padding:0 16px!important;

  border:0!important;
  border-color:transparent!important;
  border-radius:11px!important;

  background:#17307a!important;
  background-color:#17307a!important;
  background-image:none!important;

  color:#fff!important;
  -webkit-text-fill-color:#fff!important;

  font-size:10px!important;
  font-weight:850!important;

  text-shadow:none!important;

  box-shadow:
    0 7px 18px
    rgba(23,48,122,.17)!important;

  cursor:pointer!important;

  opacity:1!important;

  filter:none!important;
}

.ruyaAdminMessagesModalBody
.btn.ruyaAdminModalPrimaryButton:hover:not(:disabled),
.ruyaAdminMessagesModalBody
.ruyaAdminModalPrimaryButton:hover:not(:disabled){
  background:#142a6c!important;
  background-color:#142a6c!important;
  background-image:none!important;

  transform:translateY(-1px)!important;

  box-shadow:
    0 9px 20px
    rgba(23,48,122,.20)!important;
}

.ruyaAdminMessagesModalBody
.btn.ruyaAdminModalPrimaryButton:disabled,
.ruyaAdminMessagesModalBody
.ruyaAdminModalPrimaryButton:disabled{
  background:#aab6d3!important;
  background-color:#aab6d3!important;
  background-image:none!important;

  color:#fff!important;
  -webkit-text-fill-color:#fff!important;

  opacity:1!important;

  box-shadow:none!important;

  cursor:not-allowed!important;

  transform:none!important;
}

/* ---------- bulk modal footer ---------- */

.ruyaAdminMessagesModalBody
.adminBulkMessageCard
.ruyaAdminBulkPrimaryButton{
  margin:18px 0 0 auto!important;
}

/* remove V2.4 generic rule side-effects */
.ruyaAdminMessagesModalBody
.adminBulkMessageCard
>button:last-child{
  background:#17307a!important;
  background-color:#17307a!important;
  background-image:none!important;

  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

/* ---------- mobile ---------- */

@media(max-width:780px){

  .ruyaAdminMessagesModal{
    width:100%!important;

    max-height:
      calc(100dvh - 20px)!important;

    border-radius:20px!important;
  }

  .ruyaAdminMessagesModalBody
  .adminNewMessageCard,
  .ruyaAdminMessagesModalBody
  .adminNewTeacherMessageCard,
  .ruyaAdminMessagesModalBody
  .adminBulkMessageCard{
    padding:14px!important;
  }

  .ruyaAdminMessagesModalBody
  .formGrid{
    grid-template-columns:1fr!important;
  }

  .ruyaAdminMessagesModalBody
  .adminNewMessageActions{
    margin:16px -14px -14px!important;
    padding:12px 14px!important;

    grid-template-columns:none!important;
  }

  .ruyaAdminMessagesModalBody
  .ruyaAdminModalCancelButton,
  .ruyaAdminMessagesModalBody
  .btn.ruyaAdminModalPrimaryButton{
    min-width:0!important;

    flex:1 1 0!important;
  }

  .ruyaAdminMessagesModalBody
  .adminBulkMessageCard
  .ruyaAdminBulkPrimaryButton{
    width:100%!important;

    margin-top:16px!important;
  }
}



/* ==========================================================
   RUYA ADMIN MESSAGES V2.6
   no legacy Btn / final modal buttons
   ========================================================== */

/* modal proportions */
.ruyaAdminMessagesModal{
  width:min(720px,calc(100vw - 32px))!important;
}

.ruyaAdminMessagesModalHead{
  padding:17px 20px 15px!important;
}

.ruyaAdminMessagesModalBody
.adminNewMessageCard,
.ruyaAdminMessagesModalBody
.adminNewTeacherMessageCard,
.ruyaAdminMessagesModalBody
.adminBulkMessageCard{
  padding:18px 20px!important;
}

/* clean premium footer */
.ruyaAdminMessagesModalBody
.adminNewMessageActions{
  display:flex!important;

  align-items:center!important;
  justify-content:flex-end!important;

  gap:8px!important;

  margin:
    18px -20px -18px!important;

  padding:
    13px 20px!important;

  border-top:
    1px solid #e9edf3!important;

  background:#f8fafd!important;
}

.ruyaAdminMessagesModalBody
.ruyaAdminBulkActions{
  margin-top:18px!important;
}

/* cancel */
.ruyaAdminMessagesModalBody
.ruyaAdminModalCancelButton{
  min-width:84px!important;
  height:40px!important;

  padding:0 15px!important;

  border:
    1px solid #dce3ec!important;

  border-radius:11px!important;

  background:#fff!important;
  background-image:none!important;

  color:#607088!important;
  -webkit-text-fill-color:#607088!important;

  font-size:10px!important;
  font-weight:800!important;

  box-shadow:none!important;
}

/* NEW submit button.
   No .btn / .primary classes at all. */
.ruyaAdminMessagesModalBody
button.ruyaAdminModalSubmit{
  appearance:none!important;
  -webkit-appearance:none!important;

  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  min-width:116px!important;
  height:40px!important;

  padding:0 17px!important;

  border:0!important;
  border-radius:11px!important;

  background:#17307a!important;
  background-color:#17307a!important;
  background-image:none!important;

  color:#fff!important;
  -webkit-text-fill-color:#fff!important;

  font-size:10px!important;
  font-weight:850!important;

  text-shadow:none!important;

  box-shadow:
    0 7px 17px
    rgba(23,48,122,.16)!important;

  filter:none!important;

  opacity:1!important;

  cursor:pointer!important;
}

.ruyaAdminMessagesModalBody
button.ruyaAdminModalSubmit:hover:not(:disabled){
  background:#122966!important;
  background-color:#122966!important;
  background-image:none!important;

  transform:translateY(-1px)!important;
}

.ruyaAdminMessagesModalBody
button.ruyaAdminModalSubmit:disabled{
  background:#aab6ce!important;
  background-color:#aab6ce!important;
  background-image:none!important;

  color:#fff!important;
  -webkit-text-fill-color:#fff!important;

  opacity:1!important;

  box-shadow:none!important;

  cursor:not-allowed!important;

  transform:none!important;
}

/* Kill any legacy purple styles left from earlier versions */
.ruyaAdminMessagesModalBody
.btn.primary,
.ruyaAdminMessagesModalBody
.btn.ruyaAdminModalPrimaryButton{
  background-image:none!important;
}

/* nicer field rhythm */
.ruyaAdminMessagesModalBody
.field{
  margin-bottom:13px!important;
}

.ruyaAdminMessagesModalBody textarea{
  min-height:125px!important;
}

/* Toplu form uses same exact footer spacing */
.ruyaAdminMessagesModalBody
.adminBulkMessageCard
.adminNewMessageActions{
  margin:
    18px -20px -18px!important;
}

/* mobile */
@media(max-width:780px){

  .ruyaAdminMessagesModalBody
  .adminNewMessageCard,
  .ruyaAdminMessagesModalBody
  .adminNewTeacherMessageCard,
  .ruyaAdminMessagesModalBody
  .adminBulkMessageCard{
    padding:14px!important;
  }

  .ruyaAdminMessagesModalBody
  .adminNewMessageActions{
    display:grid!important;

    grid-template-columns:
      1fr 1fr!important;

    margin:
      16px -14px -14px!important;

    padding:12px 14px!important;
  }

  .ruyaAdminMessagesModalBody
  .ruyaAdminModalCancelButton,
  .ruyaAdminMessagesModalBody
  button.ruyaAdminModalSubmit{
    width:100%!important;

    min-width:0!important;
  }

}



/* ==========================================================
   RUYA ADMIN MESSAGES V2.7
   searchable parent picker
   ========================================================== */

.ruyaAdminParentPickerField{
  position:relative!important;

  z-index:20!important;
}

.ruyaAdminParentPicker{
  position:relative!important;

  width:100%!important;
}

.ruyaAdminParentPickerInput{
  display:flex!important;

  align-items:center!important;

  width:100%!important;
  height:44px!important;

  gap:8px!important;

  padding:0 9px 0 11px!important;

  border:1px solid #dce4ee!important;
  border-radius:11px!important;

  background:#fbfcfe!important;

  transition:
    border-color .15s ease,
    box-shadow .15s ease!important;
}

.ruyaAdminParentPicker.open
.ruyaAdminParentPickerInput{
  border-color:#aebfe1!important;

  background:#fff!important;

  box-shadow:
    0 0 0 3px
    rgba(23,48,122,.055)!important;
}

.ruyaAdminParentPickerSearchIcon{
  flex:0 0 auto!important;

  color:#8390a3!important;

  font-size:15px!important;
  line-height:1!important;
}

.ruyaAdminParentPickerInput input{
  flex:1 1 auto!important;

  min-width:0!important;
  height:100%!important;

  padding:0!important;

  border:0!important;
  outline:0!important;

  background:transparent!important;

  color:#2e4059!important;
  -webkit-text-fill-color:#2e4059!important;

  font-size:11px!important;
  font-weight:600!important;

  box-shadow:none!important;
}

.ruyaAdminParentPickerInput input::placeholder{
  color:#8e99a9!important;

  opacity:1!important;
}

.ruyaAdminParentPickerClear{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  flex:0 0 auto!important;

  width:27px!important;
  height:27px!important;

  padding:0!important;

  border:0!important;
  border-radius:8px!important;

  background:#f0f3f8!important;

  color:#68778d!important;

  font-size:16px!important;
  line-height:1!important;

  cursor:pointer!important;
}

.ruyaAdminParentPickerResults{
  position:absolute!important;

  z-index:120!important;

  top:calc(100% + 6px)!important;
  left:0!important;
  right:0!important;

  max-height:300px!important;

  padding:6px!important;

  overflow-y:auto!important;

  border:1px solid #dfe5ee!important;
  border-radius:14px!important;

  background:#fff!important;

  box-shadow:
    0 16px 38px
    rgba(27,39,61,.14)!important;
}

.ruyaAdminParentPickerRow{
  display:grid!important;

  grid-template-columns:
    40px minmax(0,1fr)!important;

  align-items:center!important;

  gap:9px!important;

  width:100%!important;

  min-height:57px!important;

  margin:0 0 4px!important;
  padding:7px 8px!important;

  border:1px solid transparent!important;
  border-radius:11px!important;

  background:#fff!important;

  text-align:left!important;

  cursor:pointer!important;
}

.ruyaAdminParentPickerRow:last-child{
  margin-bottom:0!important;
}

.ruyaAdminParentPickerRow:hover{
  border-color:#e0e7f1!important;

  background:#f5f8fd!important;
}

.ruyaAdminParentPickerAvatar{
  display:flex!important;

  align-items:center!important;
  justify-content:center!important;

  width:40px!important;
  height:40px!important;

  border-radius:12px!important;

  background:#eef3fa!important;

  color:#17307a!important;

  font-size:10px!important;
  font-weight:900!important;
}

.ruyaAdminParentPickerMeta{
  display:block!important;

  min-width:0!important;
}

.ruyaAdminParentPickerMeta b{
  display:block!important;

  overflow:hidden!important;

  color:#2d3f5a!important;

  font-size:10.5px!important;
  font-weight:850!important;

  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.ruyaAdminParentPickerMeta small{
  display:block!important;

  margin-top:2px!important;

  overflow:hidden!important;

  color:#7e8b9d!important;

  font-size:8.5px!important;

  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.ruyaAdminParentPickerMeta p{
  display:block!important;

  margin:3px 0 0!important;

  overflow:hidden!important;

  color:#53637a!important;

  font-size:9px!important;
  line-height:1.25!important;

  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.ruyaAdminParentPickerEmpty{
  padding:18px 12px!important;

  color:#8290a3!important;

  font-size:9.5px!important;

  text-align:center!important;
}

.ruyaAdminParentPickerSelected{
  display:block!important;

  margin-top:6px!important;

  color:#718096!important;

  font-size:8.5px!important;
}

/* selected student's normal select remains underneath */
.ruyaAdminMessagesModalBody
.adminNewMessageCard
.formGrid{
  align-items:start!important;
}

/* mobile dropdown */
@media(max-width:780px){

  .ruyaAdminParentPickerResults{
    max-height:260px!important;
  }

  .ruyaAdminParentPickerRow{
    min-height:60px!important;
  }

}



/* ==========================================================
   RUYA ADMIN MESSAGES V2.8
   modern parent loading
   ========================================================== */

.ruyaAdminParentLoading{
  display:flex!important;
  flex-direction:column!important;

  align-items:center!important;
  justify-content:center!important;

  min-height:265px!important;

  padding:34px 28px!important;

  text-align:center!important;

  background:#fff!important;
}

.ruyaAdminParentLoadingSpinner{
  width:42px!important;
  height:42px!important;

  margin-bottom:15px!important;

  border:3px solid #e6ebf3!important;
  border-top-color:#17307a!important;
  border-radius:50%!important;

  animation:
    ruyaAdminParentLoadingSpin .8s linear infinite!important;
}

@keyframes ruyaAdminParentLoadingSpin{
  to{
    transform:rotate(360deg);
  }
}

.ruyaAdminParentLoadingCopy b{
  display:block!important;

  color:#263b5a!important;

  font-size:12px!important;
  font-weight:850!important;
}

.ruyaAdminParentLoadingCopy span{
  display:block!important;

  margin-top:5px!important;

  color:#8490a2!important;

  font-size:9.5px!important;
  font-weight:600!important;
}

.ruyaAdminParentLoadingSkeleton{
  display:grid!important;

  width:min(380px,100%)!important;

  gap:7px!important;

  margin-top:22px!important;
}

.ruyaAdminParentLoadingSkeleton span{
  display:block!important;

  height:9px!important;

  border-radius:999px!important;

  background:
    linear-gradient(
      90deg,
      #eef2f7 20%,
      #f8fafc 45%,
      #eef2f7 70%
    )!important;

  background-size:220% 100%!important;

  animation:
    ruyaAdminParentSkeleton 1.35s ease-in-out infinite!important;
}

.ruyaAdminParentLoadingSkeleton span:nth-child(1){
  width:100%!important;
}

.ruyaAdminParentLoadingSkeleton span:nth-child(2){
  width:82%!important;

  justify-self:center!important;
}

.ruyaAdminParentLoadingSkeleton span:nth-child(3){
  width:64%!important;

  justify-self:center!important;
}

@keyframes ruyaAdminParentSkeleton{
  0%{
    background-position:100% 0;
  }

  100%{
    background-position:-100% 0;
  }
}

@media(max-width:780px){

  .ruyaAdminParentLoading{
    min-height:230px!important;

    padding:28px 18px!important;
  }

}



/* ==========================================================
   RUYA ADMIN MESSAGES V2.9
   MOBILE VIEWPORT PORTAL + SCROLL LOCK
   ========================================================== */

@media(max-width:780px){

  body.ruyaAdminMessagesModalOpen{
    overscroll-behavior:none!important;
  }

  .ruyaAdminMessagesModalOverlay{
    position:fixed!important;

    inset:0!important;

    width:100vw!important;
    height:100dvh!important;

    box-sizing:border-box!important;

    display:flex!important;

    align-items:flex-start!important;
    justify-content:center!important;

    padding:
      calc(
        10px +
        env(safe-area-inset-top,0px)
      )
      10px
      calc(
        10px +
        env(safe-area-inset-bottom,0px)
      )!important;

    overflow:hidden!important;

    overscroll-behavior:none!important;
  }

  .ruyaAdminMessagesModal{
    position:relative!important;

    width:100%!important;

    max-height:
      calc(
        100dvh -
        20px -
        env(safe-area-inset-top,0px) -
        env(safe-area-inset-bottom,0px)
      )!important;

    margin:0!important;

    overflow:hidden!important;

    transform:none!important;
  }

  .ruyaAdminMessagesModalHead{
    position:relative!important;

    z-index:5!important;

    flex:0 0 auto!important;
  }

  .ruyaAdminMessagesModalBody{
    flex:1 1 auto!important;

    min-height:0!important;

    overflow-x:hidden!important;
    overflow-y:auto!important;

    -webkit-overflow-scrolling:touch!important;

    overscroll-behavior:contain!important;
  }

}

