/*
Template Name: Athletics
File: Layout CSS
Author: TemplatesOnWeb
Author URI: https://www.templateonweb.com/
Licence: <a href="https://www.templateonweb.com/license">Website Template Licence</a>
*/


/*********************blog****************/
.tags a {
    display: block;
    padding: 9px 18px;
    margin: 0px 5px 8px 0px;
    transition: 0.3s;
    background: var(--bg_primary_light);
    color: var(--primary);
    border-radius:8px;
}
.tags a:hover {
    background: var(--secondry);
    color: var(--bs-white);
	transition: 0.3s;
}
/*********************blog_end****************/

/*********************sport****************/
.sport_dt_2_right_inner_left img{
	border:3px solid var(--bs-white);
}
.nav-tabs .nav-link {
   color:var(--primary);
    transition: 0.3s;
	padding:10px 30px;
}
.nav-tabs .nav-link:hover {
    transition: 0.3s;
	 color:var(--secondry);
}
.nav-tabs .nav-link:focus {
   box-shadow:none;
}
.nav-tabs .nav-link.active {
   color:var(--secondry);
}
.sport_dt_2_left .tab-content {
    border: 1px solid var(--border_light_primary);
    border-top: none;
}
/*********************sport_end****************/


@media screen and (max-width : 767px){
.sport_dt_1_right{
	padding-left:0!important;
	margin-top:20px;
}
.nav-tabs .nav-link {
    font-size:14px;
    padding: 10px 10px;
}
.sport_dt_2_left_inner h1{
	font-size:22px;
}
.sport_dt_2_left{
	padding-right:0!important;
	margin-bottom:20px;
}
.blog_dt2_right{
	text-align:left!important;
	margin-top:15px;
}
.center_sm .w-50{
	width:100%!important;
}
.blog_dt_1_right{
	padding-left:0!important;
	margin-top:20px;
}
 }


@media (min-width:576px) and (max-width:767px) {

.nav-tabs .nav-link {
    font-size:16px;
    padding: 10px 20px;
}
 }
 
@media (min-width:768px) and (max-width:991px) {
.nav-tabs .nav-link {
	padding:10px 10px;
	font-size:16px;
}
.sport_dt_2_right_inner  {
	padding-left:10px!important;
	padding-right:10px!important;
}
.sport_dt_2_right_inner1 {
	padding-left:10px!important;
	padding-right:10px!important;
}
.blog_dt2_left h5{
	font-size:16px;
}
.blog_1_left1  .fs-3{
	font-size:20px!important;
}
.center_sm .w-50{
	width:80%!important;
}
.blog_dt_1_right {
	padding-left:0!important;
}
.blog_1_right1  ul img{
	width:60px;
}
 }

@media (min-width:992px) and (max-width:1200px) {
.sport_dt_2_right_inner  {
	padding-left:10px!important;
	padding-right:10px!important;
}
.sport_dt_2_right_inner1 {
	padding-left:10px!important;
	padding-right:10px!important;
}
 }

@media (min-width:1201px) and (max-width:1350px) {

 }
@media screen and (min-width : 1400px){

 }


 /* --- SLIDER CONTAINER --- */
.slider-wrapper {
    width: 100%;
    overflow: hidden; /* Hides vertical overflow */
}

.slider-track {
    display: flex;
    gap: 20px; /* Space between slides */
    overflow-x: auto; /* Enables horizontal scroll/swipe */
    scroll-snap-type: x mandatory; /* Makes it snap to each slide */
    scroll-behavior: smooth; /* Smooth scrolling when buttons clicked */
    padding-bottom: 20px; /* Space for scrollbar (hidden below) */
    
    /* Hide Scrollbar */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE */
}
.slider-track::-webkit-scrollbar { 
    display: none; /* Chrome/Safari */
}

/* --- THE SLIDE ITEM (PEEK EFFECT) --- */
.slider-item {
    /* DESKTOP: 85% width lets the next slide peek in by 15% */
    flex: 0 0 85%; 
    scroll-snap-align: start; /* Snaps to the left edge */
}

/* --- CARD DESIGN UPDATES --- */
.card-custom {
    min-height: 450px; 
    box-shadow: 0 15px 30px rgba(0,0,0,0.2);
    width: 100%;
}

.object-fit-cover {
    object-fit: cover;
    height: 100%;
    min-height: 450px; 
}

/* --- MOBILE RESPONSIVENESS --- */
@media (max-width: 991px) {
    .slider-item {
        /* MOBILE: 90% width for a smaller peek */
        flex: 0 0 90%; 
    }
    
    .card-custom {
        min-height: auto; /* Auto height on mobile */
    }

    .object-fit-cover {
        min-height: 250px; /* Smaller image on mobile */
        border-radius: 40px 40px 0 0;
    }
    
    /* Fix corner rounding on mobile stack */
    .col-lg-6:first-child .card-custom {
         border-radius: 0 0 40px 40px;
    }
}