/* 1. Large Screens (> 1367px) */
@media (min-width: 1367px) {
    .alerta {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: rgba(33, 50, 66, 0.4);
        backdrop-filter: blur(4px);
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 99999;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s ease;
    }

    .alerta.activo {
        opacity: 1;
        pointer-events: auto;
    }

    .modulo-a1 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    .bloque-a11 {
        background-color: #fff;
        width: 500px;
        display: flex;
        flex-direction: column;
        align-items: center;
        border-radius: 20px;
        overflow: hidden;
        transform: scale(0.8);
        transition: transform 0.3s ease;
        box-shadow: 0 10px 40px rgba(0,0,0,0.15);
    }

    .alerta.activo .bloque-a11 {
        transform: scale(1);
    }

    /* Pestañas / Cabecera */
    .contenido-a111 {
        display: flex;
        flex-direction: row;
        width: 500px;
        height: 50px;
        background-color: #f7f8f8;
        border-bottom: 1px solid #eee;
    }

    .item-a111 {
        display: flex;
        flex: 1;
        justify-content: center;
        align-items: center;
        font-family: 'Negrita';
        font-size: 15px;
        color: #888;
        cursor: pointer;
        transition: all 0.3s;
    }

    .item-a111.activo {
        color: #213242;
        background-color: #fff;
        border-bottom: 2px solid #213242;
    }

    /* Cuerpos de Alerta */
    .contenido-a112,
    .contenido-a113,
    .contenido-a114 {
        display: none;
        flex-direction: column;
        align-items: center;
        width: 500px;
        padding: 40px;
        gap: 24px;
    }

    .contenido-a112.activo,
    .contenido-a113.activo,
    .contenido-a114.activo {
        display: flex;
    }

    /* Texto base */
    .texto-a112,
    .texto-a113,
    .texto-a114 {
        font-family: 'Regular';
        font-size: 15px;
        color: #555;
        text-align: center;
        width: 420px;
        line-height: 1.5;
    }

    /* Diseño específico para transferencia (a114) */
    .icono-a114 {
        width: 60px;
        height: 60px;
        color: #e1b783;
    }

    /* Botonera */
    .bloque-a115 {
        display: flex;
        flex-direction: column;
        width: 500px;
        padding: 0 40px 40px 40px;
        gap: 12px;
    }

    .btn-a1151 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 420px;
        height: 48px;
        background-color: #fff;
        border: 1px solid #ddd;
        border-radius: 10px;
        font-family: 'Regular';
        font-size: 15px;
        color: #213242;
        cursor: pointer;
        text-decoration: none;
        transition: all 0.2s;
    }

    .btn-a1151:hover {
        border-color: #213242;
        background-color: #f7f8f8;
    }

    .btn-a1151.primario {
        background-color: #213242;
        color: #fff;
        border: none;
    }

    .btn-a1151.primario:hover {
        background-color: #324a61;
        transform: translateY(-2px);
    }
}

