.top-banner-scroll-container {
    background: linear-gradient(to right, #86CAE4, #84E7E1);
    color: #0A6E93; /* #003A56; */
    padding: 4px 12%;
    width: 100%;
    /* max-height: 60px; */
    display: flex;
    justify-content: center;
    align-items: center;
    position: sticky;
    top: 0;
    margin-top: 0;
    z-index: 2;
}

.top-banner-slider-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 68%;
     /* max-width: 640px; 640px for content + 60px for arrows */
    position: relative;
}


/* Aplicar padding ao input em si, não ao placeholder */
input[placeholder="Buscar Unidade Prisional"] {
    padding-left: 1.8em !important;
    padding-right: 1.8em !important;
}

/* Para navegadores modernos como Chrome, Firefox, Opera, Safari 10.1+ */
input[placeholder="Buscar Unidade Prisional"]::placeholder {
    color: #00B9F0; /* Mude esta linha para a cor desejada */
    opacity: 1; /* O Firefox aplica uma opacidade por padrão, isto garante a cor sólida. */
    font-size: 1.4em;
}

/* Para Firefox (versões 18 e anteriores) */
input[placeholder="Buscar Unidade Prisional"]::-moz-placeholder {
    color: #00B9F0; /* Mude esta linha para a cor desejada */
    opacity: 1;
    font-size: 1.4em;
}

/* Para Internet Explorer 10-11 */
input[placeholder="Buscar Unidade Prisional"]:-ms-input-placeholder {
    color: #00B9F0 !important; /* Mude esta linha para a cor desejada */
    font-size: 1.4em;
}

/* Para Microsoft Edge (versões antigas) */
input[placeholder="Buscar Unidade Prisional"]::-ms-input-placeholder {
    color: #00B9F0; /* Mude esta linha para a cor desejada */
    font-size: 1.4em;
}

@media only screen and (max-width: 391px) {
    .top-banner-slide {
        padding: 0 1.9rem !important;
    }
}

@media (max-width: 768px) {
    .top-banner-slider-wrapper {
        width: 100%;
    }
    .top-banner-scroll-container {
        /* max-height: 60px; */
        padding: 15px 0px;
    }
    
    /* Aplicar padding ao input em si, não ao placeholder */
    input[placeholder="Buscar Unidade Prisional"] {
        padding-left: 1.8em !important;
        padding-right: 1.8em !important;
    }
    
    /* Para navegadores modernos como Chrome, Firefox, Opera, Safari 10.1+ */
    input[placeholder="Buscar Unidade Prisional"]::placeholder {
        color: #00B9F0; /* Mude esta linha para a cor desejada */
        opacity: 1; /* O Firefox aplica uma opacidade por padrão, isto garante a cor sólida. */
        font-size: 1em;
    }
    
    /* Para Firefox (versões 18 e anteriores) */
    input[placeholder="Buscar Unidade Prisional"]::-moz-placeholder {
        color: #00B9F0; /* Mude esta linha para a cor desejada */
        opacity: 1;
        font-size: 1em;
    }
    
    /* Para Internet Explorer 10-11 */
    input[placeholder="Buscar Unidade Prisional"]:-ms-input-placeholder {
        color: #00B9F0 !important; /* Mude esta linha para a cor desejada */
        font-size: 1em;
    }
    
    /* Para Microsoft Edge (versões antigas) */
    input[placeholder="Buscar Unidade Prisional"]::-ms-input-placeholder {
        color: #00B9F0; /* Mude esta linha para a cor desejada */
        font-size: 1em;
    }
}

.top-banner-slider-viewport {
    width: 100%;
    overflow: hidden;
}

.top-banner-slider {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.top-banner-slide {
    min-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    padding: 0 3rem;
    box-sizing: border-box;
}

.top-banner-slide-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.top-banner-slide i {
    color: #0A6E93; /* #003A56; */
    font-size: 1.6em;
}

.banner-text {
    color: #0A6E93; /* #003A56; */
    font-size: 0.9em;
    line-height: 1.2rem;
    letter-spacing: -0.4px;
    white-space: normal;
    text-align: left;
    margin: 0;
    font-weight: 500;
}

.banner-text strong {
    font-size: 1rem !important;
}

.banner-text a {
    color: #0A6E93; /* #003A56; */
    /* font-weight: bold; */
    text-decoration: underline;
}

.banner-text a:hover {
    color: #0056b3;
}

.slider-arrow {
    background-color: transparent;
    border: none;
    color: #0A6E93; /* #003A56; */
    cursor: pointer;
    font-size: 1rem;
    padding: 0 8px;
}

.slider-arrow:hover {
    color: #0056b3;
}