/* === Embed/Theme conflict hard overrides === */
.upost-ld.calculator-container{ display:block !important; 
  width: 100%;
}
.upost-ld .input-row{ display:block !important; }
.upost-ld .input-group{ display:block !important; }


/* uPost Local Delivery - compact UI like provided sample */
.upost-ld.calculator-container{
  max-width:none;
  margin:0;
  width:100%;
  overflow-x: hidden;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
  padding:18px;
  box-sizing:border-box;
}
.upost-ld.calculator-container h1{
  font-size:22px;
  font-weight:700;
  margin:0 0 14px 0;
}
.upost-ld .upost-ld__top-row,
.upost-ld .upost-ld__addr-row,
.upost-ld .upost-ld__parcel-row{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.upost-ld .input-group{
  flex:1 1 220px;
  min-width:200px;
}
.upost-ld .input-group label{
  display:block;
  font-size:12px;
  font-weight:600;
  margin:0 0 6px 0;
  opacity:.8;
}
.upost-ld .input-group input,
.upost-ld .input-group select{
  width:100%;
  height:40px;
  border:1px solid rgba(0,0,0,.18);
  border-radius:6px;
  padding:8px 10px;
  box-sizing:border-box;
  background:#fff;
  outline:none;
}
.upost-ld .input-group input:focus,
.upost-ld .input-group select:focus{
  border-color: rgba(0,0,0,.35);
  box-shadow:0 0 0 3px rgba(13,110,253,.12);
}
.upost-ld .upost-ld__addr-row .input-group{
  flex:1 1 360px;
  min-width:260px;
}

/* parcel card */
.upost-ld .upost-ld__parcel{
  border:1px solid rgba(0,0,0,.10);
  border-radius:10px;
  padding:14px;
  margin-top:14px;
}
.upost-ld .upost-ld__parcel-title{
  font-weight:700;
  margin:0 0 10px 0;
}
.upost-ld .upost-ld__parcel-row .input-group{
  flex:1 1 180px;
  min-width:160px;
}

/* icons */
.upost-ld .upost-ld__icon{
  width:92px;
  height:auto !important;
  display:block;
  margin-top:6px;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.08));
}

/* button */
.upost-ld .upost-ld__quote, .upost-ld .upost-ld__continue{
  width:100%;
  height:44px;
  border:none;
  border-radius:8px;
  background:#0b5ed7;
  color:#fff;
  font-weight:700;
  cursor:pointer;
  margin-top:14px;
}
.upost-ld .upost-ld__quote:disabled, .upost-ld .upost-ld__continue:disabled{opacity:.6;cursor:not-allowed;}

/* result boxes */
.upost-ld .upost-ld__result{
  margin-top:12px;
  border-radius:8px;
  border:1px solid rgba(0,0,0,.10);
  background:#f6f8fb;
  padding:10px 12px;
  font-weight:600;
}

/* suggestions dropdown */
.upost-ld .upost-ld__suggest-wrap{ position:relative; }
.upost-ld .upost-ld__suggest{
  position:absolute;
  top:calc(100% + 4px);
  left:0; right:0;
  z-index:9999;
  background:#fff;
  border:1px solid rgba(0,0,0,.18);
  border-radius:8px;
  box-shadow:0 10px 25px rgba(0,0,0,.12);
  max-height:240px;
  overflow:auto;
}
.upost-ld .upost-ld__suggest-item{
  padding:10px 12px;
  cursor:pointer;
  border-bottom:1px solid rgba(0,0,0,.06);
}
.upost-ld .upost-ld__suggest-item:last-child{border-bottom:none;}
.upost-ld .upost-ld__suggest-item:hover{background:#f4f7ff;}

@media (max-width:600px){
  .upost-ld .upost-ld__top-row{flex-direction:column;}
}


/* === UPOST LD UI overrides (match weight calculator style) === */
.upost-ld .upost-ld__panel{
  max-width: 100%;
  padding: 18px;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 6px 22px rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.06);
}

.upost-ld .input-row{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  align-items: start;
}

.upost-ld .input-row.row-2{
  grid-template-columns: 1fr 1fr;
}

@media (max-width: 900px){
  .upost-ld .input-row{ grid-template-columns: repeat(2, 1fr); }
  .upost-ld .input-row.row-2{ grid-template-columns: 1fr; }
}

.upost-ld .input-group label{
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 6px;
  color: #1f2937;
}

.upost-ld .input-group input,
.upost-ld .input-group select{
  width: 100%;
  height: 44px;
  border: 1px solid rgba(0,0,0,.18);
  border-radius: 6px;
  padding: 0 12px;
  font-size: 14px;
  background: #fff;
}

