/*
Theme Name: SPT25
Theme URI: https://wordpress.org/themes/twentytwentyfive/
Template: twentytwentyfive
Author: Your Name
Author URI: https://example.com
Description: Child theme of Twenty Twenty-Five. Customize your site without modifying the parent theme.
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 7.2
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive-child
*/

/* 
 * Add your custom styles below this line.
 * The parent theme styles are automatically loaded via functions.php
 */

/* Carousel Navigation Styles */
.carousel-navigation-wrapper {
	position: relative;
}

.carousel-nav-button {
	position: absolute;
	top: 50%;
	transform: translateY( -50% );
	z-index: 10;
	background: rgba( 255, 255, 255, 0.9 );
	border: 1px solid rgba( 0, 0, 0, 0.1 );
	border-radius: 50%;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
	color: #000;
	padding: 0;
	box-shadow: 0 2px 8px rgba( 0, 0, 0, 0.1 );
}

.carousel-nav-button:hover {
	background: rgba( 255, 255, 255, 1 );
	box-shadow: 0 4px 12px rgba( 0, 0, 0, 0.15 );
	transform: translateY( -50% ) scale( 1.1 );
}

.carousel-nav-button:active {
	transform: translateY( -50% ) scale( 0.95 );
}

.carousel-nav-button:focus {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.carousel-nav-button svg {
	width: 24px;
	height: 24px;
	display: block;
}

.carousel-nav-prev {
	left: 20px;
}

.carousel-nav-next {
	right: 20px;
}

/* Responsive adjustments */
@media ( max-width: 782px ) {
	.carousel-nav-button {
		width: 40px;
		height: 40px;
	}

	.carousel-nav-button svg {
		width: 20px;
		height: 20px;
	}

	.carousel-nav-prev {
		left: 10px;
	}

	.carousel-nav-next {
		right: 10px;
	}
}

@media ( max-width: 600px ) {
	.carousel-nav-button {
		width: 36px;
		height: 36px;
	}

	.carousel-nav-button svg {
		width: 18px;
		height: 18px;
	}

	.carousel-nav-prev {
		left: 5px;
	}

	.carousel-nav-next {
		right: 5px;
	}
}