/* Touch Target Fix for Mobile Devices */
/* Ensures all interactive elements meet WCAG 2.1 AA requirements for touch targets */

:root {
  --touch-48: 48px;
  --touch-spacing: 8px;
}

/* Primary touch target fixes */
.btn,
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.button,
.nav-link,
.dropdown-toggle,
.form-control,
select,
textarea,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="date"],
input[type="time"] {
  min-height: var(--touch-48) !important;
  min-width: var(--touch-48) !important;
  padding: 12px 16px !important;
  margin: var(--touch-spacing) 0 !important;
  display: block !important;
  visibility: visible !important;
  position: relative !important;
}

/* Touch targets need adequate spacing */
.btn + .btn,
button + button,
.form-group + .form-group {
  margin-top: var(--touch-spacing) !important;
}

/* Form controls specific fixes */
.form-control {
  border-radius: 8px;
  font-size: 16px; /* Prevents zoom on iOS */
  line-height: 1.5;
}

/* Navigation and link fixes */
.nav-link,
.dropdown-item,
a.btn {
  text-decoration: none;
  display: inline-block !important;
  padding: 12px 16px !important;
}

/* Calculator page specific fixes */
.calculator-page .btn {
  width: 100%;
  margin-bottom: var(--touch-spacing);
}

.calculator-page .form-control {
  width: 100%;
  box-sizing: border-box;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .btn,
  button,
  input,
  select,
  textarea {
    font-size: 16px !important; /* Prevents zoom on iOS */
    min-height: var(--touch-48) !important;
  }

  .container {
    padding: 10px !important;
  }

  .row {
    margin: 0 !important;
  }

  .col-md-6,
  .col-lg-6 {
    padding: 5px !important;
  }
}