
/* Advice layout changes done by manjot singh on 24jan2026 */
.kl-advice-layout{
  display:grid;
  grid-template-columns: 1fr 320px;
  gap:18px;
  align-items:start;
}
.kl-advice-left{
  background:#fff;
  border:1px solid #e6e6e6;
  padding:18px;
  min-height: 250px;
}

.kl-advice-right > div{
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:8px;
  padding:14px;
  margin-bottom:14px;
}

/* Topic changes done by manjot singh on 24jan2026 */
.kl-topic-title{ margin:0 0 12px 0; font-size:22px; font-weight:700; font-style:italic; }
.kl-topic-title .kl-topic-author{ font-weight:400 !important; }
.kl-topic-dilemma{ margin-bottom:16px; }
.kl-topic-dilemma p{ font-style:italic !important; line-height:18px !important; }

.kl-topic-link{ line-height:14px; }

.kl-reply{ margin-top:18px; margin-left:40px !important; }
.kl-reply-head{ display:flex; align-items:center; gap:10px; margin-bottom:-8px!important; }
.kl-reply-name{ font-weight:700; text-decoration:none; }
a.kl-reply-name{ color:#655c59 !important; }
.kl-reply-text{ line-height:1.6; margin-left:52px !important; }
.kl-reply-text p{ line-height:17px; }

/* Ask box changes done by manjot singh on 24jan2026 */
.kl-ask-box{ position:relative; z-index:2; }
.kl-ask-input-row{ display:flex !important; gap:10px; align-items:flex-start; position:relative; }
.kl-ask-input-wrap{ position:relative; flex:1 1 auto; min-width:0; }
#klAskInput{
  /* leave room for the send button so it never overlaps changes done by manjot singh on 24jan2026 */
  width:88% !important;
  box-sizing:border-box;
  min-height:56px;
  max-height:56px;
  overflow:hidden;
  resize:none;
  padding:10px 12px;
  border:1px solid #cfd7e0;
  border-radius:8px;
  font-size:13px;
}
.kl-ask-box.kl-expanded #klAskInput{
  /* must override theme rules that use !important changes done by manjot singh on 24jan2026 */
  max-height:190px !important;
  min-height:190px !important;
  overflow:auto; /* scrollbar changes done by manjot singh on 24jan2026 */
}
.kl-ask-send {
  position:absolute !important;
    right: -5px;
    top: 0px !important;
  width:34px;
  height:34px;
  min-width:34px;
  min-height:34px;
  border:0;
  border-radius:6px;
  background:#b11b1b;
  color:#fff;
  font-size:18px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.kl-ask-send:disabled{ opacity:.7; cursor:not-allowed; }
.kl-ask-box .kl-ask-attach input[type=file]{ display:block; font-size:12px !important; opacity:.75; margin-bottom:4px; }
.kl-ask-box .kl-ask-attach input[type=file]::file-selector-button{ font-size:12px !important; padding:4px 10px; background:#fff; border:1px solid #d7cece; border-radius:6px; cursor:pointer; }
.kl-ask-box .kl-ask-attach input[type=file]::-webkit-file-upload-button{ font-size:12px !important; padding:4px 10px; background:#fff; border:1px solid #d7cece; border-radius:6px; cursor:pointer; }
.kl-ask-msg{ margin-top:8px; font-size:13px; }
.kl-ask-tools{ margin-top:10px; display:flex; gap:8px; }
.kl-tool-btn{
  border:1px solid #d5d5d5;
  background:#f7f7f7;
  padding:4px 10px;
  border-radius:6px;
  cursor:pointer;
  font-size:12px;
}

/* Past/related topics changes done by manjot singh on 24jan2026 */
.kl-side-title{ font-weight:700; margin-bottom:8px; }
.kl-topic-list{ list-style:none; padding:0; margin:0; }
.kl-topic-list li{ margin:-1px 0; }
.kl-topic-link{ color:#8b0000; text-decoration:underline; font-weight:600; }
.kl-topic-date{ font-size:12px; opacity:.7; margin-top:3px; }
.kl-older-link{ display:inline-block; margin-top:8px; text-decoration:underline; color:#8b0000; }

/* Team changes done by manjot singh on 24jan2026 */
.kl-team-list{ display:flex; flex-wrap:wrap; gap:10px 12px; }
.kl-team-member{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  flex:0 0 calc(50% - 6px);
  width:calc(50% - 6px);
  box-sizing:border-box;
  text-decoration:none;
  color:#8b0000;
}
.kl-member-avatar-placeholder{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #cfcfcf;
  border-radius:50%;
  font-size:11px;
  color:#555;
  background:#fff;
}

/* Older topics changes done by manjot singh on 24jan2026 */
.kl-old-table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
  border:1px solid #e6e6e6;
}
.kl-old-table th, .kl-old-table td{
  padding:10px;
  border-bottom:1px solid #eee;
  text-align:left;
}
.kl-load-more{
  margin-top:12px;
  border:1px solid #ddd;
  background:#fff;
  padding:8px 12px;
  cursor:pointer;
}

/* Team member page changes done by manjot singh on 24jan2026 */
.kl-team-page{
  max-width: 920px;
  margin: 0 auto;
  padding: 24px 16px;
}
.kl-team-card{
  display: flex;
  gap: 22px;
  align-items: center;
  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
}
.kl-team-avatar img,
.kl-team-avatar span{
  width: 160px;
  height: 160px;
  border-radius: 9999px;
  display: block;
  object-fit: cover;
}
.kl-team-meta{ flex: 1; min-width: 0; }
.kl-team-page .kl-team-name{
  font-size: 28px;
  font-weight: 800;
  line-height: 1.1;
  margin: 0 0 10px 0;
}
.kl-team-bio{
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: #2c2c2c;
}
.kl-team-bio p{ margin: 0 0 10px 0; }
.kl-team-bio p:last-child{ margin-bottom: 0; }

@media (max-width: 640px){
  .kl-team-card{ flex-direction: column; align-items: center; text-align: center; }
  .kl-team-avatar img,
  .kl-team-avatar span{ width: 140px; height: 140px; }
  .kl-team-name{ font-size: 24px; }
}


/* Overlay + floating widget changes done by manjot singh on 24jan2026 */
#klAdviceOverlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  z-index:99998;
  display:none;
}
#klAdviceOverlay.show{ display:block; }

#klFloatingBtn{
  position:fixed;
  right:18px;
  bottom:18px;
  width:56px;
  height:56px;
  border-radius:50%;
  background:#b11b1b;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:99997;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}
#klFloatingBtn svg{ width:26px; height:26px; }

#klFloatingPanel{
  position:fixed;
  right:18px;
  bottom:86px;
  width:320px;
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:12px;
  padding:12px;
  z-index:99997;
  box-shadow:0 10px 28px rgba(0,0,0,.18);
  display:none;
}
#klFloatingPanel.show{ display:block; }
#klFloatClose{
  position:absolute;
  right:10px; top:8px;
  border:0;
  background:transparent;
  font-size:18px;
  cursor:pointer;
}
#klFloatInput{
  width:100%;
  min-height:44px;
  max-height:160px;
  overflow:auto;
  resize:none;
  padding:10px 46px 10px 12px;
  border:1px solid #cfd7e0;
  border-radius:8px;
  font-size:13px;
}
#klFloatSend{
  position:absolute;
  right:20px;
  bottom:18px;
  width:34px; height:34px;
  border:0;
  border-radius:6px;
  background:#b11b1b;
  color:#fff;
  font-size:18px;
  cursor:pointer;
}
#klFloatMsg{ margin-top:8px; font-size:13px; }


