/*
 * GYSMAP Buttons Foundation
 *
 * Defines core button primitives (.btn) and its semantic variations.
 */

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: var(--spacing-2) var(--spacing-4);
	font-family: inherit;
	font-weight: 500;
	font-size: 0.875rem; /* 14px */
	line-height: inherit;
	text-align: center;
	white-space: nowrap;
	border: 1px solid transparent;
	border-radius: var(--border-radius-md);
	cursor: pointer;
	user-select: none;
	transition: all var(--transition-fast);
}

.btn:focus,
.btn:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px var(--bg-primary), 0 0 0 4px var(--brand-primary);
}

.btn:disabled,
.btn[aria-disabled="true"] {
	opacity: 0.6;
	cursor: not-allowed;
	pointer-events: none;
}

/* Primary Button */
.btn-primary {
	background-color: var(--brand-primary);
	color: #ffffff;
}

.btn-primary:hover {
	background-color: var(--brand-primary-hover);
	color: #ffffff;
}

/* Secondary Button (Default styling) */
.btn-secondary {
	background-color: var(--bg-secondary);
	color: var(--text-primary);
	border-color: var(--border-color);
}

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

/* Ghost Button (Transparent background) */
.btn-ghost {
	background-color: transparent;
	color: var(--text-secondary);
}

.btn-ghost:hover {
	background-color: var(--bg-secondary);
	color: var(--text-primary);
}

/* Danger Button */
.btn-danger {
	background-color: var(--color-error);
	color: #ffffff;
}

.btn-danger:hover {
	background-color: #dc2626; /* Darker red */
	color: #ffffff;
}

/* Sizing Modifiers */
.btn-sm {
	padding: calc(var(--spacing-1) * 1.5) var(--spacing-2);
	font-size: 0.75rem; /* 12px */
	border-radius: var(--border-radius-sm);
}

.btn-lg {
	padding: var(--spacing-3) var(--spacing-6);
	font-size: 1rem; /* 16px */
}

/* Utility layout modifier */
.btn-block {
	display: flex;
	width: 100%;
}