/* ============================================================================ *
  MINIMAL BUTTON OVERRIDES - BULMA NATIVE ONLY
  
  Only essential overrides to Bulma's button system
\* ============================================================================ */

/* ============================= */
/* MINOR ENHANCEMENTS TO BULMA DEFAULTS */
/* ============================= */

.button {
  font-weight: 500 !important;
  transition: all 0.2s ease !important;
}

.button:hover,
.button:focus {
  transform: translateY(-1px) !important;
}

/* Fix for basic outlined buttons without color modifiers */
.button.is-outlined {
  color: var(--bulma-text) !important;
  border-color: var(--bulma-border) !important;
}

.button.is-outlined:hover,
.button.is-outlined:focus {
  background-color: var(--bulma-scheme-main-bis) !important;
  color: var(--bulma-text-strong) !important;
  border-color: var(--bulma-text) !important;
}

/* ============================= */
/* BUTTON GROUPS */
/* ============================= */

/* Button groups are handled by components.css with gap-based spacing */

/* ============================= */
/* BUTTON SIZE IMPROVEMENTS */
/* ============================= */

/* Increase horizontal padding for better visual balance */
.button.is-medium {
  padding-left: 1.75rem !important;
  padding-right: 1.75rem !important;
}

/* Ensure normal size buttons have good padding too */
.button:not(.is-small):not(.is-large) {
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Consistent padding for small buttons */
.button.is-small {
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
}

/* ============================= */
/* ACCESSIBILITY */
/* ============================= */

.button:focus-visible {
  outline: 2px solid var(--bulma-primary) !important;
  outline-offset: 2px !important;
}

/* ============================= */
/* MOBILE OPTIMIZATIONS */
/* ============================= */

@media screen and (max-width: 768px) {
  /* Adjust button padding on mobile for better touch targets */
  .button.is-medium {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
  
  .button:not(.is-small):not(.is-large) {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
  }
  
  /* Consistent padding for small buttons on mobile */
  .button.is-small {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}