/* ==========================================================================
   Utility classes – kolory, marginesy, tekst, przyciski uniwersalne itp.
   ========================================================================== */
.bg-cream {
    background: #FFF6EF;
}

.margin-top-120 {
    margin-top: 120px;
}

.bg-greyblue {
    background: #F0F4F8;
}

.divider {
    width: 100%;
    height: 1px;
    background-color: #e0e0e0;
    margin: 20px 0;
}

.aspect-ratio-rwd-landscape {
    aspect-ratio: 16/10;
}

.fs-7 {
    font-size: 12px;
    line-height: 16px;
}

.negative-margin {
    margin-left: -20px;
}

/* Szary styl dla nieaktywnych przycisków (np. CF7) */
.btn:disabled,
.btn.disabled,
button[disabled],
input[type="submit"][disabled],
.wpcf7 form .wpcf7-submit:disabled {
  background: #e6e6e6 !important;
  border-color: #d9d9d9 !important;
  color: #6c757d !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}
.btn:disabled:hover,
.btn.disabled:hover,
button[disabled]:hover,
input[type="submit"][disabled]:hover,
.wpcf7 form .wpcf7-submit:disabled:hover {
  box-shadow: none !important;
  transform: none !important;
}

/* LOST PASSWORD – ładny baner + notka pod spodem
   (tylko na stronie resetu hasła WooCommerce) */
body.woocommerce-account.woocommerce-lost-password .woocommerce .woocommerce-message{
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1.25rem;
  background: #fff;                 /* karta jak w formularzach */
  border: 1px solid #198754;        /* zielony obrys (Bootstrap success) */
  color: #198754;
  border-radius: .75rem;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  font-weight: 600;
  line-height: 1.35;
  margin: .75rem 0 .25rem;
}

/* Okrągła ikonka z „check” po lewej */
body.woocommerce-account.woocommerce-lost-password .woocommerce .woocommerce-message::before{
  content: "";
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid currentColor;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  /* zielony „check” w SVG (data URI) */
  background-image: url('data:image/svg+xml;utf8,\<svg xmlns="http://www.w3.org/2000/svg" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"%23198754\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\<path d=\"M20 6L9 17l-5-5\"/></svg>');
}

/* Dłuższa notka w <p> – mała, szara i wyrównana z tekstem banera */
body.woocommerce-account.woocommerce-lost-password .woocommerce .woocommerce-message + p{
  font-size: .875rem;               /* small */
  color: #6c757d;                   /* text-secondary */
  margin: .25rem 0 0;
  line-height: 1.55;
  /* wcięcie, żeby tekst zaczynał się równo za ikonką (36 + ramka + odstęp) */
  padding-left: calc(36px + .75rem);
}

/* Mobile drobne korekty */
@media (max-width: 576px){
  body.woocommerce-account.woocommerce-lost-password .woocommerce .woocommerce-message{
    padding: .875rem 1rem;
    border-radius: .65rem;
  }
  body.woocommerce-account.woocommerce-lost-password .woocommerce .woocommerce-message::before{
    flex-basis: 32px; width: 32px; height: 32px; background-size: 16px 16px;
  }
  body.woocommerce-account.woocommerce-lost-password .woocommerce .woocommerce-message + p{
    padding-left: calc(32px + .6rem);
  }
}

body.woocommerce-account.woocommerce-lost-password p.message.reset-pass,
body.woocommerce-account.woocommerce-lost-password .login .message,
body.woocommerce-account.woocommerce-lost-password #login_error { display:none !important; }