/*
 * Bülten Üye — kompakt/footer düzeni
 * - Sabit renk yok: currentColor + color-mix() ile WoodMart'ın footer
 *   arka planı ne olursa olsun (koyu/açık) otomatik uyum sağlar.
 * - Vurgu rengini WoodMart'ın kendi tema rengiyle eşleştirmek için
 *   Customizer > Ek CSS kısmına şunu ekleyebilirsin:
 *   :root { --bulten-uye-accent: #C59D5F; }  (kendi tema renginle değiştir)
 */
.bulten-uye {
  --bulten-uye-accent: currentColor;
  --bulten-uye-radius: 2px;
  container-type: inline-size;
  width: 100%;
  max-width: 380px;
  margin: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  box-sizing: border-box;
}

.bulten-uye *,
.bulten-uye *::before,
.bulten-uye *::after {
  box-sizing: border-box;
}

.bulten-uye__title {
  margin: 0 0 6px;
  color: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.bulten-uye__desc {
  margin: 0 0 12px;
  color: inherit;
  opacity: 0.7;
  font-size: 13px;
  line-height: 1.6;
}

.bulten-uye__form {
  margin-top: 0;
}

.bulten-uye__row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.bulten-uye__input {
  flex: 1 1 150px;
  min-width: 0;
  height: 38px;
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, currentColor 25%, transparent);
  background: color-mix(in srgb, currentColor 6%, transparent);
  color: inherit;
  font-size: 13px;
  border-radius: var(--bulten-uye-radius);
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.bulten-uye__input::placeholder {
  color: currentColor;
  opacity: 0.5;
}

.bulten-uye__input:focus {
  outline: none;
  border-color: var(--bulten-uye-accent);
  background: color-mix(in srgb, currentColor 10%, transparent);
}

.bulten-uye__button {
  flex: 0 0 auto;
  height: 38px;
  padding: 0 16px;
  border: 1px solid var(--bulten-uye-accent);
  background: transparent;
  color: inherit;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  border-radius: var(--bulten-uye-radius);
  transition: background-color 0.2s ease, opacity 0.2s ease;
}

.bulten-uye__button:hover {
  background: color-mix(in srgb, var(--bulten-uye-accent) 15%, transparent);
}

.bulten-uye__note,
.bulten-uye__message {
  margin: 8px 0 0;
  font-size: 12px;
  line-height: 1.5;
}

.bulten-uye__note {
  color: inherit;
  opacity: 0.55;
}

.bulten-uye__message.is-success {
  color: #4caf7d;
}

.bulten-uye__message.is-error {
  color: #e06666;
}

/* Dar sütun (WoodMart footer widget alanı gibi): input/buton alt alta geçsin */
@container (max-width: 340px) {
  .bulten-uye__row {
    flex-direction: column;
  }

  .bulten-uye__input,
  .bulten-uye__button {
    width: 100%;
  }
}

/* Container query desteklemeyen tarayıcılar için yedek (mobil genişlik) */
@media (max-width: 480px) {
  .bulten-uye__row {
    flex-direction: column;
  }

  .bulten-uye__input,
  .bulten-uye__button {
    width: 100%;
  }
}