/* KARETA r60 — manual #cabinet and #cabinet:* reference redesign.
   Routes:
   - https://kareta.kz/#cabinet
   - https://kareta.kz/#cabinet:editprofile
   - https://kareta.kz/#cabinet:car
   - https://kareta.kz/#cabinet:diagnostics
   - https://kareta.kz/#cabinet:stats
   - https://kareta.kz/#cabinet:loyalty
   - https://kareta.kz/#cabinet:appsettings
   This is route-specific, not a generic guard. */

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

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

/* Main cabinet containers and panes */
body.kr-route-cabinet #app > .page > section,
body.kr-route-cabinet #app > .page .cab-pane,
body.kr-route-cabinet .cabinet-reference-r60-pane{
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

body.kr-route-cabinet #app > .page .container,
body.kr-route-cabinet .cab-pane > .container,
body.kr-route-cabinet .cabinet-reference-r60-pane > .container{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:clamp(20px,3vw,38px) !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;
}

/* Cabinet headers */
body.kr-route-cabinet :where(.cab-pane-head,.cab-head,.ccab-hero,.profile-head,.vcar-header,.diag-account-hero,.loy-hero){
  margin:0 0 18px !important;
  padding:clamp(16px,2vw,22px) !important;
  border:1px solid var(--cab-r60-line) !important;
  border-radius:22px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
}

body.kr-route-cabinet :where(.cab-pane-title,.cab-title,.ccab-title,.profile-title,.vcar-title,.diag-account-body h3,.loy-hero-title,h1,h2,h3){
  color:var(--cab-r60-text) !important;
  font-weight:950 !important;
  letter-spacing:-.055em !important;
  line-height:1.02 !important;
}
body.kr-route-cabinet :where(.cab-pane-title,.cab-title,.ccab-title,.profile-title,.vcar-title){
  font-size:clamp(30px,4.6vw,56px) !important;
  margin:0 !important;
}
body.kr-route-cabinet :where(.cab-pane-sub,.cab-sub,.ccab-sub,.profile-sub,.diag-account-body p,.loy-hero-sub,p,small){
  color:var(--cab-r60-muted) !important;
  line-height:1.35 !important;
}

/* Layouts */
body.kr-route-cabinet :where(.cab-pane-layout,.profile-form,.cst-grid,.vcar-grid,.vehicle-list,.settings-list,.loy-how-grid,.loy-levels,.cab-grid,.ccab-grid){
  display:grid !important;
  gap:14px !important;
}

/* Cards */
body.kr-route-cabinet :where(.card,.profile-form-card,.cst-card,.cst-order-row,.loy-hero,.loy-lvl-card,.loy-how,.loy-how-item,.vehicle-card,.vehicle-editor-section,.diag-account-hero,.diag-card,.settings-row,.cab-row,.ccab-card,.garage-history-item,.notify-row,.notification-card){
  min-width:0 !important;
  max-width:100% !important;
  border:1px solid var(--cab-r60-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
}

/* Stats */
body.kr-route-cabinet .cst-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  margin-bottom:16px !important;
}
body.kr-route-cabinet .cst-card{
  min-height:116px !important;
  padding:16px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  gap:8px !important;
}
body.kr-route-cabinet .cst-card-ico{
  width:40px !important;
  height:40px !important;
  border-radius:14px !important;
  background:#fff3c7 !important;
  color:var(--cab-r60-orange2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:18px !important;
}
body.kr-route-cabinet .cst-card-val{
  color:var(--cab-r60-text) !important;
  font-size:clamp(22px,3vw,32px) !important;
  line-height:1 !important;
  font-weight:950 !important;
  letter-spacing:-.05em !important;
}
body.kr-route-cabinet .cst-card-lbl{
  color:var(--cab-r60-muted) !important;
  font-size:13px !important;
  font-weight:850 !important;
}

/* Profile form */
body.kr-route-cabinet .profile-form-card{
  padding:clamp(16px,2.2vw,24px) !important;
}
body.kr-route-cabinet .profile-form{
  grid-template-columns:1fr !important;
}
body.kr-route-cabinet :where(.pf-group,.form-group){
  display:grid !important;
  gap:7px !important;
  min-width:0 !important;
}
body.kr-route-cabinet :where(.pf-label,label){
  color:#303540 !important;
  font-size:13px !important;
  font-weight:900 !important;
}
body.kr-route-cabinet :where(.pf-input,input,select,textarea){
  min-height:46px !important;
  width:100% !important;
  border:1px solid var(--cab-r60-line) !important;
  border-radius:14px !important;
  background:#fff !important;
  color:var(--cab-r60-text) !important;
  padding:0 14px !important;
  font-size:16px !important;
}
body.kr-route-cabinet textarea{padding-top:12px !important;}

/* History/orders rows */
body.kr-route-cabinet .cst-order-row,
body.kr-route-cabinet .garage-history-item{
  min-height:64px !important;
  padding:12px 14px !important;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
  text-align:left !important;
}
body.kr-route-cabinet .cst-order-ico{
  width:42px !important;
  height:42px !important;
  border-radius:14px !important;
  background:#fff3c7 !important;
  color:var(--cab-r60-orange2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
body.kr-route-cabinet .cst-order-name,
body.kr-route-cabinet .garage-history-item .name{
  color:var(--cab-r60-text) !important;
  font-size:15px !important;
  font-weight:950 !important;
  letter-spacing:-.035em !important;
}
body.kr-route-cabinet .cst-order-meta,
body.kr-route-cabinet .garage-history-item .meta{
  color:var(--cab-r60-muted) !important;
  font-size:12px !important;
  font-weight:750 !important;
}
body.kr-route-cabinet .cst-order-price{
  color:var(--cab-r60-text) !important;
  font-size:13px !important;
  font-weight:950 !important;
  white-space:nowrap !important;
}

/* Garage */
body.kr-route-cabinet .vcar-header{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}
body.kr-route-cabinet :where(.vehicle-card,.car-card,.vcar-card){
  min-height:96px !important;
  padding:14px !important;
  display:grid !important;
  grid-template-columns:64px minmax(0,1fr) auto !important;
  gap:14px !important;
  align-items:center !important;
}
body.kr-route-cabinet :where(.vehicle-card img,.car-card img,.vcar-thumb,img.vehicle-photo){
  width:64px !important;
  height:64px !important;
  border-radius:16px !important;
  object-fit:cover !important;
  background:#25272d !important;
}

/* Loyalty */
body.kr-route-cabinet .loy-hero{
  position:relative !important;
  padding:clamp(18px,2.5vw,28px) !important;
  background:linear-gradient(135deg,#fff,#fff8df) !important;
}
body.kr-route-cabinet .loy-levels{
  grid-template-columns:1fr !important;
}
body.kr-route-cabinet .loy-lvl-card{
  min-height:72px !important;
  padding:12px 14px !important;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}
body.kr-route-cabinet .loy-lvl-ico{
  width:42px !important;
  height:42px !important;
  border-radius:14px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

/* Notifications/settings */
body.kr-route-cabinet :where(.settings-row,.notify-row,.notification-card){
  min-height:62px !important;
  padding:12px 14px !important;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}

/* Diagnostics */
body.kr-route-cabinet .diag-account-hero{
  display:grid !important;
  grid-template-columns:56px minmax(0,1fr) !important;
  gap:14px !important;
  align-items:center !important;
}
body.kr-route-cabinet .diag-account-ico{
  width:56px !important;
  height:56px !important;
  border-radius:18px !important;
  background:#fff3c7 !important;
  color:var(--cab-r60-orange2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:22px !important;
}

/* Buttons */
body.kr-route-cabinet :where(.btn,.button,button,.cab-btn,.ccab-btn){
  min-width:0 !important;
  max-width:100% !important;
  min-height:40px !important;
  border-radius:12px !important;
  font-weight:900 !important;
  overflow-wrap:anywhere !important;
}
body.kr-route-cabinet :where(.btn-primary,.primary-btn,.save-btn,.submit-btn){
  background:linear-gradient(180deg,var(--cab-r60-orange),var(--cab-r60-orange2)) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:0 10px 22px rgba(255,176,0,.22) !important;
}
body.kr-route-cabinet :where(.btn-outline,.btn-ghost,.secondary-btn){
  background:#fff !important;
  color:var(--cab-r60-text) !important;
  border:1px solid var(--cab-r60-line) !important;
}

/* Tablet/desktop */
@media (min-width:768px){
  body.kr-route-cabinet #app > .page,
  body.kr-route-cabinet .cabinet-reference-r60{
    padding:clamp(20px,3vw,40px) clamp(20px,3vw,48px) calc(128px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-cabinet .profile-form{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet .cst-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet :where(.cab-pane-layout,.ccab-grid,.cab-grid,.vcar-grid,.vehicle-list,.loy-how-grid){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet .loy-levels{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (min-width:1120px){
  body.kr-route-cabinet :where(.cab-pane-layout,.ccab-grid,.cab-grid,.vcar-grid,.vehicle-list){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet .profile-form-card,
  body.kr-route-cabinet #cp-editprofile .profile-form-card{
    grid-column:span 2 !important;
  }
}

/* Mobile full-screen app mode */
@media (max-width:767px){
  body.kr-route-cabinet,
  body.kr-route-cabinet #app,
  body.kr-route-cabinet #app > .page,
  body.kr-route-cabinet .cabinet-reference-r60{
    background:#fff !important;
  }
  body.kr-route-cabinet #app > .page,
  body.kr-route-cabinet .cabinet-reference-r60{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-cabinet #app > .page .container,
  body.kr-route-cabinet .cab-pane > .container,
  body.kr-route-cabinet .cabinet-reference-r60-pane > .container{
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 14px 22px !important;
    min-height:100dvh !important;
  }
  body.kr-route-cabinet :where(.cab-pane-title,.cab-title,.ccab-title,.profile-title,.vcar-title){
    font-size:clamp(32px,9vw,42px) !important;
  }
  body.kr-route-cabinet .cst-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet :where(.vehicle-card,.car-card,.vcar-card){
    grid-template-columns:56px minmax(0,1fr) auto !important;
  }
  body.kr-route-cabinet :where(.vehicle-card img,.car-card img,.vcar-thumb,img.vehicle-photo){
    width:56px !important;
    height:56px !important;
  }
}

/* Low-height tablet compact */
@media (min-width:768px) and (max-height:760px){
  body.kr-route-cabinet #app > .page,
  body.kr-route-cabinet .cabinet-reference-r60{
    padding-top:14px !important;
    padding-bottom:104px !important;
  }
  body.kr-route-cabinet #app > .page .container,
  body.kr-route-cabinet .cab-pane > .container{
    padding:20px !important;
  }
}

/* Hard guards */
body.kr-route-cabinet :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;
  word-break:normal !important;
}
