/* KARETA r62-new — parts entry from main + parts order reference style.
   Base: locked r61. No r63/r64/r65/r66 code reused. */

.parts-entry-r62{
  margin:clamp(14px,2vw,22px) 0 !important;
  display:grid !important;
  gap:10px !important;
}

.parts-entry-r62-card{
  width:100% !important;
  min-height:92px !important;
  padding:14px !important;
  border:1px solid rgba(255,176,0,.32) !important;
  border-radius:18px !important;
  background:linear-gradient(135deg,#fff,#fff8df) !important;
  box-shadow:0 10px 28px rgba(15,23,42,.07) !important;
  color:#080b10 !important;
  display:grid !important;
  grid-template-columns:54px minmax(0,1fr) 28px !important;
  gap:14px !important;
  align-items:center !important;
  text-align:left !important;
}

.parts-entry-r62-icon{
  width:54px !important;
  height:54px !important;
  border-radius:16px !important;
  background:#ffb000 !important;
  color:#111 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:0 10px 24px rgba(255,176,0,.22) !important;
}

.parts-entry-r62-icon svg{
  width:27px !important;
  height:27px !important;
  stroke:currentColor !important;
}

.parts-entry-r62-body{
  min-width:0 !important;
  display:grid !important;
  gap:5px !important;
}

.parts-entry-r62-body b{
  color:#080b10 !important;
  font-size:clamp(19px,2.2vw,24px) !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  letter-spacing:-.045em !important;
}

.parts-entry-r62-body em{
  color:#69707b !important;
  font-size:13px !important;
  line-height:1.25 !important;
  font-style:normal !important;
  font-weight:750 !important;
  overflow-wrap:anywhere !important;
}

.parts-entry-r62-go{
  width:28px !important;
  height:28px !important;
  border-radius:10px !important;
  background:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:24px !important;
  font-weight:900 !important;
  color:#111 !important;
}

.parts-entry-r62-actions{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
}

.parts-entry-r62-actions button{
  min-height:40px !important;
  padding:0 11px !important;
  border-radius:12px !important;
  border:1px solid #e7e8eb !important;
  background:#fff !important;
  color:#080b10 !important;
  font-weight:900 !important;
  font-size:13px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.parts-entry-r62-actions button:first-child{
  background:linear-gradient(180deg,#ffb000,#ff9800) !important;
  color:#111 !important;
  border:0 !important;
}

/* Parts order modal should feel like the sent cart/order reference. */
#parts-order-modal.cmodal-overlay{
  background:rgba(238,240,242,.86) !important;
  backdrop-filter:blur(16px) saturate(1.1) !important;
  -webkit-backdrop-filter:blur(16px) saturate(1.1) !important;
}

#parts-order-modal .parts-order-modal-box{
  width:min(100% - 24px, 760px) !important;
  max-width:760px !important;
  max-height:min(92vh, 860px) !important;
  border:1px solid rgba(15,23,42,.06) !important;
  border-radius:28px !important;
  background:#fff !important;
  box-shadow:0 24px 70px rgba(15,23,42,.18) !important;
  padding:clamp(18px,3vw,28px) !important;
}

#parts-order-modal .cmodal-title{
  color:#080b10 !important;
  font-size:clamp(24px,3vw,34px) !important;
  line-height:1.04 !important;
  font-weight:950 !important;
  letter-spacing:-.055em !important;
}

#parts-order-modal .cmodal-sub,
#parts-order-modal .pof-hint{
  color:#6f747d !important;
  font-size:14px !important;
  line-height:1.32 !important;
}

#parts-order-modal .pof-selected{
  border:1px solid #e7e8eb !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  padding:12px !important;
}

#parts-order-modal .parts-request-grid,
#parts-order-modal .pof-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
}

#parts-order-modal .pof-group{
  min-width:0 !important;
  display:grid !important;
  gap:7px !important;
}

#parts-order-modal .pof-label{
  color:#303540 !important;
  font-size:13px !important;
  font-weight:900 !important;
}

#parts-order-modal .pof-input{
  min-height:46px !important;
  border:1px solid #e7e8eb !important;
  border-radius:14px !important;
  background:#fff !important;
  color:#080b10 !important;
  padding:0 14px !important;
  font-size:16px !important;
  box-shadow:none !important;
}

#parts-order-modal .pof-input:focus{
  border-color:rgba(255,176,0,.75) !important;
  box-shadow:0 0 0 3px rgba(255,176,0,.16) !important;
  outline:0 !important;
}

#parts-order-modal .pof-textarea{
  min-height:92px !important;
  padding-top:12px !important;
}

#parts-order-modal .parts-request-flow{
  grid-column:1/-1 !important;
  border:1px solid #e7e8eb !important;
  border-radius:18px !important;
  background:#fafafa !important;
  padding:12px !important;
}

#parts-order-modal .parts-request-steps{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:7px !important;
  margin-top:10px !important;
}

#parts-order-modal .parts-request-steps span{
  min-height:34px !important;
  border-radius:999px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  font-size:11px !important;
  font-weight:900 !important;
  padding:0 6px !important;
}

#parts-order-modal .cmodal-actions{
  display:grid !important;
  grid-template-columns:1fr 1.35fr !important;
  gap:10px !important;
}

#parts-order-modal .btn{
  min-height:48px !important;
  border-radius:14px !important;
  font-weight:950 !important;
}

#parts-order-modal .btn-primary{
  background:linear-gradient(180deg,#ffb000,#ff9800) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:0 12px 26px rgba(255,176,0,.24) !important;
}

#parts-order-modal .btn-outline{
  background:#fff !important;
  border:1px solid #e7e8eb !important;
  color:#080b10 !important;
}

/* Part request/order cards in myorders keep a shop-like style. */
body.kr-route-myorders .mo-type-badge.parts,
body.kr-route-myorders .mo-card[data-type="parts_request"] .mo-type-badge{
  background:#fff3c7 !important;
  color:#6f4a00 !important;
}

@media (min-width:768px){
  .parts-entry-r62{
    max-width:100% !important;
  }
  .parts-entry-r62-actions{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

@media (max-width:767px){
  .parts-entry-r62-card{
    min-height:86px !important;
    grid-template-columns:48px minmax(0,1fr) 26px !important;
    padding:12px !important;
    border-radius:16px !important;
  }
  .parts-entry-r62-icon{
    width:48px !important;
    height:48px !important;
    border-radius:15px !important;
  }
  .parts-entry-r62-actions{
    grid-template-columns:1fr !important;
  }
  #parts-order-modal .parts-order-modal-box{
    width:100% !important;
    max-height:100dvh !important;
    min-height:100dvh !important;
    border-radius:0 !important;
    padding:18px 14px calc(18px + env(safe-area-inset-bottom,0px)) !important;
  }
  #parts-order-modal .parts-request-grid,
  #parts-order-modal .pof-grid{
    grid-template-columns:1fr !important;
  }
  #parts-order-modal .parts-request-steps{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  #parts-order-modal .cmodal-actions{
    grid-template-columns:1fr !important;
  }
}
