/* Mercuno v2.7.4 — Shared stock-alert behavior, theme-native appearance.
 * Native <dialog> stays in the top layer; only the stock-alert dialog is targeted.
 * The six storefront themes retain their own typography and merchant-configured
 * accent/button color. Other modal implementations are left untouched.
 */
.store-shell {
  --stock-modal-background: var(--mercuno-surface, #fff);
  --stock-modal-text: var(--mercuno-text, #233247);
  --stock-modal-muted: var(--mercuno-muted, #607081);
  --stock-modal-border: var(--mercuno-border, #d8e0e6);
  --stock-modal-action: var(--mercuno-button, #286b80);
  --stock-modal-action-text: var(--mercuno-button-text, #fff);
  --stock-modal-action-hover: var(--mercuno-button-hover, #225669);
  --stock-modal-radius: 12px;
  --stock-modal-shadow: 0 24px 70px rgba(15, 32, 45, .23);
}
.store-shell.theme-default { --stock-modal-radius: 9px; }
.store-shell.theme-hexa { --stock-modal-radius: 12px; }
.store-shell.theme-frame {
  --stock-modal-background: var(--frame-surface, #faf8f4);
  --stock-modal-text: var(--frame-ink, #2c2924);
  --stock-modal-muted: var(--frame-muted, #776d61);
  --stock-modal-border: var(--frame-line, #d6cbc0);
  --stock-modal-action: var(--frame-forest, #496f62);
  --stock-modal-action-text: #fff;
  --stock-modal-action-hover: var(--frame-ink, #2c2924);
  --stock-modal-radius: 3px;
}
.store-shell.theme-bloom { --stock-modal-radius: 20px; }
.store-shell.theme-dolphin {
  --stock-modal-action: var(--d3-ocean, #087fa3);
  --stock-modal-action-text: #fff;
  --stock-modal-action-hover: var(--d3-deep, #082f4a);
  --stock-modal-radius: 10px;
}
.store-shell.theme-wedding {
  --stock-modal-background: var(--wedding-paper, #fcf8f5);
  --stock-modal-text: var(--wedding-ink, #423039);
  --stock-modal-muted: #76646a;
  --stock-modal-border: var(--wedding-line, #ded0ca);
  --stock-modal-action: var(--wedding-rose, #986776);
  --stock-modal-action-text: #fff;
  --stock-modal-action-hover: #75505e;
  --stock-modal-radius: 18px;
}

/* !important overrides the earlier broad .store-shell dialog:modal size rule.
 * Explicit top/left + translate also survives theme dialog positioning rules. */
body.store-shell dialog.mercuno-stock-alert-dialog:is([open], :modal) {
  box-sizing: border-box !important;
  position: fixed !important;
  inset: auto !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  width: min(405px, calc(100vw - 28px)) !important;
  min-width: 0 !important;
  max-width: calc(100vw - 28px) !important;
  height: auto !important;
  max-height: calc(100dvh - 28px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain;
  border: 1px solid var(--stock-modal-border) !important;
  border-radius: var(--stock-modal-radius) !important;
  padding: 0 !important;
  background: var(--stock-modal-background) !important;
  color: var(--stock-modal-text) !important;
  font: inherit !important;
  box-shadow: var(--stock-modal-shadow) !important;
}
body.store-shell dialog.mercuno-stock-alert-dialog::backdrop {
  background: rgba(8, 19, 27, .58);
  backdrop-filter: blur(2px);
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box {
  display: grid;
  gap: 13px;
  margin: 0;
  padding: clamp(20px, 4vw, 28px);
  background: transparent;
  color: inherit;
  font: inherit;
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box h2 {
  color: var(--stock-modal-text);
  font: inherit;
  font-size: clamp(20px, 4.5vw, 23px);
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: -.02em;
  margin: 0 40px 2px 0;
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box p {
  color: var(--stock-modal-muted);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.55;
  margin: 0;
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box label {
  display: grid;
  gap: 7px;
  color: var(--stock-modal-text);
  font-size: 13px;
  font-weight: 600;
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box input[type=email] {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 11px 12px;
  color: var(--stock-modal-text);
  background: var(--stock-modal-background);
  border: 1px solid var(--stock-modal-border);
  border-radius: max(3px, calc(var(--stock-modal-radius) / 2));
  font: inherit;
  font-size: 16px;
  outline: none;
  box-shadow: none;
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box input[type=email]:focus-visible {
  border-color: var(--stock-modal-action);
  outline: 2px solid var(--stock-modal-action);
  outline-offset: 2px;
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box [data-stock-alert-submit] {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  padding: 12px 14px;
  border: 1px solid transparent;
  border-radius: max(3px, calc(var(--stock-modal-radius) / 2));
  background: var(--stock-modal-action);
  color: var(--stock-modal-action-text);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, opacity .18s ease;
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box [data-stock-alert-submit]:hover:not(:disabled),
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box [data-stock-alert-submit]:focus-visible:not(:disabled) {
  background: var(--stock-modal-action-hover);
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box [data-stock-alert-submit]:focus-visible,
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-close:focus-visible {
  outline: 2px solid var(--stock-modal-action);
  outline-offset: 3px;
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box [data-stock-alert-submit]:disabled {opacity: .65;cursor:wait}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-close {
  position: absolute;
  top: 13px;
  right: 13px;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--stock-modal-border);
  border-radius: max(4px, calc(var(--stock-modal-radius) / 2));
  background: transparent;
  color: var(--stock-modal-text);
  font: inherit;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-close:hover {
  background: color-mix(in srgb, var(--stock-modal-text) 7%, transparent);
}
body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box .mercuno-stock-alert-consent {font-size: 11.5px;line-height: 1.5}
body.store-shell .mercuno-stock-alert-dialog [data-stock-alert-error] {color: var(--stock-modal-text);font-weight: 600}
body.store-shell .mercuno-stock-alert-dialog [data-stock-alert-error]:empty {display: none}
body.store-shell .mercuno-stock-alert-dialog [data-stock-alert-email][hidden] {display: none !important}
@media(max-width: 350px) {
  body.store-shell dialog.mercuno-stock-alert-dialog:is([open], :modal) { width: calc(100vw - 20px) !important; max-width: calc(100vw - 20px) !important; }
  body.store-shell .mercuno-stock-alert-dialog .mercuno-stock-alert-box {padding: 18px;gap: 11px}
}

/* Shared card stock-alert action pattern: HEXA-style vertical action stack. */
body.store-shell .default-product-card .mercuno-stock-actions{display:flex!important;flex-direction:column!important;align-items:flex-end!important;justify-content:flex-end!important;gap:6px!important;min-width:0!important;max-width:100%!important;grid-column:2!important;justify-self:end!important;flex:0 1 auto!important}
body.store-shell .default-product-card .mercuno-stock-actions .mercuno-stock-alert-action{display:inline-flex;justify-content:center;align-items:center;gap:4px;white-space:nowrap;max-width:100%;width:max-content;min-width:0;font-size:10px;line-height:1.2;padding:4px 7px;border:1px solid #cbd5db;border-radius:5px;background:transparent;color:inherit;cursor:pointer;box-sizing:border-box}
body.store-shell .default-product-card .mercuno-stock-actions .mercuno-stock-alert-action[hidden]{display:none!important}
body.store-shell .default-product-card .mercuno-stock-actions .default-add-cart{max-width:100%;min-width:0;margin:0;white-space:normal;overflow-wrap:normal;word-break:normal;text-align:center;justify-content:center}
body.store-shell .default-product-card .mercuno-stock-actions .default-add-cart:disabled{cursor:not-allowed}
body.store-shell .default-product-card:has(.mercuno-stock-actions) .default-product-bottom{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,max-content)!important;align-items:end;justify-content:space-between;gap:8px;min-width:0}
body.store-shell .default-product-card:has(.mercuno-stock-actions) .default-product-price-wrap{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:2px!important;min-width:0!important;max-width:100%;white-space:normal!important}
body.store-shell .default-product-card:has(.mercuno-stock-actions) .default-product-tax-note{display:block!important;width:auto!important;white-space:nowrap!important;writing-mode:horizontal-tb!important;text-orientation:mixed!important;line-height:1.2!important}
@media(max-width:520px){body.store-shell .default-product-card .mercuno-stock-actions{gap:5px!important}body.store-shell .default-product-card .mercuno-stock-actions .mercuno-stock-alert-action{font-size:9px;padding:4px 5px}body.store-shell .default-product-card:has(.mercuno-stock-actions) .default-product-bottom{gap:5px!important}}
/* Footer socials centered regardless of number of configured profiles. */
body.store-shell .mercuno-custom-footer .mercuno-footer-socials{display:flex!important;justify-content:center!important;align-items:center!important;flex-wrap:wrap!important;gap:12px!important;width:100%!important}
/* Compact two-column catalogues: keep both actions readable instead of crushing price or clipping button. */
@media(max-width:600px){
 body.store-shell:is(.theme-bloom,.theme-dolphin,.theme-wedding) .default-product-card:has(.mercuno-stock-actions) .default-product-bottom{grid-template-columns:minmax(0,1fr)!important;row-gap:8px!important}
 body.store-shell:is(.theme-bloom,.theme-dolphin,.theme-wedding) .default-product-card .mercuno-stock-actions{grid-column:1!important;justify-self:end!important;width:auto!important;max-width:100%!important}
 body.store-shell:is(.theme-bloom,.theme-dolphin,.theme-wedding) .default-product-card .mercuno-stock-actions .mercuno-stock-alert-action{max-width:100%!important;white-space:normal!important;overflow-wrap:normal!important;text-wrap:balance}
}
