/* KARETA r62 — visible defect cleanup after manual route passes.
   Fixes common issues seen after r57-r61: route activation gaps, nested app-card boxes,
   old dark/technical cards bleeding through, horizontal overflow and bottom dock collisions. */

:root{
  --r62-bg:#eef0f2;
  --r62-page:#fff;
  --r62-soft:#f4f4f5;
  --r62-line:#e7e8eb;
  --r62-text:#080b10;
  --r62-muted:#6f747d;
  --r62-orange:#ffb000;
  --r62-orange2:#ff9800;
}

/* Route classes now exist on html/body/#app. Support all three. */
:is(html,body,#app):is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts){
  background:var(--r62-bg) !important;
}

/* Main page shell: no old full-width dark sections. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) #app > .page{
  background:var(--r62-bg) !important;
  color:var(--r62-text) !important;
  overflow-x:hidden !important;
}

/* Prevent nested old cards from creating card-inside-card shadows too aggressively. */
body.kr-route-myorders .myorders-reference-r57 .container .card,
body.kr-route-messages .msng-page-content .card,
body.kr-route-masters .kr-screen--masters .kr-card,
body.kr-route-cabinet .cab-pane > .container .card,
body.kr-route-parts .parts-reference-r61-container .card{
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  border-color:var(--r62-line) !important;
  background:#fff !important;
}

/* Old inline dark/colored backgrounds should not dominate client app pages. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(.owner-block,.card,.empty-state,.catalog-tools,.mo-filter-bar,.settings-row,.profile-row,.cab-row){
  color:var(--r62-text) !important;
}

/* Fix legacy emoji/icon color splashes in the manual routes. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(.empty-icon,.mo-filter-tab-ico,.cst-card-ico,.diag-account-ico,.parts-category-card__icon,.mo-chat-entity-ico){
  filter:none !important;
  text-shadow:none !important;
}

/* Buttons: stop old random colors from leaking into the app-card pages. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(.btn-primary,.primary-btn,.submit-btn,.save-btn,.cta){
  background:linear-gradient(180deg,var(--r62-orange),var(--r62-orange2)) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:0 10px 22px rgba(255,176,0,.22) !important;
}

body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(.btn-outline,.btn-ghost,.secondary-btn,.outline-btn){
  background:#fff !important;
  color:var(--r62-text) !important;
  border:1px solid var(--r62-line) !important;
}

/* Horizontal overflow kill switch for the exact problem pages. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts),
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) #app,
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) #app > .page,
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) :where(.container,.spa-content,main,section){
  max-width:100% !important;
  overflow-x:hidden !important;
}

/* Grids must never produce forced overflow on tablets. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(#mo-list,.msng-list--page,.kr-master-screen-list,.parts-categories-grid,.parts-grid-v2,.cst-grid,.profile-form,.cab-pane-layout,.vehicle-list,.loy-levels){
  min-width:0 !important;
  width:100% !important;
}

/* Cards must not stretch outside app-card boundaries. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(.mo-card,.msng-item--v2,.kr-master-screen-card,.part-card-v2,.parts-category-card,.cst-card,.profile-form-card,.vehicle-card,.loy-lvl-card,.settings-row,.notification-card){
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

/* Search/filter panels: old sticky tools caused visual dirt and overlap. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-parts)
:where(.catalog-tools__inner,.catalog-tools__filters,.catalog-tools__search,.catalog-tools__actions){
  min-width:0 !important;
  max-width:100% !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Make long names safe without destroying layout. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(.mo-card-title,.msng-item-name2,.msng-item-svc,.kr-master-screen-top h3,.part-card-v2-name,.cst-order-name,.pf-label,.settings-row,.profile-row){
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

/* But descriptions should wrap instead of disappear. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(.spa-hero-sub,.parts-category-card__desc,.svc-active-category__desc,.mo-card-car,.msng-item-car2,.cst-order-meta,p,small){
  min-width:0 !important;
  overflow-wrap:anywhere !important;
  white-space:normal !important;
}

/* Cabinet: avoid three-column forms becoming too tight on medium tablets. */
@media (min-width:768px) and (max-width:1050px){
  body.kr-route-cabinet :where(.cab-pane-layout,.ccab-grid,.cab-grid,.vcar-grid,.vehicle-list){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet .profile-form-card,
  body.kr-route-cabinet #cp-editprofile .profile-form-card{
    grid-column:1/-1 !important;
  }
}

/* Tablet: keep readable cards, not tiny compressed tiles. */
@media (min-width:768px) and (max-width:1023px){
  body.kr-route-myorders #mo-list,
  body.kr-route-messages .msng-list--page,
  body.kr-route-masters .kr-master-screen-list,
  body.kr-route-parts .parts-categories-grid,
  body.kr-route-parts .parts-grid-v2{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* Phone: no fake margins around full screen pages. */
@media (max-width:767px){
  body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) #app > .page{
    padding-left:0 !important;
    padding-right:0 !important;
    background:#fff !important;
  }
  body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
  :where(#hero-myorders,#hero-messages,#hero-parts,.kr-screen--masters,.cab-pane > .container,.parts-reference-r61-container,.msng-page-content,.myorders-reference-r57 .container){
    border-radius:0 !important;
    border-left:0 !important;
    border-right:0 !important;
  }
}

/* Floating dock final collision fix. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) #bottom-nav{
  z-index:90 !important;
}
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(.modal,.modal-overlay,.cmodal-overlay,.owiz-overlay,#messenger-panel){
  z-index:130 !important;
}

/* Last text overlap barrier. */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts)
:where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div,input,textarea,select){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
}