/* 2. Desktop (1281px - 1366px) */
@media (min-width: 1281px) and (max-width: 1366px) {
    .alerta { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(33, 50, 66, 0.4); backdrop-filter: blur(4px); display: flex; justify-content: center; align-items: center; z-index: 99999; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
    .alerta.activo { opacity: 1; pointer-events: auto; }
    .modulo-a1 { display: flex; justify-content: center; align-items: center; width: 100%; }
    .bloque-a11 { background-color: #fff; width: 480px; display: flex; flex-direction: column; align-items: center; border-radius: 20px; overflow: hidden; transform: scale(0.8); transition: transform 0.3s ease; box-shadow: 0 10px 40px rgba(0,0,0,0.15); }
    .alerta.activo .bloque-a11 { transform: scale(1); }
    .contenido-a111 { display: flex; flex-direction: row; width: 480px; height: 50px; background-color: #f7f8f8; border-bottom: 1px solid #eee; }
    .item-a111 { display: flex; flex: 1; justify-content: center; align-items: center; font-family: 'Negrita'; font-size: 14px; color: #888; cursor: pointer; transition: all 0.3s; }
    .item-a111.activo { color: #213242; background-color: #fff; border-bottom: 2px solid #213242; }
    .contenido-a112, .contenido-a113, .contenido-a114 { display: none; flex-direction: column; align-items: center; width: 480px; padding: 35px; gap: 20px; }
    .contenido-a112.activo, .contenido-a113.activo, .contenido-a114.activo { display: flex; }
    .texto-a112, .texto-a113, .texto-a114 { font-family: 'Regular'; font-size: 14px; color: #555; text-align: center; width: 400px; line-height: 1.5; }
    .icono-a114 { width: 55px; height: 55px; color: #e1b783; }
    .bloque-a115 { display: flex; flex-direction: column; width: 480px; padding: 0 35px 35px 35px; gap: 10px; }
    .btn-a1151 { display: flex; justify-content: center; align-items: center; width: 410px; height: 46px; background-color: #fff; border: 1px solid #ddd; border-radius: 10px; font-family: 'Regular'; font-size: 14px; color: #213242; cursor: pointer; transition: all 0.2s; }
    .btn-a1151:hover { border-color: #213242; background-color: #f7f8f8; }
    .btn-a1151.primario { background-color: #213242; color: #fff; border: none; }
}

/* 3. Laptop (1025px - 1280px) */
@media (min-width: 1025px) and (max-width: 1280px) {
    .alerta { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(33, 50, 66, 0.4); backdrop-filter: blur(4px); display: flex; justify-content: center; align-items: center; z-index: 99999; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
    .alerta.activo { opacity: 1; pointer-events: auto; }
    .modulo-a1 { display: flex; justify-content: center; align-items: center; width: 100%; }
    .bloque-a11 { background-color: #fff; width: 450px; display: flex; flex-direction: column; align-items: center; border-radius: 18px; overflow: hidden; transform: scale(0.8); transition: transform 0.3s ease; }
    .alerta.activo .bloque-a11 { transform: scale(1); }
    .contenido-a111 { display: flex; flex-direction: row; width: 450px; height: 45px; background-color: #f7f8f8; border-bottom: 1px solid #eee; }
    .item-a111 { display: flex; flex: 1; justify-content: center; align-items: center; font-family: 'Negrita'; font-size: 14px; color: #888; cursor: pointer; }
    .item-a111.activo { color: #213242; background-color: #fff; border-bottom: 2px solid #213242; }
    .contenido-a112, .contenido-a113, .contenido-a114 { display: none; flex-direction: column; align-items: center; width: 450px; padding: 30px; gap: 20px; }
    .contenido-a112.activo, .contenido-a113.activo, .contenido-a114.activo { display: flex; }
    .texto-a112, .texto-a113, .texto-a114 { font-family: 'Regular'; font-size: 14px; color: #555; text-align: center; width: 390px; line-height: 1.4; }
    .icono-a114 { width: 50px; height: 50px; color: #e1b783; }
    .bloque-a115 { display: flex; flex-direction: column; width: 450px; padding: 0 30px 30px 30px; gap: 10px; }
    .btn-a1151 { display: flex; justify-content: center; align-items: center; width: 390px; height: 44px; background-color: #fff; border: 1px solid #ddd; border-radius: 9px; font-family: 'Regular'; font-size: 14px; color: #213242; cursor: pointer; }
    .btn-a1151.primario { background-color: #213242; color: #fff; border: none; }
}

/* 4. Tablet (768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .alerta { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(33, 50, 66, 0.4); backdrop-filter: blur(4px); display: flex; justify-content: center; align-items: center; z-index: 99999; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
    .alerta.activo { opacity: 1; pointer-events: auto; }
    .modulo-a1 { display: flex; justify-content: center; align-items: center; width: 100%; }
    .bloque-a11 { background-color: #fff; width: 400px; display: flex; flex-direction: column; align-items: center; border-radius: 16px; overflow: hidden; transform: scale(0.8); transition: transform 0.3s ease; }
    .alerta.activo .bloque-a11 { transform: scale(1); }
    .contenido-a111 { display: flex; flex-direction: row; width: 400px; height: 45px; background-color: #f7f8f8; border-bottom: 1px solid #eee; }
    .item-a111 { display: flex; flex: 1; justify-content: center; align-items: center; font-family: 'Negrita'; font-size: 13px; color: #888; }
    .item-a111.activo { color: #213242; background-color: #fff; border-bottom: 2px solid #213242; }
    .contenido-a112, .contenido-a113, .contenido-a114 { display: none; flex-direction: column; align-items: center; width: 400px; padding: 25px; gap: 15px; }
    .contenido-a112.activo, .contenido-a113.activo, .contenido-a114.activo { display: flex; }
    .texto-a112, .texto-a113, .texto-a114 { font-family: 'Regular'; font-size: 13px; color: #555; text-align: center; width: 350px; line-height: 1.4; }
    .icono-a114 { width: 45px; height: 45px; color: #e1b783; }
    .bloque-a115 { display: flex; flex-direction: column; width: 400px; padding: 0 25px 25px 25px; gap: 10px; }
    .btn-a1151 { display: flex; justify-content: center; align-items: center; width: 350px; height: 42px; background-color: #fff; border: 1px solid #ddd; border-radius: 8px; font-family: 'Regular'; font-size: 13px; color: #213242; cursor: pointer; }
    .btn-a1151.primario { background-color: #213242; color: #fff; border: none; }
}

/* 5. Mobile (481px - 767px) */
@media (min-width: 481px) and (max-width: 767px) {
    .alerta { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(33, 50, 66, 0.4); backdrop-filter: blur(4px); display: flex; justify-content: center; align-items: center; z-index: 99999; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
    .alerta.activo { opacity: 1; pointer-events: auto; }
    .modulo-a1 { display: flex; justify-content: center; align-items: center; width: 100%; }
    .bloque-a11 { background-color: #fff; width: 90%; display: flex; flex-direction: column; align-items: center; border-radius: 16px; overflow: hidden; transform: scale(0.8); transition: transform 0.3s ease; }
    .alerta.activo .bloque-a11 { transform: scale(1); }
    .contenido-a111 { display: flex; flex-direction: row; width: 100%; height: 45px; background-color: #f7f8f8; border-bottom: 1px solid #eee; }
    .item-a111 { display: flex; flex: 1; justify-content: center; align-items: center; font-family: 'Negrita'; font-size: 13px; color: #888; }
    .item-a111.activo { color: #213242; background-color: #fff; border-bottom: 2px solid #213242; }
    .contenido-a112, .contenido-a113, .contenido-a114 { display: none; flex-direction: column; align-items: center; width: 100%; padding: 25px; gap: 15px; }
    .contenido-a112.activo, .contenido-a113.activo, .contenido-a114.activo { display: flex; }
    .texto-a112, .texto-a113, .texto-a114 { font-family: 'Regular'; font-size: 13px; color: #555; text-align: center; width: 100%; line-height: 1.4; }
    .icono-a114 { width: 40px; height: 40px; color: #e1b783; }
    .bloque-a115 { display: flex; flex-direction: column; width: 100%; padding: 0 25px 25px 25px; gap: 8px; }
    .btn-a1151 { display: flex; justify-content: center; align-items: center; width: 100%; height: 42px; background-color: #fff; border: 1px solid #ddd; border-radius: 8px; font-family: 'Regular'; font-size: 13px; color: #213242; cursor: pointer; }
    .btn-a1151.primario { background-color: #213242; color: #fff; border: none; }
}

/* 6. Mobile Small (320px - 480px) */
@media (min-width: 320px) and (max-width: 480px) {
    .alerta { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(33, 50, 66, 0.4); backdrop-filter: blur(4px); display: flex; justify-content: center; align-items: center; z-index: 99999; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
    .alerta.activo { opacity: 1; pointer-events: auto; }
    .modulo-a1 { display: flex; justify-content: center; align-items: center; width: 100%; }
    .bloque-a11 { background-color: #fff; width: 85%; display: flex; flex-direction: column; align-items: center; border-radius: 12px; overflow: hidden; transform: scale(0.8); transition: transform 0.3s ease; }
    .alerta.activo .bloque-a11 { transform: scale(1); }
    .contenido-a111 { display: flex; flex-direction: row; width: 100%; height: 40px; background-color: #f7f8f8; border-bottom: 1px solid #eee; }
    .item-a111 { display: flex; flex: 1; justify-content: center; align-items: center; font-family: 'Negrita'; font-size: 12px; color: #888; }
    .item-a111.activo { color: #213242; background-color: #fff; border-bottom: 2px solid #213242; }
    .contenido-a112, .contenido-a113, .contenido-a114 { display: none; flex-direction: column; align-items: center; width: 100%; padding: 20px; gap: 15px; }
    .contenido-a112.activo, .contenido-a113.activo, .contenido-a114.activo { display: flex; }
    .texto-a112, .texto-a113, .texto-a114 { font-family: 'Regular'; font-size: 12px; color: #555; text-align: center; width: 100%; line-height: 1.4; }
    .icono-a114 { width: 35px; height: 35px; color: #e1b783; }
    .bloque-a115 { display: flex; flex-direction: column; width: 100%; padding: 0 20px 20px 20px; gap: 8px; }
    .btn-a1151 { display: flex; justify-content: center; align-items: center; width: 100%; height: 38px; background-color: #fff; border: 1px solid #ddd; border-radius: 6px; font-family: 'Regular'; font-size: 12px; color: #213242; cursor: pointer; }
    .btn-a1151.primario { background-color: #213242; color: #fff; border: none; }
}