/* KARETA r58 — manual #messages reference redesign.
   Route: https://kareta.kz/#messages and #messages:<chatId>
   This is route-specific, not a generic guard. */

body.kr-route-messages{
  --msg-r58-bg:#eef0f2;
  --msg-r58-page:#fff;
  --msg-r58-soft:#f4f4f5;
  --msg-r58-line:#e7e8eb;
  --msg-r58-text:#080b10;
  --msg-r58-muted:#6f747d;
  --msg-r58-orange:#ffb000;
  --msg-r58-orange2:#ff9800;
  --msg-r58-green:#22c55e;
  --msg-r58-red:#ef4444;
  background:var(--msg-r58-bg) !important;
}

body.kr-route-messages #app{
  background:var(--msg-r58-bg) !important;
}

body.kr-route-messages .messages-reference-r58,
body.kr-route-messages #app > .page{
  min-height:100dvh !important;
  background:var(--msg-r58-bg) !important;
  padding:clamp(14px,2.5vw,32px) clamp(12px,2.8vw,40px) calc(124px + env(safe-area-inset-bottom,0px)) !important;
}

/* Hero */
body.kr-route-messages #hero-messages,
body.kr-route-messages .spa-page-hero--messages{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto 14px !important;
  padding:clamp(22px,3vw,36px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

body.kr-route-messages #hero-messages :where(.spa-hero-kicker,.spa-hero-label){
  width:max-content !important;
  max-width:100% !important;
  min-height:28px !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  font-weight:900 !important;
  font-size:12px !important;
  letter-spacing:-.02em !important;
}

body.kr-route-messages #hero-messages :where(.spa-hero-title,h1){
  max-width:620px !important;
  color:var(--msg-r58-text) !important;
  font-size:clamp(38px,5.5vw,68px) !important;
  line-height:.94 !important;
  font-weight:950 !important;
  letter-spacing:-.075em !important;
  margin:10px 0 10px !important;
}

body.kr-route-messages #hero-messages :where(.spa-hero-sub){
  color:var(--msg-r58-muted) !important;
  font-size:clamp(15px,1.8vw,18px) !important;
  line-height:1.35 !important;
}

body.kr-route-messages #hero-messages :where(.spa-hero-stats,.spa-hero-statline){
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin-top:18px !important;
}

body.kr-route-messages #hero-messages .spa-hero-stat{
  min-width:116px !important;
  padding:12px !important;
  border-radius:16px !important;
  background:var(--msg-r58-soft) !important;
  border:1px solid var(--msg-r58-line) !important;
}

body.kr-route-messages #hero-messages .spa-hero-stat-num{
  color:var(--msg-r58-text) !important;
  font-size:22px !important;
  line-height:1 !important;
  font-weight:950 !important;
  letter-spacing:-.045em !important;
}

body.kr-route-messages #hero-messages .spa-hero-stat-lbl{
  margin-top:5px !important;
  color:var(--msg-r58-muted) !important;
  font-size:12px !important;
  font-weight:800 !important;
}

/* Main app-card container */
body.kr-route-messages .msng-page-content-wrap{
  max-width:1120px !important;
  margin:0 auto !important;
  padding:0 !important;
  background:transparent !important;
}

