/* ==========================================================================
   Button Component - CRM Nice
   ========================================================================== */

.button {
  display: inline-block;
  padding: var(--spacing-sm) var(--spacing-md);
  border: none;
  border-radius: var(--radius-base);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  font-family: var(--font-family-base);
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: all var(--transition-fast);
  line-height: var(--line-height-base);
  white-space: nowrap;
  flex-shrink: 0;

  /* iOS/Android Touch Targets - мінімум 44x44px для iOS, 48x48px для Android */
  min-width: 44px;
  min-height: 44px;

  /* Запобігання подвійному тапу на iOS */
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.button:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* Primary Button */
.button--primary {
  background-color: var(--color-primary);
  color: var(--color-bg);
}

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

/* Secondary Button */
.button--secondary {
  background-color: var(--color-secondary);
  color: var(--color-bg);
}

.button--secondary:hover {
  background-color: var(--color-secondary-dark);
}

/* Danger Button */
.button--danger {
  background-color: var(--color-error);
  color: var(--color-bg);
}

.button--danger:hover {
  background-color: var(--color-error-dark);
}

/* Success Button */
.button--success {
  background-color: var(--color-success);
  color: var(--color-bg);
}

.button--success:hover {
  background-color: var(--color-success-dark);
}

/* Size Variants */
.button--sm {
  padding: var(--spacing-xs) var(--spacing-sm);
  font-size: var(--font-size-sm);
}

.button--lg {
  padding: var(--spacing-md) var(--spacing-lg);
  font-size: var(--font-size-lg);
}

/* Disabled State */
.button:disabled,
.button--disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* Full Width */
.button--block {
  display: block;
  width: 100%;
}

/* Android Material Design 3 - мінімальні розміри 48x48dp */
@media (max-width: 767px) {
  .button {
    min-width: 48px;
    min-height: 48px;
  }
}

/* Icon buttons також мають мінімальні розміри */
.icon-btn {
  min-width: 44px;
  min-height: 44px;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

@media (max-width: 767px) {
  .icon-btn {
    min-width: 48px;
    min-height: 48px;
  }
}

/* Dropdown triggers */
.dropdown__trigger {
  min-width: 44px;
  min-height: 44px;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

@media (max-width: 767px) {
  .dropdown__trigger {
    min-width: 48px;
    min-height: 48px;
  }
}

/* Favorite Button */
.favorite-btn {
  background: none;
  border: none;
  font-size: 1.25rem;
  cursor: pointer;
  padding: 4px 8px;
  min-width: auto;
  min-height: auto;
  color: var(--color-text-light);
  transition: all var(--transition-fast);
}

.favorite-btn:hover {
  color: var(--color-warning);
  transform: scale(1.2);
}

.favorite-btn--active {
  color: var(--color-warning);
}

.favorite-btn--active:hover {
  transform: scale(1.1);
}