@import "../../../Shared/assets/css/index.scss";

* {
    min-height: 0;
    min-width: 0;
}

.content {
    display: block;
    width: 100%;

    .slide-container {
        margin: 0 auto;
        // border-color: white;
        display: block;
        min-height: 34rem;

        .error-container {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 1rem;
            margin-top: 1rem;
            font-size: 1rem;
            font-family: inherit;
            font-weight: 700;
            line-height: 1.5rem;
            text-align: center;

            img {
                width: 6.25rem;
                height: 6.25rem;
            }

            h3 {

                font-family: inherit;
                font-size: 0.875rem;
                font-weight: 500;
                line-height: 1.5rem;
                text-align: center;
                color: #64718B;



            }
        }

        .loading-container {
            display: flex;
            flex-direction: column;
            width: 100%;
            height: 100%;
            min-height: 34rem;
            justify-content: center;
            align-items: center;
        }
    }

    .slide-class {
        margin-left: auto;
        margin-right: auto;

        .slick-dots {
            bottom: 1rem;
        }

        .slick-next {
            right: 2.813rem;
            width: 1.5rem;
            height: 1.5rem;
            z-index: 1;

            &::before {
                content: "" !important;
            }
        }

        .slick-prev {
            left: 2.813rem;
            width: 1.5rem;
            height: 1.5rem;
            z-index: 1;

            &::before {
                content: "" !important;
            }
        }
    }

    .slide-card {
        display: flex !important;
        flex-direction: row;
        gap: 4.0625rem;
        justify-content: start;
        width: 100% !important;
        height: 34rem;
        position: relative;
        background: linear-gradient(90deg, #E8EFF4 0%, rgba(232, 239, 244, 0) 100%);

        img {
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            object-fit: cover;
            z-index: 0;
            pointer-events: none;
            user-select: none;
        }

        .slide-content-text {
            position: relative;
            z-index: 1;
            width: 50%;
            text-align: start;
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding-left: 1.5rem;
            padding-right: 1.688rem;
            background: transparent;
            height: 100%;

            .title {
                width: 100%;
                font-size: 3.125rem;
                color: #23282E;
                font-weight: 700;
                margin-bottom: 1.25rem;
                line-height: 4rem;
            }

            .description {
                font-size: 1rem;
                color: #23282E;
                font-weight: 500;
                margin-bottom: 3.125rem;
                line-height: 1.75rem;
            }

            .date {
                font-size: .75rem;
                color: #64718B;
                font-weight: 300;
                margin-bottom: 1rem;
            }

            .stat-anacom-link-button-yellow {
                width: fit-content;
            }
        }

        // .slide-content-img {
        //     width: 50%;
        //     display: flex;
        //     align-items: center;
        //     justify-content: center;

        //     .slide-img {
        //         margin: 0;
        //         width: 100%;
        //         height: 100%;
        //         border-top-right-radius: .5rem;
        //         border-bottom-right-radius: .5rem;
        //         object-fit: cover;
        //         object-position: center;
        //     }
        // }
    }
}

.arrow-wrapper-container {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 100%;
    pointer-events: none; // Allow clicks to pass through
    z-index: 4;

    .container {
        position: relative;
        height: 100%;
        pointer-events: auto; // Re-enable clicks within container
    }
}

.next-slick-arrow,
.prev-slick-arrow {
    color: #000000;
    font-size: 2.8125rem;
}

.rotate-180 {
    transform: rotate(180deg);
}

@media (max-width: 48rem) {
    .content {
        .slide-container {
            min-height: 31.25rem;

            .loading-container {
                min-height: 31.25rem;
            }

            .slide-card {
                // display: grid !important;
                width: 100%;
                gap: 1.5rem;
                height: 31.25rem;

                .mobile {
                    width: 100%;
                }

                .slide-content-text,
                .slide-content-img {
                    width: 100%;
                }

                .slide-content-text {
                    padding: 3.875rem 1rem;
                    background: linear-gradient(180deg, rgba(232, 239, 244, 0.9) 0%, rgba(232, 239, 244, 0) 59.11%);
                    justify-content: start;

                    .title {
                        font-size: 1.5rem;
                        margin-bottom: 0.5rem;
                        width: 100%;
                        line-height: 2.25rem;
                    }

                    .description {
                        font-size: 0.875rem;
                        margin-bottom: 2rem;
                        line-height: 1.5rem;
                    }
                }
            }

        }
    }

    .next-slick-arrow,
    .prev-slick-arrow {
        display: none;
    }
}