body.kr-route-messages .msng-page-content{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:clamp(18px,3vw,34px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

/* Tools/filter/search */
body.kr-route-messages #msng-page-filterbar,
body.kr-route-messages .msng-mo-filter-bar,
body.kr-route-messages .msng-sticky-tools,
body.kr-route-messages .catalog-tools--messages{
  position:relative !important;
  top:auto !important;
  z-index:1 !important;
  margin:0 0 16px !important;
  padding:10px !important;
  background:var(--msg-r58-soft) !important;
  border:1px solid var(--msg-r58-line) !important;
  border-radius:18px !important;
  box-shadow:none !important;
  overflow:hidden !important;
}

body.kr-route-messages .mo-filter-tabs{
  display:flex !important;
  gap:8px !important;
  overflow-x:auto !important;
  scrollbar-width:none !important;
  padding:0 !important;
}

body.kr-route-messages .mo-filter-tabs::-webkit-scrollbar{display:none !important;}

body.kr-route-messages .mo-filter-tab{
  min-height:38px !important;
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  padding:0 12px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--msg-r58-muted) !important;
  box-shadow:none !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

body.kr-route-messages .mo-filter-tab.active{
  color:#111 !important;
  background:#fff3c7 !important;
  box-shadow:inset 0 -2px 0 var(--msg-r58-orange) !important;
}

body.kr-route-messages .mo-filter-tab-ico{
  color:var(--msg-r58-orange2) !important;
}

body.kr-route-messages .mo-filter-cnt{
  min-width:22px !important;
  height:22px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:var(--msg-r58-soft) !important;
  color:#111 !important;
  font-size:12px !important;
}

body.kr-route-messages .mo-search-action,
body.kr-route-messages .msng-search-action{
  margin:0 0 16px !important;
}

body.kr-route-messages .mo-search-toggle{
  min-height:46px !important;
  width:100% !important;
  border:0 !important;
  border-radius:14px !important;
  background:var(--msg-r58-soft) !important;
  color:var(--msg-r58-text) !important;
  padding:0 14px !important;
  font-weight:900 !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
}

body.kr-route-messages .mo-search-panel{
  margin-top:8px !important;
  padding:8px !important;
  border-radius:16px !important;
  background:var(--msg-r58-soft) !important;
  border:1px solid var(--msg-r58-line) !important;
}

body.kr-route-messages .mo-search-input{
  min-height:44px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--msg-r58-text) !important;
  padding:0 12px !important;
}

/* List */
body.kr-route-messages #msng-page-listmount{
  min-width:0 !important;
}

body.kr-route-messages .msng-list--page{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
}

/* Actual chat item card */
body.kr-route-messages .msng-item--v2{
  min-width:0 !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:14px !important;
  border:1px solid var(--msg-r58-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
  display:grid !important;
  grid-template-columns:56px minmax(0,1fr) !important;
  gap:12px !important;
  align-items:center !important;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}

body.kr-route-messages .msng-item--v2:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(255,176,0,.28) !important;
  box-shadow:0 14px 32px rgba(15,23,42,.08) !important;
}

