/* ============================================================
   Leuchtreklame-Shop · WooCommerce-Hinweise
   .woocommerce-message (Erfolg), -info (Hinweis), -error (Fehler)
   Gilt shopweit, auch für Germanized- und Elementor-Hinweise.
   ============================================================ */

:root {
  --lrs-n-sans: var(--e-global-typography-text-font-family, "Open Sans"), sans-serif;
  --lrs-n-ink: #16232B;
  --lrs-n-petrol: #2A7CA0;
  --lrs-n-ok: #2E7D62;
  --lrs-n-ok-bg: #EFF7F3;
  --lrs-n-ok-line: #D4E9DF;
  --lrs-n-info-bg: #F2F7F9;
  --lrs-n-info-line: #C9D6DB;
  --lrs-n-err: #B3261E;
  --lrs-n-err-bg: #FBF1F0;
  --lrs-n-err-line: #EBCBC7;
  --lrs-n-i-check: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='8.5' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3Cpath d='M6.2 10.3l2.5 2.5 5-5.3' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --lrs-n-i-info: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='8.5' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3Cpath d='M10 9v5' stroke='%23000' stroke-width='1.8' stroke-linecap='round'/%3E%3Ccircle cx='10' cy='6.2' r='1.1' fill='%23000'/%3E%3C/svg%3E");
  --lrs-n-i-error: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 2.5l8 14H2z' fill='none' stroke='%23000' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M10 8v4' stroke='%23000' stroke-width='1.8' stroke-linecap='round'/%3E%3Ccircle cx='10' cy='14.4' r='1.05' fill='%23000'/%3E%3C/svg%3E");
}

.woocommerce-notices-wrapper:empty {
  display: none;
}

.woocommerce-notices-wrapper {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0 0 24px;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  position: relative !important;
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  width: auto !important;
  margin: 0 0 16px !important;
  padding: 15px 20px 15px 52px !important;
  box-sizing: border-box;
  border: 1px solid var(--lrs-n-info-line) !important;
  border-radius: 0 !important;
  background: var(--lrs-n-info-bg) !important;
  box-shadow: none !important;
  list-style: none !important;
  font-family: var(--lrs-n-sans) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--lrs-n-ink) !important;
}

.woocommerce-notices-wrapper > .woocommerce-message,
.woocommerce-notices-wrapper > .woocommerce-info,
.woocommerce-notices-wrapper > .woocommerce-error {
  margin: 0 !important;
}

/* Icon */
.woocommerce-message:before,
.woocommerce-info:before,
.woocommerce-error:before {
  content: "" !important;
  position: absolute !important;
  left: 20px !important;
  top: 50% !important;
  width: 20px !important;
  height: 20px !important;
  margin: -10px 0 0 !important;
  transform: none !important;
  font-size: 0 !important;
  background-color: var(--lrs-n-petrol) !important;
  -webkit-mask: var(--lrs-n-i-info) center / contain no-repeat;
          mask: var(--lrs-n-i-info) center / contain no-repeat;
}

.woocommerce-message:after,
.woocommerce-info:after,
.woocommerce-error:after {
  content: none !important;
  display: none !important;
}

/* Erfolg */
.woocommerce-message {
  border-color: var(--lrs-n-ok-line) !important;
  background: var(--lrs-n-ok-bg) !important;
}

.woocommerce-message:before {
  background-color: var(--lrs-n-ok) !important;
  -webkit-mask-image: var(--lrs-n-i-check);
          mask-image: var(--lrs-n-i-check);
}

/* Fehler (Liste) */
.woocommerce-error {
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  border-color: var(--lrs-n-err-line) !important;
  background: var(--lrs-n-err-bg) !important;
}

.woocommerce-error:before {
  top: 16px !important;
  margin-top: 0 !important;
  background-color: var(--lrs-n-err) !important;
  -webkit-mask-image: var(--lrs-n-i-error);
          mask-image: var(--lrs-n-i-error);
}

.woocommerce-error > li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.woocommerce-error > li:before {
  content: none !important;
}

.woocommerce-error strong {
  font-weight: 600;
}

/* Links und Buttons im Hinweis ("Warenkorb anzeigen", "Erneut versuchen") */
.woocommerce-message a:not(.button),
.woocommerce-info a:not(.button),
.woocommerce-error a:not(.button) {
  font-weight: 600;
  color: var(--lrs-n-petrol) !important;
  text-decoration: none !important;
}

.woocommerce-message a:not(.button):hover,
.woocommerce-info a:not(.button):hover,
.woocommerce-error a:not(.button):hover {
  text-decoration: underline !important;
}

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
  order: 2;
  float: none !important;
  margin: 0 0 0 auto !important;
  padding: 9px 16px !important;
  border: 1px solid var(--lrs-n-ink) !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  font-family: "Oswald", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  color: var(--lrs-n-ink) !important;
  transition: color .15s, border-color .15s;
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover,
.woocommerce-error .button:hover {
  border-color: var(--lrs-n-petrol) !important;
  color: var(--lrs-n-petrol) !important;
}

/* Fokus nach AJAX-Hinweis (Woo setzt tabindex=-1 + focus) */
.woocommerce-message:focus,
.woocommerce-info:focus,
.woocommerce-error:focus {
  outline: none;
}

@media (max-width: 600px) {
  .woocommerce-message,
  .woocommerce-info,
  .woocommerce-error {
    padding: 13px 16px 13px 46px !important;
    font-size: 14px !important;
  }

  .woocommerce-message:before,
  .woocommerce-info:before,
  .woocommerce-error:before {
    left: 16px !important;
  }

  .woocommerce-message .button,
  .woocommerce-info .button,
  .woocommerce-error .button {
    margin-left: 0 !important;
  }
}
