/**
 * @file
 * Form styles for SaaS Coupon module.
 */

/* Force override for back link in limit message pages - highest specificity */
.location-limit-message a.button.button--secondary,
.coupon-limit-message a.button.button--secondary,
div.location-limit-message > a.button.button--secondary,
div.coupon-limit-message > a.button.button--secondary {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #007CC7 !important;
  border: 2px solid #007CC7 !important;
  border-color: #007CC7 !important;
  box-shadow: 0 2px 4px rgba(0, 124, 199, 0.1) !important;
}

.location-limit-message a.button.button--secondary:hover,
.coupon-limit-message a.button.button--secondary:hover,
div.location-limit-message > a.button.button--secondary:hover,
div.coupon-limit-message > a.button.button--secondary:hover {
  background: linear-gradient(135deg, #007CC7 0%, #205781 100%) !important;
  background-color: transparent !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 4px 12px rgba(0, 124, 199, 0.3) !important;
  transform: translateY(-2px) !important;
}

/* Ensure form action buttons are properly aligned */
.form-actions {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center !important;
  gap: 0.75rem;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* Override theme green colors with blue scheme for all form buttons */
.form-actions .button,
.form-actions .button--primary,
.form-actions button,
.form-actions input[type="submit"],
.form-actions input[type="button"],
.form-actions input[type="button"],
.form-actions a.button {
  margin: 0 !important;
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: normal;
  text-align: center;
  background: linear-gradient(135deg, #007CC7 0%, #205781 100%) !important;
  color: #ffffff !important;
  border: 2px solid transparent !important;
  box-shadow: 0 2px 4px rgba(0, 124, 199, 0.2) !important;
  padding: 0.75rem 1.5rem !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
}

/* Ensure link buttons (like cancel) have centered text */
.form-actions a.button {
  text-align: center !important;
  justify-content: center !important;
  display: inline-flex !important;
}

.form-actions .button:hover,
.form-actions .button--primary:hover,
.form-actions button:hover,
.form-actions input[type="submit"]:hover,
.form-actions input[type="button"]:hover,
.form-actions a.button:hover {
  background: linear-gradient(135deg, #12232E 0%, #007CC7 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0, 124, 199, 0.3) !important;
  transform: translateY(-2px) !important;
}

/* Secondary/Cancel buttons (outlined style) */
.form-actions .button--secondary,
.form-actions .button:not(.button--primary):not(.button--danger),
.form-actions a.button:not(.button--primary):not(.button--danger) {
  background: #ffffff !important;
  color: #007CC7 !important;
  border: 2px solid #007CC7 !important;
  box-shadow: 0 2px 4px rgba(0, 124, 199, 0.1) !important;
  justify-content: center !important;
  text-align: center !important;
}

.form-actions .button--secondary:hover,
.form-actions .button:not(.button--primary):not(.button--danger):hover {
  background: linear-gradient(135deg, #007CC7 0%, #205781 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0, 124, 199, 0.3) !important;
}

/* Ensure Delete button (link) aligns properly and uses red */
.form-actions a.button--danger {
  margin: 0 !important;
  vertical-align: middle;
  background: #ef4444 !important;
  color: #ffffff !important;
  border: 2px solid #ef4444 !important;
}

.form-actions a.button--danger:hover {
  background: #dc2626 !important;
  border-color: #dc2626 !important;
}

/* Override table row hover colors */
table tbody tr:hover,
.field-multiple-table tbody tr:hover,
.tabledrag-changed tr:hover {
  background-color: #EEFBFB !important;
}

/* Override field border colors */
.form-item input[type="text"],
.form-item input[type="email"],
.form-item input[type="number"],
.form-item input[type="date"],
.form-item input[type="datetime-local"],
.form-item textarea,
.form-item select {
  border-color: #203647 !important;
}

.form-item input[type="text"]:focus,
.form-item input[type="email"]:focus,
.form-item input[type="number"]:focus,
.form-item input[type="date"]:focus,
.form-item input[type="datetime-local"]:focus,
.form-item input[type="password"]:focus,
.form-item textarea:focus,
.form-item select:focus {
  border-color: #007CC7 !important;
  box-shadow: 0 0 0 2px rgba(0, 124, 199, 0.2) !important;
  outline: none !important;
}

/* Override "Add another item" button - all variations */
.field-add-more-submit,
.button--small.field-add-more-submit,
input.field-add-more-submit,
button.field-add-more-submit,
[class*="field-add-more"],
input[value*="Add another"],
button[value*="Add another"] {
  background: linear-gradient(135deg, #007CC7 0%, #205781 100%) !important;
  color: #ffffff !important;
  border: 2px solid transparent !important;
  box-shadow: 0 2px 4px rgba(0, 124, 199, 0.2) !important;
}

.field-add-more-submit:hover,
.button--small.field-add-more-submit:hover,
input.field-add-more-submit:hover,
button.field-add-more-submit:hover,
[class*="field-add-more"]:hover,
input[value*="Add another"]:hover,
button[value*="Add another"]:hover {
  background: linear-gradient(135deg, #12232E 0%, #007CC7 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0, 124, 199, 0.3) !important;
  transform: translateY(-2px) !important;
}

/* Override "Remove" button - all variations with maximum specificity */
.remove-button,
.button--small.remove-button,
input.remove-button,
input[type="submit"].remove-button,
button.remove-button,
a.remove-button,
.remove,
.button.remove,
input[value*="Remove"],
input[value*="remove"],
button[value*="Remove"],
button[value*="remove"],
.js-form-item .remove-button,
.field-multiple-table .remove-button,
.tabledrag-handle + .remove-button,
[class*="remove"] {
  background: #ef4444 !important;
  color: #ffffff !important;
  border: 2px solid #ef4444 !important;
  box-shadow: 0 2px 4px rgba(239, 68, 68, 0.2) !important;
}

.remove-button:hover,
.button--small.remove-button:hover,
input.remove-button:hover,
input[type="submit"].remove-button:hover,
button.remove-button:hover,
a.remove-button:hover,
.remove:hover,
.button.remove:hover,
input[value*="Remove"]:hover,
input[value*="remove"]:hover,
button[value*="Remove"]:hover,
button[value*="remove"]:hover,
.js-form-item .remove-button:hover,
.field-multiple-table .remove-button:hover,
.tabledrag-handle + .remove-button:hover,
[class*="remove"]:hover {
  background: #dc2626 !important;
  border-color: #dc2626 !important;
  box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3) !important;
  transform: translateY(-2px) !important;
  color: #ffffff !important;
}

/* Override table header colors */
table thead th,
table th,
.field-multiple-table thead th,
.field-multiple-table th,
.tabledrag-toggle-weight-wrapper th,
thead th,
th {
  background-color: #203647 !important;
  color: #ffffff !important;
  border-color: #12232E !important;
}

/* Ensure all text in table headers is white */
table thead th *,
table th *,
.field-multiple-table thead th *,
.field-multiple-table th *,
thead th *,
th * {
  color: #ffffff !important;
}

/* Override fieldset and field wrapper borders */
fieldset,
.fieldset-wrapper {
  border-color: #203647 !important;
}

fieldset legend {
  color: #12232E !important;
  border-color: #203647 !important;
}

/* Override all links to use blue instead of green - very specific selectors */
a,
a:link,
a:visited,
body a,
body a:link,
body a:visited,
.form-wrapper a,
.field-wrapper a,
.field-multiple-table a,
table a,
tbody a,
tr a,
td a,
.location-limit-message a,
.coupon-limit-message a,
.back-link a,
a.back-link {
  color: #007CC7 !important;
}

a:hover,
a:focus,
body a:hover,
body a:focus,
.form-wrapper a:hover,
.field-wrapper a:hover,
.field-multiple-table a:hover,
table a:hover,
tbody a:hover,
tr a:hover,
td a:hover {
  color: #12232E !important;
}

a:active,
body a:active {
  color: #205781 !important;
}

/* Override link buttons - including back links */
a.button,
a.button--primary,
a.button--secondary,
a.button--small,
.back-link a.button,
.back-link a.button--secondary,
.location-limit-message a.button,
.coupon-limit-message a.button,
.location-limit-message .back-link a,
.coupon-limit-message .back-link a {
  background: linear-gradient(135deg, #007CC7 0%, #205781 100%) !important;
  color: #ffffff !important;
  border: 2px solid transparent !important;
  box-shadow: 0 2px 4px rgba(0, 124, 199, 0.2) !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

a.button:hover,
a.button--primary:hover,
a.button--small:hover,
.back-link a.button:hover,
.back-link a.button--secondary:hover,
.location-limit-message a.button:hover,
.coupon-limit-message a.button:hover,
.location-limit-message .back-link a:hover,
.coupon-limit-message .back-link a:hover {
  background: linear-gradient(135deg, #12232E 0%, #007CC7 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0, 124, 199, 0.3) !important;
  transform: translateY(-2px) !important;
}

a.button--secondary,
.back-link a.button--secondary,
.location-limit-message a.button--secondary,
.coupon-limit-message a.button--secondary,
.location-limit-message .back-link a,
.coupon-limit-message .back-link a,
.location-limit-message a.button,
.coupon-limit-message a.button,
.location-limit-message a.button.button--secondary,
.coupon-limit-message a.button.button--secondary,
.location-limit-message a[class*="button"],
.coupon-limit-message a[class*="button"],
div.location-limit-message a,
div.coupon-limit-message a,
.location-limit-message > a,
.coupon-limit-message > a {
  background: #ffffff !important;
  color: #007CC7 !important;
  border: 2px solid #007CC7 !important;
  box-shadow: 0 2px 4px rgba(0, 124, 199, 0.1) !important;
}

a.button--secondary:hover,
.back-link a.button--secondary:hover,
.location-limit-message a.button--secondary:hover,
.coupon-limit-message a.button--secondary:hover,
.location-limit-message .back-link a:hover,
.coupon-limit-message .back-link a:hover,
.location-limit-message a.button:hover,
.coupon-limit-message a.button:hover,
.location-limit-message a.button.button--secondary:hover,
.coupon-limit-message a.button.button--secondary:hover,
.location-limit-message a[class*="button"]:hover,
.coupon-limit-message a[class*="button"]:hover,
div.location-limit-message a:hover,
div.coupon-limit-message a:hover,
.location-limit-message > a:hover,
.coupon-limit-message > a:hover {
  background: linear-gradient(135deg, #007CC7 0%, #205781 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 4px 12px rgba(0, 124, 199, 0.3) !important;
  transform: translateY(-2px) !important;
}

/* Override any remaining green links in forms */
.form-item a,
.field-multiple-table a,
table a,
.location-limit-message a,
.coupon-limit-message a,
.back-link a,
a.back-link,
div.location-limit-message a,
div.coupon-limit-message a,
.location-limit-message > a,
.coupon-limit-message > a {
  color: #007CC7 !important;
}

.form-item a:hover,
.field-multiple-table a:hover,
table a:hover,
.location-limit-message a:hover,
.coupon-limit-message a:hover,
.back-link a:hover,
a.back-link:hover,
div.location-limit-message a:hover,
div.coupon-limit-message a:hover,
.location-limit-message > a:hover,
.coupon-limit-message > a:hover {
  color: #12232E !important;
}

/* Specific override for back link buttons in limit message pages */
.location-limit-message .back-link,
.coupon-limit-message .back-link,
.location-limit-message a.button--secondary,
.coupon-limit-message a.button--secondary {
  background: #ffffff !important;
  color: #007CC7 !important;
  border: 2px solid #007CC7 !important;
  box-shadow: 0 2px 4px rgba(0, 124, 199, 0.1) !important;
}

.location-limit-message .back-link:hover,
.coupon-limit-message .back-link:hover,
.location-limit-message a.button--secondary:hover,
.coupon-limit-message a.button--secondary:hover {
  background: linear-gradient(135deg, #007CC7 0%, #205781 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 4px 12px rgba(0, 124, 199, 0.3) !important;
  transform: translateY(-2px) !important;
}

/* Mobile responsive fixes for forms */
@media (max-width: 768px) {
  .form-actions {
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .form-actions .button,
  .form-actions .button--primary,
  .form-actions button,
  .form-actions input[type="submit"],
  .form-actions input[type="button"],
  .form-actions a.button {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0.25rem 0 !important;
  }

  /* Ensure form containers don't overflow */
  .form-wrapper,
  .field-wrapper,
  fieldset {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Ensure input fields don't overflow */
  .form-item input[type="text"],
  .form-item input[type="email"],
  .form-item input[type="number"],
  .form-item input[type="date"],
  .form-item input[type="datetime-local"],
  .form-item textarea,
  .form-item select {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}