/* ========================================
   AcyMailing - Ucoopia Style
   Design System: theme.json tokens
   ======================================== */

/* ========================================
   Reset AcyMailing default styles
   ======================================== */
#acym_fulldiv_formAcym1.acym__subscription__form-erase,
[id^="acym_fulldiv_formAcym"].acym__subscription__form-erase {
  /* Reset base */
}

/* ========================================
   Form Container
   ======================================== */
[id^="acym_fulldiv_formAcym"] {
  font-family: var(--ucoopia-font-body, 'Univers', sans-serif);
}

[id^="acym_fulldiv_formAcym"] .acym__subscription__form__fields {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center !important;
  justify-content: center !important;
  gap: var(--ucoopia-spacing-md, 16px) !important;
}

[id^="acym_fulldiv_formAcym"] .acym__subscription__form__fields > * {
  margin: 0 !important;
}

/* ========================================
   Input Fields
   ======================================== */
[id^="acym_fulldiv_formAcym"] .onefield {
  flex: 1;
  min-width: 200px;
  max-width: 300px;
}

[id^="acym_fulldiv_formAcym"] input.cell,
[id^="acym_fulldiv_formAcym"] input[type="text"],
[id^="acym_fulldiv_formAcym"] input[type="email"] {
  width: 100%;
  padding: var(--ucoopia-spacing-sm, 12px) var(--ucoopia-spacing-lg, 24px) !important;
  background-color: var(--ucoopia-white, #FFFFFF) !important;
  border: none !important;
  border-radius: var(--ucoopia-radius-button, 25px) !important;
  font-family: var(--ucoopia-font-body, 'Univers', sans-serif) !important;
  font-size: 16px !important;
  color: var(--ucoopia-green-primary, #006666) !important;
  outline: none !important;
  transition: box-shadow 0.2s ease !important;
  box-sizing: border-box;
}

[id^="acym_fulldiv_formAcym"] input.cell::placeholder,
[id^="acym_fulldiv_formAcym"] input[type="text"]::placeholder,
[id^="acym_fulldiv_formAcym"] input[type="email"]::placeholder {
  color: rgba(0, 102, 102, 0.5) !important;
}

[id^="acym_fulldiv_formAcym"] input.cell:focus,
[id^="acym_fulldiv_formAcym"] input[type="text"]:focus,
[id^="acym_fulldiv_formAcym"] input[type="email"]:focus {
  box-shadow: 0 0 0 3px rgba(244, 163, 35, 0.3) !important;
}

/* ========================================
   Error Messages
   ======================================== */
[id^="acym_fulldiv_formAcym"] .acym__field__error__block {
  font-size: 12px;
  color: var(--ucoopia-red, #A80039);
  margin-top: var(--ucoopia-spacing-xs, 8px);
  padding-left: var(--ucoopia-spacing-lg, 24px);
}

/* ========================================
   Button Container
   ======================================== */
[id^="acym_fulldiv_formAcym"] .acym__subscription__form__button {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  margin-top: var(--ucoopia-spacing-md, 16px);
}

/* ========================================
   Button - Ucoopia Style with Circle Effect
   ======================================== */
[id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: var(--ucoopia-spacing-sm, 12px) var(--ucoopia-spacing-xl, 32px) !important;
  background-color: rgba(244, 163, 35, 0.5) !important;
  border: none !important;
  border-radius: var(--ucoopia-radius-button, 25px) !important;
  cursor: pointer !important;
  overflow: hidden !important;
  min-width: 150px !important;
  font-family: var(--ucoopia-font-cta, 'franklin-gothic-compressed', sans-serif) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: var(--ucoopia-white, #FFFFFF) !important;
  letter-spacing: 0.44px !important;
  text-transform: uppercase !important;
  transition: transform 0.2s ease !important;
}

/* Circle effect using pseudo-element */
[id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 50px;
  background-color: var(--ucoopia-yellow-primary, #F4A323);
  border-radius: var(--ucoopia-radius-button, 25px);
  transition: width 0.3s ease;
  z-index: -1;
}

[id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button:hover::before {
  width: 100%;
}

/* Button hover state */
[id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button:hover {
  transform: translateY(-2px);
}

/* Button active state */
[id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button:active {
  transform: translateY(0);
}

/* ========================================
   Hidden Lists (if visible)
   ======================================== */
[id^="acym_fulldiv_formAcym"] .acym__subscription__form__lists {
  display: none !important;
}

/* If lists need to be shown */
[id^="acym_fulldiv_formAcym"].show-lists .acym__subscription__form__lists {
  display: flex !important;
  align-items: center;
  gap: var(--ucoopia-spacing-md, 16px);
}

[id^="acym_fulldiv_formAcym"] .acym__subscription__form__lists label {
  display: flex;
  align-items: center;
  gap: var(--ucoopia-spacing-xs, 8px);
  font-family: var(--ucoopia-font-body, 'Univers', sans-serif);
  font-size: 14px;
  color: var(--ucoopia-white, #FFFFFF);
  cursor: pointer;
}

[id^="acym_fulldiv_formAcym"] .acym__subscription__form__lists input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--ucoopia-yellow-primary, #F4A323);
}

/* ========================================
   Inline Form Layout (horizontal)
   ======================================== */
[id^="acym_fulldiv_formAcym"].acym--inline .acym__subscription__form__fields {
  flex-wrap: nowrap;
}

[id^="acym_fulldiv_formAcym"].acym--inline .acym__subscription__form__button {
  margin-top: 0;
}

/* ========================================
   On Dark Background (footer style)
   ======================================== */
.footer [id^="acym_fulldiv_formAcym"],
.bg-green [id^="acym_fulldiv_formAcym"],
.has-green-primary-background-color [id^="acym_fulldiv_formAcym"] {
  /* Inputs stay white - good contrast */
}

/* ========================================
   On Light Background
   ======================================== */
.bg-white [id^="acym_fulldiv_formAcym"] input.cell,
.bg-white [id^="acym_fulldiv_formAcym"] input[type="text"],
.bg-white [id^="acym_fulldiv_formAcym"] input[type="email"],
.has-white-background-color [id^="acym_fulldiv_formAcym"] input.cell {
  background-color: var(--ucoopia-green-light, #E6F2F2) !important;
  border: 1px solid var(--ucoopia-green-primary, #006666) !important;
}

/* Secondary button style (green) for light backgrounds */
.bg-white [id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button,
.has-white-background-color [id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button {
  background-color: rgba(0, 102, 102, 0.5) !important;
  color: var(--ucoopia-white, #FFFFFF) !important;
}

.bg-white [id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button::before,
.has-white-background-color [id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button::before {
  background-color: var(--ucoopia-green-primary, #006666);
}

/* ========================================
   Success/Error Messages
   ======================================== */
[id^="acym_fulldiv_formAcym"] .acym_subscription_success,
[id^="acym_fulldiv_formAcym"] .acym__subscription__response__success {
  background-color: rgba(74, 171, 39, 0.1);
  border: 1px solid var(--ucoopia-vert, #4AAB27);
  border-radius: var(--ucoopia-radius-sm, 8px);
  padding: var(--ucoopia-spacing-md, 16px);
  margin-top: var(--ucoopia-spacing-md, 16px);
  color: var(--ucoopia-vert, #4AAB27);
  font-family: var(--ucoopia-font-body, 'Univers', sans-serif);
  font-size: 14px;
  text-align: center;
}

[id^="acym_fulldiv_formAcym"] .acym_subscription_error,
[id^="acym_fulldiv_formAcym"] .acym__subscription__response__error {
  background-color: rgba(168, 0, 57, 0.1);
  border: 1px solid var(--ucoopia-red, #A80039);
  border-radius: var(--ucoopia-radius-sm, 8px);
  padding: var(--ucoopia-spacing-md, 16px);
  margin-top: var(--ucoopia-spacing-md, 16px);
  color: var(--ucoopia-red, #A80039);
  font-family: var(--ucoopia-font-body, 'Univers', sans-serif);
  font-size: 14px;
  text-align: center;
}

/* ========================================
   Loading State
   ======================================== */
[id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button.loading {
  pointer-events: none;
  opacity: 0.7;
}

[id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button.loading::after {
  content: '';
  position: absolute;
  width: 20px;
  height: 20px;
  border: 2px solid transparent;
  border-top-color: var(--ucoopia-white, #FFFFFF);
  border-radius: 50%;
  animation: acym-spin 0.8s linear infinite;
  right: 16px;
}

@keyframes acym-spin {
  to {
    transform: rotate(360deg);
  }
}

/* ========================================
   Responsive
   ======================================== */
@media (max-width: 768px) {
  [id^="acym_fulldiv_formAcym"] .acym__subscription__form__fields {
    flex-direction: column !important;
    gap: var(--ucoopia-spacing-sm, 12px) !important;
  }

  [id^="acym_fulldiv_formAcym"] .onefield {
    width: 100%;
    max-width: none;
  }

  [id^="acym_fulldiv_formAcym"] .acym__subscription__form__button {
    width: 100%;
  }

  [id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button {
    width: 100% !important;
  }
}

@media (max-width: 480px) {
  [id^="acym_fulldiv_formAcym"] input.cell,
  [id^="acym_fulldiv_formAcym"] input[type="text"],
  [id^="acym_fulldiv_formAcym"] input[type="email"] {
    padding: var(--ucoopia-spacing-sm, 12px) var(--ucoopia-spacing-md, 16px) !important;
    font-size: 14px !important;
  }

  [id^="acym_fulldiv_formAcym"] .acym__subscription__form__button button {
    font-size: 18px !important;
    padding: var(--ucoopia-spacing-sm, 12px) var(--ucoopia-spacing-lg, 24px) !important;
  }
}