body.kr-route-messages .msng-item--unread{
  border-color:rgba(255,176,0,.42) !important;
  background:linear-gradient(180deg,#fff,#fffaf0) !important;
}

body.kr-route-messages .msng-item-av-wrap{
  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  align-self:start !important;
}

body.kr-route-messages .msng-av2{
  width:56px !important;
  height:56px !important;
  border-radius:16px !important;
  background:#26282e !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
}

body.kr-route-messages .msng-av2 span:first-child{
  color:inherit !important;
  font-size:18px !important;
}

body.kr-route-messages .msng-av2-dot{
  position:absolute !important;
  right:1px !important;
  bottom:1px !important;
  width:12px !important;
  height:12px !important;
  border-radius:50% !important;
  background:var(--msg-r58-green) !important;
  border:2px solid #fff !important;
}

body.kr-route-messages .msng-item-content{
  min-width:0 !important;
  display:grid !important;
  gap:6px !important;
}

body.kr-route-messages .msng-item-row1,
body.kr-route-messages .msng-item-title-row,
body.kr-route-messages .msng-item-row3{
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}

body.kr-route-messages .msng-item-row1{
  justify-content:space-between !important;
}

body.kr-route-messages .msng-item-name2{
  min-width:0 !important;
  color:var(--msg-r58-text) !important;
  font-size:17px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.kr-route-messages .msng-item-time2{
  flex:0 0 auto !important;
  color:var(--msg-r58-muted) !important;
  font-size:12px !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

body.kr-route-messages .msng-order-num{
  flex:0 0 auto !important;
  min-height:24px !important;
  padding:4px 8px !important;
  border-radius:999px !important;
  background:var(--msg-r58-soft) !important;
  color:#464b55 !important;
  font-size:12px !important;
  font-weight:900 !important;
}

body.kr-route-messages .msng-item-svc{
  min-width:0 !important;
  color:#262a32 !important;
  font-size:14px !important;
  line-height:1.15 !important;
  font-weight:850 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.kr-route-messages .msng-item-car2{
  min-width:0 !important;
  color:var(--msg-r58-muted) !important;
  font-size:13px !important;
  line-height:1.18 !important;
  font-weight:750 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.kr-route-messages .msng-item-preview2{
  min-width:0 !important;
  flex:1 1 auto !important;
  color:var(--msg-r58-muted) !important;
  font-size:13px !important;
  line-height:1.22 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.kr-route-messages .msng-item-right-meta{
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
}

body.kr-route-messages .msng-status-pill-sm{
  min-height:24px !important;
  padding:4px 8px !important;
  border-radius:999px !important;
  border:1px solid transparent !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

body.kr-route-messages .msng-unread2{
  min-width:22px !important;
  height:22px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:var(--msg-r58-orange) !important;
  color:#111 !important;
  font-size:12px !important;
  font-weight:950 !important;
}

/* Empty and chatbox */
body.kr-route-messages .msng-empty-cta,
body.kr-route-messages #msng-page-chatbox{
  min-height:0 !important;
  margin:0 0 12px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.kr-route-messages .msng-empty{
  min-height:260px !important;
  border:1px dashed #d9dbe0 !important;
  border-radius:22px !important;
  background:#fafafa !important;
  padding:24px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
}

/* Open chat overlay/panel should match reference when launched from #messages */
body.kr-route-messages #messenger-panel{
  border-radius:24px 24px 0 0 !important;
  background:#fff !important;
  box-shadow:0 -18px 48px rgba(15,23,42,.18) !important;
}

body.kr-route-messages .msng-header{
  background:#fff !important;
  border-bottom:1px solid var(--msg-r58-line) !important;
}

body.kr-route-messages .msng-body{
  background:#f7f7f8 !important;
}

body.kr-route-messages :where(.msng-bubble,.msg-bubble,.message-bubble){
  border-radius:16px !important;
}

/* Tablet/PC */
@media (min-width:768px){
  body.kr-route-messages .messages-reference-r58{
    padding:clamp(20px,3vw,40px) clamp(20px,3vw,48px) calc(128px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-messages #hero-messages{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:24px !important;
    align-items:start !important;
  }
  body.kr-route-messages .msng-list--page{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
  }
  body.kr-route-messages .msng-page-content{
    padding:clamp(22px,3vw,34px) !important;
  }
}

@media (min-width:1120px){
  body.kr-route-messages .msng-list--page{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body.kr-route-messages #messenger-panel{
    width:min(820px, calc(100vw - 64px)) !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) translateY(var(--msng-y,0)) !important;
    border-radius:24px !important;
    bottom:24px !important;
    max-height:calc(100vh - 96px) !important;
  }
}

/* Mobile: clean app screen */
@media (max-width:767px){
  body.kr-route-messages,
  body.kr-route-messages #app,
  body.kr-route-messages .messages-reference-r58{
    background:#fff !important;
  }
  body.kr-route-messages .messages-reference-r58{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-messages #hero-messages,
  body.kr-route-messages .msng-page-content{
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 14px !important;
  }
  body.kr-route-messages #hero-messages :where(.spa-hero-title,h1){
    font-size:clamp(34px,10vw,42px) !important;
  }
  body.kr-route-messages .msng-item--v2{
    grid-template-columns:50px minmax(0,1fr) !important;
    padding:12px !important;
    border-radius:16px !important;
  }
  body.kr-route-messages .msng-item-av-wrap,
  body.kr-route-messages .msng-av2{
    width:50px !important;
    height:50px !important;
    min-width:50px !important;
  }
  body.kr-route-messages .msng-status-pill-sm{
    display:none !important;
  }
}

/* Low-height tablet compact */
@media (min-width:768px) and (max-height:760px){
  body.kr-route-messages .messages-reference-r58{
    padding-top:14px !important;
    padding-bottom:104px !important;
  }
  body.kr-route-messages #hero-messages,
  body.kr-route-messages .msng-page-content{
    padding:20px !important;
  }
  body.kr-route-messages #hero-messages :where(.spa-hero-title,h1){
    font-size:46px !important;
  }
}

/* Hard guards */
body.kr-route-messages :where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}
