/**
 * BESREMi Button Block - Frontend Styles
 */

.wp-block-besremi-button {
	display: inline-block;
	font-family: var(--font-family);
}

.wp-block-besremi-button a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 17px;
	padding: 12px;
	font-size: 16px;
	font-weight: 600;
	line-height: 24px;
	border-radius: 8px;
	text-decoration: none;
	transition: all 0.3s ease;
	border: 1px solid transparent;
}

.wp-block-besremi-button__text {
	padding: 0 2px;
}

.wp-block-besremi-button__arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 25px;
	height: 25px;
	flex-shrink: 0;
}

.wp-block-besremi-button__arrow svg {
	width: 100%;
	height: 100%;
}

/* Width Types */
.wp-block-besremi-button.width-full {
	width: 100%;
	display: block;
}

.wp-block-besremi-button.width-auto {
	width: auto;
	display: inline-block;
}

.wp-block-besremi-button.width-custom {
	display: inline-block;
}

/* Preset: Primary Red */
.wp-block-besremi-button.preset-primary-red a {
	background-color: #e2422a;
	border-color: #e2422a;
	color: #ffffff;
	height: 40px;
}

.wp-block-besremi-button.preset-primary-red a:hover {
	background-color: #d12e16;
	border-color: #d12e16;
}

/* Preset: Light Cyan */
.wp-block-besremi-button.preset-light-cyan a {
	background-color: rgba(202, 250, 255, 0.4);
	border-color: #005f69;
	color: #005f69;
	height: 49px;
}

.wp-block-besremi-button.preset-light-cyan a:hover {
	background-color: rgba(202, 250, 255, 0.6);
}

/* Preset: Green */
.wp-block-besremi-button.preset-green a {
	background-color: rgba(69, 135, 75, 0.96);
	border-color: rgba(54, 102, 59, 0.96);
	color: #ffffff;
	height: 40px;
}

.wp-block-besremi-button.preset-green a:hover {
	background-color: rgba(54, 102, 59, 0.96);
}

/* Preset: Outlined */
.wp-block-besremi-button.preset-outlined a {
	background-color: transparent;
	border-color: #e2422a;
	color: #e2422a;
	padding: 8px 2px;
	gap: 6px;
}

.wp-block-besremi-button.preset-outlined a:hover {
	background-color: #e2422a;
	color: #ffffff;
}

/* Preset: Custom - uses inline styles */
.wp-block-besremi-button.preset-custom a {
	height: 40px;
}

/* Alignment */
.wp-block-besremi-button.aligncenter {
	text-align: center;
	display: block;
}

.wp-block-besremi-button.alignleft {
	text-align: left;
	display: block;
}

.wp-block-besremi-button.alignright {
	text-align: right;
	display: block;
}

/* Utility Classes */
.wp-block-besremi-button.p-0 a {
	padding: 0;
}

/* Responsive */
@media (max-width: 576px) {
	.wp-block-besremi-button a {
		font-size: 14px;
		padding: 10px;
		gap: 12px;
	}

	.wp-block-besremi-button__arrow {
		width: 20px;
		height: 20px;
	}

	.wp-block-besremi-button.preset-light-cyan a {
		height: 44px;
	}

	.wp-block-besremi-button.preset-primary-red a,
	.wp-block-besremi-button.preset-green a,
	.wp-block-besremi-button.preset-custom a {
		height: 36px;
	}
}