.cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    display: none; /* Initially hidden */
}

.banner-content {
    background: white;
    padding: 5px;
    border-radius: 0px;
    box-shadow: 1px -6px 10px rgba(0, 0, 0, 0.5);
    text-align: left;
    width: 100%;
    pointer-events: auto; /* Ensure the banner is clickable */
    
}




.cookie-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    display: none; /* Initially hidden */
}

.cookie-popup .popup-content {
    background: white;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    max-width: 80%;
    text-align: center;
}
.cookie-popup .popup-content label,
.cookie-banner .banner-content label
{
    display: none;
    margin-left:15px;
}
.cookie-popup .popup-content label input,
.cookie-banner .banner-content label input
{
    margin-right: 5px;
}

.cookie-banner button,
.cookie-popup button {
    margin: 5px;
    
}

.cookie-popup #accept-selected,
.cookie-banner #accept-selected
 {
    background-color: #28a745; /* Verde */
    color: white; /* Texto blanco */
    padding: 8px 16px; /* Espaciado interno */
    border: none; /* Sin borde */
    border-radius: 5px; /* Esquinas redondeadas */
    font-size: 14px; /* Tamaño de fuente */
    font-weight: bold; /* Texto en negrita */
    cursor: pointer; /* Cursor en forma de mano */
    transition: background-color 0.3s, transform 0.2s; /* Transiciones suaves */
}

.cookie-popup #accept-selected:hover,
.cookie-banner #accept-selected:hover
{
    background-color: #218838; /* Verde más oscuro al pasar el ratón */
    transform: scale(1.05); /* Agranda ligeramente */
}

.cookie-popup #accept-selected:active, 
.cookie-banner #accept-selected:active 
{
    background-color: #1e7e34; /* Verde aún más oscuro al hacer clic */
    transform: scale(0.95); /* Reduce ligeramente */
}

.cookie-popup #functional-only,
.cookie-banner #functional-only,
.cookie-popup #settings-cookies,
.cookie-banner #settings-cookies
{
    background-color: #ddd; /* Verde */
    color: #333; /* Texto blanco */
    padding: 8px 16px; /* Espaciado interno */
    border: none; /* Sin borde */
    border-radius: 5px; /* Esquinas redondeadas */
    font-size: 14px; /* Tamaño de fuente */
    font-weight: normal; /* Texto en negrita */
    cursor: pointer; /* Cursor en forma de mano */
    transition: background-color 0.3s, transform 0.2s; /* Transiciones suaves */
}

.cookie-popup #functional-only:hover, 
.cookie-banner #functional-only:hover,
.cookie-popup #settings-cookies:hover,
.cookie-banner #settings-cookies:hover 
{
    background-color: #bbb; /* Verde más oscuro al pasar el ratón */
    transform: scale(1.05); /* Agranda ligeramente */
}

.cookie-popup #functional-only:active,
.cookie-banner #functional-only:active, 
.cookie-popup #settings-cookies:active,
.cookie-banner #settings-cookies:active 
{
    background-color: #ddd; /* Verde aún más oscuro al hacer clic */
    transform: scale(0.95); /* Reduce ligeramente */
}

#popup-text{
	width: 70%;
	display: inline-block;
	padding-left:15px;
}
#button-consent-container{
	min-width:380px;
	display: inline-block;
}

#button-consent-container {
    flex: 2;
    padding: 10px;
    text-align: right;

}

@media (max-width: 600px) {
    #popup-text, #button-consent-container {
        width: 100%;
        min-width:100%;
        text-align: left;
    }
    #button-consent-container button,
    #button-consent-container a{
		width:100%;
	}
}