.upost-ld .input-group img{
  width: 90px;
  height: auto !important;
  display: block;
  margin-top: 8px;
  margin-left: 0;
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.08));
}

.upost-ld .upost-ld__quote,
.upost-ld .upost-ld__continue{
  height: 52px;
  border-radius: 6px;
  font-size: 15px;
}

/* Suggestions: push content down (no overlay, no scroll) */
.upost-ld .upost-ld__suggest{
  position: static !important;
  width: 100% !important;
  margin-top: 6px;
  border-radius: 6px;
  max-height: none !important;
  overflow: visible !important;
}
.upost-ld .upost-ld__suggest-item{
  padding: 10px 12px;
}

/* Status/result like sample bars */
.upost-ld .upost-ld__status,
.upost-ld .upost-ld__result{
  background:#f1f5f9;
}


/* --- Overrides for HTML embedding + nicer compact UI --- */
.upost-ld, .upost-ld * { box-sizing: border-box; }
.upost-ld { overflow: visible !important; }
.upost-ld__suggestions{
  position:absolute;
  z-index: 99999;
  background:#fff;
  border:1px solid #d0d7de;
  border-top:0;
  width:100%;
  max-height:none !important;
  overflow:visible !important;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.upost-ld__suggestions .upost-ld__sugg-item{
  padding:10px 12px;
  cursor:pointer;
  border-top:1px solid #eef2f6;
}
.upost-ld__suggestions .upost-ld__sugg-item:hover{
  background:#f3f6fb;
}
.upost-ld__header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
}
.upost-ld__header-title{
  flex:1 1 auto;
  min-width:200px;
}
.upost-ld__header-controls{
  display:flex;
  gap:16px;
  flex:0 0 auto;
}
@media (max-width: 720px){
  .upost-ld__header{ flex-direction:column; align-items:stretch; }
  .upost-ld__header-controls{ width:100%; }
}



/* === Layout overrides for HTML embeds / theme conflicts === */
.upost-ld .upost-ld__parcel .input-row{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
  align-items: start !important;
}
@media (max-width: 820px){
  .upost-ld .upost-ld__parcel .input-row{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 520px){
  .upost-ld .upost-ld__parcel .input-row{
    grid-template-columns: 1fr !important;
  }
}

.upost-ld .upost-ld__addr-row{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px !important;
  align-items: start !important;
}
@media (max-width: 700px){
  .upost-ld .upost-ld__addr-row{
    grid-template-columns: 1fr !important;
  }
}

/* Keep each field blocky (avoid theme flexing input groups) */
.upost-ld .input-group{
  display: block !important;
}
.upost-ld .input-group label{
  display:block !important;
}
.upost-ld .input-group input,
.upost-ld .input-group select{
  width:100% !important;
  box-sizing: border-box !important;
}


/* ==========================================================
   NEW: Variable-product parcels UI (between pa_004 and pa_002)
   ========================================================== */
.upost-ld-parcels-ui{
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.upost-ld-parcel-block{
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 8px;
  padding: 10px;
  background: rgba(0,0,0,.02);
}
.upost-ld-parcel-title{
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 8px;
}
.upost-ld-dims-row,
.upost-ld-kg-row{
  display: flex;
  gap: 8px;
  align-items: center;
}
.upost-ld-dim{
  width: 56px;
  max-width: 56px;
  text-align: center;
}
.upost-ld-kg{
  width: 90px;
  max-width: 120px;
}
.upost-ld-dim,
.upost-ld-kg{
  height: 38px;
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
}
.upost-ld-route-info{
  margin: 12px 0;
}


/* --- Product page: add clear borders around variation fields --- */
.single-product .variations_form table.variations select,
.single-product .variations_form .upost-ld-parcels-ui input{
  border: 1px solid rgba(0,0,0,.28) !important;
}
.single-product .variations_form table.variations select:focus,
.single-product .variations_form .upost-ld-parcels-ui input:focus{
  border-color: rgba(0,0,0,.45) !important;
  box-shadow: 0 0 0 3px rgba(13,110,253,.12) !important;
  outline: none !important;
}


/* v3: stronger visual borders for all form controls inside the widget/product blocks */
.upost-ld input[type="text"],
.upost-ld input[type="number"],
.upost-ld input[type="tel"],
.upost-ld select,
.upost-ld textarea {
  border: 1px solid #c9c9c9 !important;
}

.upost-ld input[type="text"]:focus,
.upost-ld input[type="number"]:focus,
.upost-ld input[type="tel"]:focus,
.upost-ld select:focus,
.upost-ld textarea:focus {
  outline: none !important;
  box-shadow: none !important;
  border-color: #666 !important;
}