/*
|--------------------------------------------------------------------------
| GRID LAYOUT
|--------------------------------------------------------------------------
*/

.amna-core-grid {
    display: grid;
    gap: 30px;
}

.amna-core-grid.columns-1 {
    grid-template-columns: repeat(1, 1fr);
}

.amna-core-grid.columns-2 {
    grid-template-columns: repeat(2, 1fr);
}

.amna-core-grid.columns-3 {
    grid-template-columns: repeat(3, 1fr);
}

.amna-core-grid.columns-4 {
    grid-template-columns: repeat(4, 1fr);
}

/*
|--------------------------------------------------------------------------
| RESPONSIVE
|--------------------------------------------------------------------------
*/

@media(max-width:1024px){

    .amna-core-grid.columns-3,
    .amna-core-grid.columns-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media(max-width:767px){

    .amna-core-grid.columns-2,
    .amna-core-grid.columns-3,
    .amna-core-grid.columns-4 {
        grid-template-columns: repeat(1, 1fr);
    }
}

/*
|--------------------------------------------------------------------------
| SWIPER VARIABLES
|--------------------------------------------------------------------------
*/

.amna-core-swiper{

    --amna-arrow-size: 40px;
    --amna-arrow-radius: 0px;
    --amna-arrow-horizontal: 0px;
    --amna-arrow-vertical: 0px;
}

/*
|--------------------------------------------------------------------------
| SWIPER FIX
|--------------------------------------------------------------------------
*/
.amna-core-swiper {
    width: 100%;
    overflow: hidden;
	position: static;
}

.amna-core-swiper .swiper-wrapper {
    display: flex;
}

.amna-core-swiper .swiper-slide {
    flex-shrink: 0;
    height: auto;
    box-sizing: border-box;
}


/*
|--------------------------------------------------------------------------
| CARD
|--------------------------------------------------------------------------
*/

.amna-core-card {
    height: 100%;
}

/*
|--------------------------------------------------------------------------
| NAVIGATION
|--------------------------------------------------------------------------
*/

.amna-core-swiper .swiper-button-prev,
.amna-core-swiper .swiper-button-next {
    width: 40px;
    height: 40px;
}

.amna-core-swiper .swiper-button-prev:after,
.amna-core-swiper .swiper-button-next:after {
    font-size: calc(var(--amna-arrow-size) / 2.2);
}

/*
|--------------------------------------------------------------------------
| ARROWS BASE
|--------------------------------------------------------------------------
*/

.amna-core-swiper .swiper-button-prev,
.amna-core-swiper .swiper-button-next {

    width: var(--amna-arrow-size);
    height: var(--amna-arrow-size);
    border-radius: var(--amna-arrow-radius);
    margin-top: var(--amna-arrow-vertical);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease;
}

/*
|--------------------------------------------------------------------------
| OUTSIDE POSITION
|--------------------------------------------------------------------------
*/

.amna-core-swiper.arrow-position-outside{

    width: calc(100% - 60px);
    margin-left: auto;
    margin-right: auto;
}

.amna-core-swiper.arrow-position-outside .swiper-button-prev{
    left: calc(-5px - var(--amna-arrow-horizontal));
}

.amna-core-swiper.arrow-position-outside .swiper-button-next{
    right: calc(-5px - var(--amna-arrow-horizontal));
}

@media(max-width:767px){

    .amna-core-swiper.arrow-position-outside{

        width: calc(100% - 80px);
    }

    .amna-core-swiper.arrow-position-outside .swiper-button-prev{
        left: -40px;
    }

    .amna-core-swiper.arrow-position-outside .swiper-button-next{
        right: -40px;
    }
}

/*
|--------------------------------------------------------------------------
| INSIDE POSITION
|--------------------------------------------------------------------------
*/

.amna-core-swiper.arrow-inside{

    width: 100%;
}

.amna-core-swiper.arrow-inside .swiper-button-prev{
    left: 10px;
}

.amna-core-swiper.arrow-inside .swiper-button-next{
    right: 10px;
}

/*
|--------------------------------------------------------------------------
| OUTSIDE POSITION
|--------------------------------------------------------------------------
*/

.amna-core-swiper.arrow-outside{

    width: calc(100% - 60px);

    margin-left: auto;
    margin-right: auto;
}

/*
|--------------------------------------------------------------------------
| TOP LEFT
|--------------------------------------------------------------------------
*/

.amna-core-swiper.arrow-position-top-left .swiper-button-prev,
.amna-core-swiper.arrow-position-top-left .swiper-button-next {

    top: 0;
    bottom: auto;
}

.amna-core-swiper.arrow-position-top-left .swiper-button-prev {
    left: 0;
}

.amna-core-swiper.arrow-position-top-left .swiper-button-next {
    left: 50px;
}

/*
|--------------------------------------------------------------------------
| TOP CENTER
|--------------------------------------------------------------------------
*/

.amna-core-swiper.arrow-position-top-center .swiper-button-prev,
.amna-core-swiper.arrow-position-top-center .swiper-button-next {

    top: 0;
    bottom: auto;
}

.amna-core-swiper.arrow-position-top-center .swiper-button-prev {
    left: calc(50% - 45px);
}

.amna-core-swiper.arrow-position-top-center .swiper-button-next {
    left: calc(50% + 5px);
}

/*
|--------------------------------------------------------------------------
| TOP RIGHT
|--------------------------------------------------------------------------
*/

.amna-core-swiper.arrow-position-top-right .swiper-button-prev,
.amna-core-swiper.arrow-position-top-right .swiper-button-next {

    top: 0;
    bottom: auto;
}

.amna-core-swiper.arrow-position-top-right .swiper-button-prev {
    right: 50px;
    left: auto;
}

.amna-core-swiper.arrow-position-top-right .swiper-button-next {
    right: 0;
}

/*
|--------------------------------------------------------------------------
| BOTTOM LEFT
|--------------------------------------------------------------------------
*/

.amna-core-swiper.arrow-position-bottom-left .swiper-button-prev,
.amna-core-swiper.arrow-position-bottom-left .swiper-button-next {

    top: auto;
    bottom: 0;
}

.amna-core-swiper.arrow-position-bottom-left .swiper-button-prev {
    left: 0;
}

.amna-core-swiper.arrow-position-bottom-left .swiper-button-next {
    left: 50px;
}

/*
|--------------------------------------------------------------------------
| BOTTOM CENTER
|--------------------------------------------------------------------------
*/

.amna-core-swiper.arrow-position-bottom-center .swiper-button-prev,
.amna-core-swiper.arrow-position-bottom-center .swiper-button-next {

    top: auto;
    bottom: 0;
}

.amna-core-swiper.arrow-position-bottom-center .swiper-button-prev {
    left: calc(50% - 45px);
}

.amna-core-swiper.arrow-position-bottom-center .swiper-button-next {
    left: calc(50% + 5px);
}

/*
|--------------------------------------------------------------------------
| BOTTOM RIGHT
|--------------------------------------------------------------------------
*/

.amna-core-swiper.arrow-position-bottom-right .swiper-button-prev,
.amna-core-swiper.arrow-position-bottom-right .swiper-button-next {

    top: auto;
    bottom: 0;
}

.amna-core-swiper.arrow-position-bottom-right .swiper-button-prev {
    right: 50px;
    left: auto;
}

.amna-core-swiper.arrow-position-bottom-right .swiper-button-next {
    right: 0;
}
/*
|--------------------------------------------------------------------------
| BUTTON ICON
|--------------------------------------------------------------------------
*/

.amna-core-button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.amna-core-button i,
.amna-core-button svg {
    width: 16px;
    height: 16px;
    font-size: 16px;
    flex-shrink: 0;
}

/*
|--------------------------------------------------------------------------
| TRANSITIONS
|--------------------------------------------------------------------------
*/

.amna-core-title,
.amna-core-excerpt,
.amna-core-date,
.amna-core-custom-text,
.amna-core-meta-item,
.amna-core-button,
.amna-core-image img,
.amna-core-card {
    transition: all .3s ease;
}
/*
|--------------------------------------------------------------------------
| BUTTON FLEX
|--------------------------------------------------------------------------
*/

.amna-core-button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
/*
|--------------------------------------------------------------------------
| ARROWS
|--------------------------------------------------------------------------
*/

.swiper-button-prev,
.swiper-button-next {

    display: flex;
    align-items: center;
    justify-content: center;

    transition: all .3s ease;
}
/*
|--------------------------------------------------------------------------
| PAGINATION
|--------------------------------------------------------------------------
*/

.amna-core-pagination{

    display: flex;
    justify-content: center;
    align-items: center;

    gap: 10px;

    margin-top: 40px;
}

.amna-core-pagination .page-numbers{

    min-width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    text-decoration: none;

    transition: all .3s ease;
}

.amna-core-pagination .current{

    font-weight: 700;
}