a:hover { text-decoration: none; }
a:first-child:hover { color: #999999 !important; }

.glass-bg, .glass-bg-selector {
    backdrop-filter: blur(30px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    min-width: 415px;
}
.glass-bg { width: 415px; }
.glass-bg-selector {
    display: flex;
    flex-direction: column
}

.trialer-glass-bg {
    backdrop-filter: blur(30px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    min-width: 450px;
    width: 100%;
}

.glass-white {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.glass-error {
    background: rgba(255, 0, 0, 0.2);
    border: 1px solid rgba(255, 0, 0, 0.2);
    color: coral !important;
}

.glass-green {
    background: rgba(91, 250, 6, 0.2);
    border: 1px solid rgba(91, 250, 6, 0.2);
    color: #1f5a16 !important;
}

.glass-row {
    display: flex;
    flex-direction: row
}

.glass-row-element {
    display: flex;
    flex-wrap: wrap;
    min-width: 200px;
}

.glass-row-element .card .card-body {
    background-color: #0075ff;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    padding: 0;
}

.glass-row-element .card .card-title {
    color: white;
    padding-top: 13px;
}

.input-group input {
    border-top-right-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
}
.bg-final {
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.bg-Winter {
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

footer {
    display: table-cell;
    vertical-align: middle;
    position: absolute;
    bottom:0;
    height: 45px;
    width: 100vw;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.1);
}

#notif {
    position: absolute !important;
    top: 15px;
    right: 15px;
    color: white;
}

/* PARPADEO SUCCESS*/

.glass-green.parpadeando-success {
    animation: parpadeo-success 1s infinite;
}


/* PARPADEO */
@keyframes parpadeo-error {
    0%   { background-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.2); }
    25%  { background-color: rgba(255, 0, 0, 0.1); border-color: rgba(255, 0, 0, 0.2); }
    50%   { background-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.2); }
    75%  { background-color: rgba(255, 0, 0, 0.1); border-color: rgba(255, 0, 0, 0.2); }
    100%   { background-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.2); }
}

.parpadeo-error {
    animation-name: parpadeo-error;
    animation-duration: 1s;
}

/* RESPONSIVE (móvil ≤ 575.98px = breakpoint sm de Bootstrap 4) */
@media (max-width: 575.98px) {
    .glass-bg,
    .glass-bg-selector,
    .trialer-glass-bg {
        min-width: 0;
        width: 100%;
    }

    /* Centrado vertical conservado; si el form es más alto que la
       pantalla (trial), la página crece y hace scroll sin recortarse. */
    .container.vh-100 {
        height: auto;
        min-height: 100vh;
        padding-top: 24px;
        padding-bottom: 70px;
    }

    /* Fondo sin deformar en móvil (aspect ratio muy distinto al desktop) */
    body.bg-final,
    body.bg-Winter {
        background-size: cover;
        background-position: center center;
    }

    footer { width: 100%; }
}