/* Team member page changes done by manjot singh on 24jan2026 */
.kl-team-page{
  max-width: 920px;
  margin: 0 auto;
  padding: 24px 16px;
}
.kl-team-card{
  display: flex;
  gap: 22px;
  align-items: center;
  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
}
.kl-team-avatar img,
.kl-team-avatar span{
  width: 160px;
  height: 160px;
  border-radius: 9999px;
  display: block;
  object-fit: cover;
}
.kl-team-meta{ flex: 1; min-width: 0; }
.kl-team-name{
  font-size: 28px;
  font-weight: 800;
  line-height: 1.1;
  margin: 0 0 10px 0;
}
.kl-team-bio{
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: #2c2c2c;
}
.kl-team-bio p{ margin: 0 0 10px 0; }
.kl-team-bio p:last-child{ margin-bottom: 0; }

@media (max-width: 640px){
  .kl-team-card{ flex-direction: column; align-items: center; text-align: center; }
  .kl-team-avatar img,
  .kl-team-avatar span{ width: 140px; height: 140px; }
  .kl-team-name{ font-size: 24px; }
}


/* Sidebar team list name sizing changes done by manjot singh on 24jan2026 */
.kl-team .kl-team-name{
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: underline;
  color: #8b0000;
}

/* Sidebar team names style (like 'See Older Topics') changes done by manjot singh on 24jan2026 */
/* Temporary: hide floating ask icon/panel everywhere changes done by manjot singh on 24jan2026 */
#klFloatingBtn, #klFloatingPanel{ display:none !important; }

#klAskInput{ min-height:56px!important; }

@media (max-width: 992px){
  .kl-reply{ margin-left:20px !important; }
  /* Mobile: stack layout, remove gaps, hide box borders changes done by manjot singh on 24jan2026 */
  .kl-advice-layout{ grid-template-columns: 1fr; gap: 0; margin-top:-50px !important; }
  .kl-advice-left{ background:#fff; border:1px solid #fff !important; box-shadow:none !important; border-radius:0 !important; margin:0 !important; }
  .kl-advice-right{ margin:0 !important; }
  .kl-advice-right > div{ border:0 !important; box-shadow:none !important; margin-bottom:0 !important; border-radius:0 !important; }
  .kl-advice-right > div:not(:last-child){ padding-bottom:12px !important; }
  .kl-advice-right > div:not(:last-child)::after{ content:""; display:block; border-bottom:1px solid #e6e6e6; margin-top:12px; }

  /* Mobile: reduce title size changes done by manjot singh on 24jan2026 */
  .kl-topic-title{ font-size:18px !important; }
  .kl-ask-box, .kl-related, .kl-team{ border:0 !important; box-shadow:none !important; border-radius:0 !important; }
}


/* Attach image (front ask box) changes done by manjot singh on 24jan2026 */
.kl-ask-attach{ padding:8px 0 0; }
.kl-ask-attach-label{ display:block; font-size:12px; opacity:.75; margin-bottom:4px; }
#klAskImage{
  width:100%;
  display:block;
  font-size:12px !important;
  opacity:.75;
  margin-bottom:4px;
}

.kl-topic-image{ margin:10px 0 0; }
.kl-topic-image-img{ max-width:100%; height:auto; border-radius:8px; display:block; }

/* Mobile: do not show overlay or md modal changes done by manjot singh on 24jan2026 */
@media (max-width: 979px){
  #klAdviceOverlay{ display:none !important; }
  #modal-3{ display:none !important; }
}

