/* Hide the old sorter only where the combined catalogue control exists. */
body.ms-cro-has-catalog-controls form.woocommerce-ordering { display: none !important; }
body:has(.ms-cro-catalog-controls) form.woocommerce-ordering { display: none !important; }
.ms-cro-catalog-controls {
  clear: both; margin: 16px 12px 12px; border: 1px solid #e5e7eb;
  border-radius: 8px; background: #fff; color: #334155;
}
.ms-cro-catalog-controls summary {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 38px; padding: 0 12px; list-style: none; cursor: pointer;
  font: 500 13px/1.25 'Inter', sans-serif;
}
.ms-cro-catalog-controls summary::-webkit-details-marker { display: none; }
.ms-cro-catalog-controls summary::marker { content: ''; }
.ms-cro-catalog-controls summary svg { width: 16px; height: 16px; color: #214249; }
.ms-cro-catalog-controls summary:focus-visible,
.ms-cro-catalog-dialog button:focus-visible,
.ms-cro-catalog-dialog a:focus-visible {
  outline: 2px solid #14788b; outline-offset: 3px;
}
.ms-cro-catalog-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px;
  background: #214249; color: #fff; font-size: 11px; font-weight: 600;
}
.ms-cro-catalog-form { display: flex; flex-direction: column; min-height: 0; margin: 0; }
.ms-cro-catalog-fields { display: grid; gap: 14px; overflow-y: auto; padding: 18px 20px; }
.ms-cro-catalog-fields label { margin: 0; font-size: 13px; font-weight: 600; color: #334155; }
.ms-cro-catalog-fields select {
  display: block; box-sizing: border-box; width: 100%; min-height: 42px;
  height: 42px; padding: 8px 10px; margin: 6px 0 0; border: 1px solid #dce1e7;
  border-radius: 8px; color: #0f172a; background: #fff; font-size: 16px; font-weight: 400;
}
.ms-cro-catalog-actions {
  display: flex; align-items: center; flex-shrink: 0; gap: 18px;
  padding: 14px 20px; padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #e5e7eb;
}
.ms-cro-catalog-actions button[type=submit] {
  flex: 1; min-height: 42px; border: 0; border-radius: 8px;
  background: #214249; color: #fff; padding: 10px 14px; font-size: 14px; font-weight: 600;
}
.ms-cro-catalog-actions a { padding: 10px 0; color: #475569; font-size: 13px; text-decoration: underline; }
.ms-cro-catalog-dialog:not([open]) { display: none !important; }
.ms-cro-catalog-dialog[open] {
  display: flex; flex-direction: column; box-sizing: border-box;
  position: fixed; inset: auto 0 0; width: 100%; max-width: 500px;
  max-height: 85vh; max-height: 85dvh; margin: 0 auto; padding: 0;
  border: 0; border-radius: 16px 16px 0 0; overflow: hidden;
  background: #fff; color: #0f172a; box-shadow: 0 -8px 32px rgba(15,23,42,.12);
}
.ms-cro-catalog-dialog::backdrop { background: rgba(15,23,42,.38); }
.ms-cro-catalog-head {
  display: flex; align-items: center; justify-content: space-between;
  flex-shrink: 0; padding: 16px 20px 12px; border-bottom: 1px solid #e5e7eb;
}
.ms-cro-catalog-head h2 { margin: 0; padding: 0; font-size: 18px; line-height: 1.3; font-weight: 700; }
.ms-cro-catalog-close {
  display: flex; align-items: center; justify-content: center;
  flex: 0 0 32px !important; width: 32px !important; height: 32px; min-height: 32px;
  padding: 0; border: 1px solid #e5e7eb; border-radius: 8px;
  background: #f8fafc; color: #334155; font-size: 24px; font-weight: 400;
}
.ms-cro-no-results { padding: 24px; text-align: center; }
@media (min-width: 768px) {
  .ms-cro-catalog-controls { width: 250px; max-width: calc(100% - 24px); margin-left: auto; }
  .ms-cro-catalog-controls[open] { width: auto; }
  .ms-cro-catalog-dialog[open] { inset: 0; margin: auto; border-radius: 16px; height: fit-content; }
}

/* Match the existing archive toolbar breakpoint; preserve the phone layout. */
@media (min-width: 992px) {
  html body .ms-archive-toolbar.ms-cro-catalog-toolbar {
    display: flex !important; align-items: center !important;
    justify-content: space-between !important; gap: 20px !important;
    width: 100% !important; box-sizing: border-box;
    padding: 8px 0 !important; margin: 0 0 12px !important;
    border-top: 1px solid #e5e7eb !important;
    border-bottom: 1px solid #e5e7eb !important;
    background: #fff !important;
  }
  html body .ms-archive-toolbar.ms-cro-catalog-toolbar > .delivery-section {
    display: flex !important; align-items: center !important;
    justify-content: flex-start !important; gap: 20px !important;
    flex: 1 1 auto; min-width: 0; width: auto !important;
    float: none !important; padding: 0 !important; margin: 0 !important;
    border: 0 !important; background: transparent !important;
  }
  html body .ms-archive-toolbar.ms-cro-catalog-toolbar > .ms-cro-catalog-controls {
    flex: 0 0 auto; width: auto; max-width: none; clear: none; margin: 0;
  }
  html body .ms-archive-toolbar.ms-cro-catalog-toolbar summary { min-height: 38px; }
  html body .ms-archive-toolbar.ms-cro-catalog-toolbar:has(> details[open]) { flex-wrap: wrap; }
  html body .ms-archive-toolbar.ms-cro-catalog-toolbar > details[open] { flex-basis: 100%; }
}
html body .ms-archive-toolbar.ms-cro-catalog-toolbar > .woocommerce { display: none !important; }