/* KARETA UI-r53 — client pages reference style pass.
   Scope: Orders / Chats / Favorites / Profile and adjacent client pages.
   Visual-only layer. No API/DB/route/business logic changes. */
:root{
  --r53-bg:#eef0f2;
  --r53-page:#ffffff;
  --r53-soft:#f4f4f5;
  --r53-soft-2:#fafafa;
  --r53-line:#e7e8eb;
  --r53-text:#090b10;
  --r53-muted:#6f747d;
  --r53-orange:#ffb000;
  --r53-orange-2:#ff9800;
  --r53-red:#ef4444;
  --r53-green:#22c55e;
  --r53-radius:16px;
  --r53-radius-lg:24px;
  --r53-shadow:0 16px 42px rgba(15,23,42,.08);
  --r53-shadow-soft:0 8px 24px rgba(15,23,42,.055);
}

/* Client app pages background */
body[data-role="client"] :where(.page,#myorders,#messages,#masters,#cabinet,#parts,#news),
body.kareta-page-myorders,
body.kareta-page-messages,
body.kareta-page-masters,
body.kareta-page-cabinet{
  background:var(--r53-bg) !important;
}

/* Main page containers as white app cards */
body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
body[data-role="client"] :where(.cab-pane) > .container,
body[data-role="client"] :where(.client-page,.kr-page,.client-screen){
  max-width:1120px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  background:var(--r53-page) !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:var(--r53-radius-lg) !important;
  box-shadow:var(--r53-shadow) !important;
  padding:clamp(18px,3vw,34px) !important;
  overflow:hidden !important;
}

/* Page headings */
body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts) :where(h1,.page-title,.section-title,.cab-title,.ccab-title){
  color:var(--r53-text) !important;
  font-size:clamp(26px,3.2vw,42px) !important;
  line-height:1.02 !important;
  font-weight:950 !important;
  letter-spacing:-.06em !important;
  margin-bottom:clamp(14px,2vw,24px) !important;
}
body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts) :where(p,.page-subtitle,.muted,.ccab-sub,.section-subtitle){
  color:var(--r53-muted) !important;
  line-height:1.35 !important;
}

/* Generic reference cards */
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card,.chat-card,.message-card,.master-card,.fav-card,.favorite-card,.cab-card,.ccab-card,.ccab-panel,.cabinet-card,.profile-card,.car-card,.settings-row,.notify-row,.notification-card,.review-card,.history-card){
  min-width:0 !important;
  max-width:100% !important;
  border:1px solid var(--r53-line) !important;
  border-radius:var(--r53-radius) !important;
  background:#fff !important;
  box-shadow:var(--r53-shadow-soft) !important;
  overflow:hidden !important;
}
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card,.chat-card,.message-card,.master-card,.fav-card,.favorite-card,.cab-card,.ccab-card,.ccab-panel,.cabinet-card,.profile-card,.car-card,.settings-row,.notify-row,.notification-card,.review-card,.history-card) :where(h2,h3,h4,b,strong){
  color:var(--r53-text) !important;
  font-weight:900 !important;
  letter-spacing:-.035em !important;
  line-height:1.12 !important;
}
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card,.chat-card,.message-card,.master-card,.fav-card,.favorite-card,.cab-card,.ccab-card,.ccab-panel,.cabinet-card,.profile-card,.car-card,.settings-row,.notify-row,.notification-card,.review-card,.history-card) :where(p,span,small){
  min-width:0 !important;
  overflow-wrap:anywhere !important;
  line-height:1.28 !important;
}

/* Orders page: tabs + cards */
body[data-role="client"] :where(.orders-tabs,.myorders-tabs,.tabs,.filter-tabs){
  display:flex !important;
  gap:8px !important;
  overflow:auto !important;
  scrollbar-width:none !important;
  border-bottom:1px solid var(--r53-line) !important;
  padding-bottom:10px !important;
  margin-bottom:16px !important;
}
body[data-role="client"] :where(.orders-tabs,.myorders-tabs,.tabs,.filter-tabs)::-webkit-scrollbar{display:none !important;}
body[data-role="client"] :where(.orders-tabs,.myorders-tabs,.tabs,.filter-tabs) :where(button,.tab){
  min-height:36px !important;
  padding:0 14px !important;
  border:0 !important;
  border-radius:10px !important;
  background:transparent !important;
  color:var(--r53-muted) !important;
  font-weight:850 !important;
  white-space:nowrap !important;
}
body[data-role="client"] :where(.orders-tabs,.myorders-tabs,.tabs,.filter-tabs) :where(.active,.is-active,[aria-selected="true"]){
  color:var(--r53-text) !important;
  background:#fff7df !important;
  box-shadow:inset 0 -2px 0 var(--r53-orange) !important;
}
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card){
  padding:16px !important;
  display:grid !important;
  gap:12px !important;
}
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card) :where(.status,.badge,.chip){
  width:max-content !important;
  max-width:100% !important;
  min-height:26px !important;
  padding:4px 9px !important;
  border-radius:999px !important;
  background:#ecfdf3 !important;
  color:#15803d !important;
  font-size:12px !important;
  font-weight:850 !important;
}

