/* ===================================================
   BUTTON STYLING - CENTRALIZED BUTTON COMPONENT STYLES
   ===================================================
   This file provides consistent styling for all buttons in the application
*/

/* Import centralized systems */
@import url("spacing.fcb7e2c7ab0a.css");
@import url("typography.9e7f37dc291d.css");
@import url("borders.d5d3bb34e628.css");
@import url("animation_transition.7613137d12c6.css");
@import url("shadows.2216235621bb.css");

/* Base Button Styles - shared by all buttons */
.btn {
  display: inline-flex;
  align-items: center;
  font-size: var(--text-sm);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  transition: var(--transition-all-standard);
  cursor: pointer;
}

/* Icon spacing within buttons */
.btn i {
  margin-right: var(--space-1);
}

/* Outline Secondary Button Styles */
.btn-outline-secondary {
  color: var(--color-text-secondary);
  border-color: var(--color-text-secondary);
  background-color: transparent;
}

.btn-outline-secondary:hover {
  color: var(--color-text-white);
  background-color: var(--color-text-secondary);
  border-color: var(--color-text-secondary);
}

.btn-outline-secondary:focus,
.btn-outline-secondary:active {
  box-shadow: var(--shadow-focus);
}

/* Small Button Size - extends base button */
.btn-sm {
  padding: var(--padding-button-sm);
  font-size: var(--text-sm);
}

/* Test API button - moved from developer_sections.css */
.test-api-button {
  background-color: var(--color-primary);
  color: var(--color-white);
  border: none;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-size: var(--text-sm);
  transition: var(--transition-all-standard);
}

.test-api-button:hover {
  background-color: var(--color-primary-dark);
}

/* Collapse All Button - inherits from btn and btn-outline-secondary */
.collapse-all-button {
  /* No additional styles needed - uses btn-outline-secondary and btn-sm */
}