/* XStore (and many themes) lay the shipping row out as a flex row. Force the row
   to wrap so our control drops onto its own full-width line under the label. */
li:has(> .herod-locker-ui),
li:has(.herod-locker-ui),
.shipping_method:has(.herod-locker-ui) {
  flex-wrap: wrap !important;
}

.herod-locker-ui {
  font-size: 13px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  /* span the whole row + push below the label/price whether parent is flex, float or block */
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  order: 99 !important;
  clear: both !important;
  margin: 10px 0 4px !important;
  /* theme sets text-align:end on the shipping cell — force our block left */
  text-align: left !important;
}
.herod-locker-ui * { text-align: left !important; }
/* Force small logo — themes often set img{width:100%} which blows it up */
.herod-locker-ui .herod-pudo-logo {
  height: 20px !important;
  width: auto !important;
  max-width: 74px !important;
  display: block !important;
  margin: 0 0 2px !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}
.herod-locker-current { line-height: 1.4; }
.herod-locker-current span { color: #666; }

/* Empty-state prompt: quiet, neutral */
.herod-locker-empty {
  color: #6b6b6b;
  font-size: 12.5px;
}

/* Chosen-locker card: neutral, brand-agnostic */
.herod-locker-has {
  background: #fafafa;
  border: 1px solid #e4e4e4;
  border-left: 3px solid #b9b9b9;
  border-radius: 8px;
  padding: 9px 12px;
  max-width: 340px;
}
.herod-locker-has strong { color: #222; }

/* Neutral outlined button — inherits nicely into any theme */
.herod-locker-ui .herod-locker-open,
.herod-locker-ui .herod-locker-open:hover,
.herod-locker-ui .herod-locker-open:focus {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 9px 15px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  color: #333;
  background: #fff;
  border: 1px solid #cccccc;
  border-radius: 8px;
  box-shadow: none;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.herod-locker-ui .herod-locker-open:hover {
  background: #f4f4f4;
  border-color: #a9a9a9;
}
.herod-locker-ui .herod-locker-open:active { transform: translateY(1px); }
.herod-locker-ui .herod-locker-open.is-change {
  color: #555;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 2px 2px;
  font-weight: 500;
  text-decoration: underline;
  border-radius: 0;
}
.herod-locker-ui .herod-locker-open.is-change:hover { color: #222; background: transparent; }

/* Change · Clear actions row */
.herod-locker-actions { display: flex; align-items: center; gap: 8px; }
.herod-locker-sep { color: #bbb; }
.herod-locker-ui .herod-locker-clear {
  background: transparent; border: 0; box-shadow: none;
  padding: 2px 2px; font-weight: 500; color: #b32d2e;
  text-decoration: underline; cursor: pointer; border-radius: 0;
  font-size: 13px;
}
.herod-locker-ui .herod-locker-clear:hover { color: #8f1f1f; background: transparent; }

/* Modal */
.herod-modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.45);
  z-index: 999999; display: none; align-items: center; justify-content: center;
}
.herod-modal-overlay.open { display: flex; }
.herod-modal {
  background: #fff; width: min(960px, 94vw); height: min(640px, 90vh);
  border-radius: 10px; overflow: hidden; display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
}
.herod-modal-head {
  display: flex; align-items: center; gap: 10px; padding: 12px 16px;
  border-bottom: 1px solid #eee;
}
.herod-modal-head h3 { margin: 0; font-size: 16px; flex: 1; }
.herod-modal-close { background: none; border: 0; font-size: 24px; cursor: pointer; line-height: 1; color: #888; }
.herod-modal-body { flex: 1; display: flex; min-height: 0; }
.herod-list-pane { width: 340px; border-right: 1px solid #eee; display: flex; flex-direction: column; }
.herod-search { padding: 10px; border-bottom: 1px solid #eee; }
/* While first locating, hide the search box and let the "locating" message stand alone */
.herod-modal.is-locating .herod-search { display: none; }
.herod-modal.is-locating .herod-loading { padding: 40px 20px; font-size: 14px; }
.herod-search input { width: 100%; padding: 8px 10px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 6px; }
.herod-list { overflow-y: auto; flex: 1; }
.herod-item { padding: 10px 12px; border-bottom: 1px solid #f0f0f0; cursor: pointer; }
.herod-item:hover, .herod-item.active { background: #f3eefb; }
.herod-item strong { display: block; font-size: 13px; }
.herod-item small { color: #666; display: block; margin-top: 2px; }
.herod-item .herod-dist { color: #7f54b3; font-weight: 600; }
.herod-map { flex: 1; min-width: 0; }
.herod-empty, .herod-loading { padding: 20px; color: #777; text-align: center; }
.herod-pop button { margin-top: 6px; width: 100%; padding: 6px; cursor: pointer; background: #7f54b3; color: #fff; border: 0; border-radius: 5px; }
@media (max-width: 680px) {
  .herod-modal-body { flex-direction: column; }
  .herod-list-pane { width: 100%; height: 45%; border-right: 0; border-bottom: 1px solid #eee; }
  .herod-map { height: 55%; }
}