/* Chats */
body[data-role="client"] :where(.chat-list,.messages-list,.dialogs-list){
  display:grid !important;
  gap:10px !important;
}
body[data-role="client"] :where(.chat-card,.message-card,.dialog-card){
  padding:12px !important;
  display:grid !important;
  grid-template-columns:54px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}
body[data-role="client"] :where(.chat-avatar,.message-avatar,.dialog-avatar,.avatar){
  width:54px !important;
  height:54px !important;
  border-radius:14px !important;
  background:#2c2d32 !important;
  color:#fff !important;
  flex:0 0 auto !important;
  overflow:hidden !important;
}
body[data-role="client"] :where(.chat-time,.message-time,.dialog-time){
  color:var(--r53-muted) !important;
  font-size:12px !important;
  white-space:nowrap !important;
}

/* Favorites / masters */
body[data-role="client"] :where(.masters-list,.favorites-list,.fav-list){
  display:grid !important;
  gap:12px !important;
}
body[data-role="client"] :where(.master-card,.favorite-card,.fav-card){
  padding:14px !important;
  display:grid !important;
  grid-template-columns:64px minmax(0,1fr) auto !important;
  gap:14px !important;
  align-items:center !important;
}
body[data-role="client"] :where(.master-card,.favorite-card,.fav-card) :where(img,.thumb,.photo){
  width:64px !important;
  height:64px !important;
  border-radius:14px !important;
  object-fit:cover !important;
  background:#2c2d32 !important;
}

/* Profile / cabinet rows */
body[data-role="client"] :where(.profile-menu,.settings-list,.cab-list,.ccab-list){
  display:grid !important;
  gap:8px !important;
}
body[data-role="client"] :where(.settings-row,.profile-row,.cab-row,.ccab-row){
  min-height:54px !important;
  padding:12px 14px !important;
  border-radius:14px !important;
  background:#fff !important;
  border:1px solid var(--r53-line) !important;
  display:grid !important;
  grid-template-columns:34px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}
body[data-role="client"] :where(.settings-row,.profile-row,.cab-row,.ccab-row) :where(.ico,.icon,.row-icon,svg){
  color:#171a20 !important;
  stroke:#171a20 !important;
}

/* Buttons */
body[data-role="client"] :where(.btn,.button,button,.action-btn,.primary-btn,.ccab-btn,.cab-btn){
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}
body[data-role="client"] :where(.btn-primary,.primary-btn,.submit-btn,.save-btn,.cta,.ccab-btn-primary){
  border:0 !important;
  background:linear-gradient(180deg,var(--r53-orange),var(--r53-orange-2)) !important;
  color:#111 !important;
  border-radius:12px !important;
  box-shadow:0 10px 22px rgba(255,176,0,.22) !important;
  font-weight:900 !important;
}
body[data-role="client"] :where(.btn-secondary,.secondary-btn,.outline-btn,.ghost-btn,.ccab-btn-secondary){
  border:1px solid var(--r53-line) !important;
  background:#fff !important;
  color:var(--r53-text) !important;
  border-radius:12px !important;
  font-weight:850 !important;
}

/* Inputs */
body[data-role="client"] :where(input,select,textarea){
  min-height:44px !important;
  border:1px solid var(--r53-line) !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--r53-text) !important;
  font-size:16px !important;
}
body[data-role="client"] :where(input,select,textarea):focus{
  border-color:rgba(255,176,0,.75) !important;
  box-shadow:0 0 0 3px rgba(255,176,0,.16) !important;
  outline:0 !important;
}

/* Tablet / desktop layouts */
@media (min-width:768px){
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page{
    padding:clamp(18px,3vw,34px) clamp(18px,3vw,44px) calc(118px + env(safe-area-inset-bottom,0px)) !important;
  }
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    border-radius:28px !important;
    padding:clamp(26px,3.2vw,42px) !important;
  }
  body[data-role="client"] :where(.orders-grid,.myorders-list,.favorites-list,.masters-list,.cab-grid,.ccab-grid){
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
  }
  body[data-role="client"] :where(.settings-list,.profile-menu,.cab-list,.ccab-list){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (min-width:1024px){
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    max-width:1120px !important;
    min-height:620px !important;
  }
  body[data-role="client"] :where(.favorites-list,.masters-list,.cab-grid,.ccab-grid){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}
@media (max-width:767px){
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
    background:#fff !important;
  }
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    max-width:none !important;
    min-height:100dvh !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 16px 22px !important;
  }
  body[data-role="client"] :where(.chat-card,.message-card,.dialog-card){
    grid-template-columns:48px minmax(0,1fr) auto !important;
  }
  body[data-role="client"] :where(.master-card,.favorite-card,.fav-card){
    grid-template-columns:56px minmax(0,1fr) auto !important;
  }
}

/* Global overlap guard */
body[data-role="client"] :where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div){
  min-width:0;
}