/**
 * Unified SPEICHERN submit button styling for all Horsequip forms
 * This file contains the definitive button styling to match the profile edit page
 */

/* Align submit and cancel on the same line - LEFT aligned */
form .form-actions,
form .actions,
.form-actions,
.actions {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  text-align: left !important;
}

/* Ensure button wrapper doesn't take full width */
.button-wrapper {
  display: inline-flex !important;
  width: auto !important;
  max-width: max-content !important;
  flex-shrink: 0 !important;
}

/* Ensure cancel link doesn't take full width */
form .actions a,
form .form-actions a,
.actions a,
.form-actions a {
  width: auto !important;
  flex-shrink: 0 !important;
}

/* Mobile responsive - keep on same line and LEFT aligned */
@media (max-width: 768px) {
  form .form-actions,
  form .actions,
  .form-actions,
  .actions {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
  }
  .cancel-link {
    padding-top: 10px !important;
  }
}

/* Base button styling - highest specificity to override all other styles */
form input.horsequip-submit-btn[type="submit"],
form button.horsequip-submit-btn,
form input.btn-save[type="submit"],
form button.btn-save,
form .form-submit.horsequip-submit-btn,
form .form-submit.btn-save,
input[value="SPEICHERN"].horsequip-submit-btn,
input[value="SPEICHERN"].btn-save {
  background: none !important;
  background-color: transparent !important;
  border: none !important;
  color: #333 !important;
  font-size: 0.9rem !important;
  font-weight: 300 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  cursor: pointer !important;
  padding: 0 !important;
  padding-left: 10px !important;
  font-family: 'Roboto', sans-serif !important;
  transition: color 0.3s ease !important;
  position: relative !important;
  box-shadow: none !important;
  min-width: auto !important;
}

/* Hover state */
form input.horsequip-submit-btn[type="submit"]:hover,
form button.horsequip-submit-btn:hover,
form input.btn-save[type="submit"]:hover,
form button.btn-save:hover,
form .form-submit.horsequip-submit-btn:hover,
form .form-submit.btn-save:hover,
input[value="SPEICHERN"].horsequip-submit-btn:hover,
input[value="SPEICHERN"].btn-save:hover {
  color: #8B4513 !important;
  background: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/* FontAwesome circle arrow icon using CSS before pseudo-element */
form input.horsequip-submit-btn[type="submit"]:before,
form button.horsequip-submit-btn:before,
form input.btn-save[type="submit"]:before,
form button.btn-save:before,
form .form-submit.horsequip-submit-btn:before,
form .form-submit.btn-save:before,
input[value="SPEICHERN"].horsequip-submit-btn:before,
input[value="SPEICHERN"].btn-save:before {
  font-family: "Font Awesome 5 Free", "Font Awesome 6 Free", "FontAwesome" !important;
  font-weight: 900 !important;
  content: "\f138" !important; /* fa-circle-arrow-right */
  -webkit-text-stroke: 0 !important;
  font-size: 24px !important;
  color: #ff940b !important; /* Orange color */
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  line-height: 1 !important;
}
