body {
            margin: 0; padding: 0; height: 100vh;
            display: flex; justify-content: center; align-items: center;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            background-color: #1a5c8b;
            background-image: url('../img/b.jpeg');
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
        }

        .login-card {
            background: rgba(255, 255, 255, 0.15);
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
            border: 1px solid rgba(255, 255, 255, 0.3);
            padding: 2.5rem;
            border-radius: 28px;
            box-shadow: 0 25px 45px rgba(0,0,0,0.2);
            width: 100%;
            max-width: 340px;
            text-align: center;
            color: white;
        }

        .logo-container img { width: 250px; margin-bottom: 1rem; filter: drop-shadow(0 4px 6px rgba(0,0,0,0.2)); }
        h2 { font-weight: 600; font-size: 1.3rem; margin-bottom: 2rem; letter-spacing: 0.5px; }

        .input-group { margin-bottom: 1.2rem; position: relative; }
        
        input[type="text"], input[type="password"] {
            width: 100%; padding: 16px 20px;
            background: rgba(255, 255, 255, 0.2);
            border: 1px solid rgba(255, 255, 255, 0.4);
            border-radius: 16px;
            font-size: 1rem;
            color: white;
            box-sizing: border-box;
            outline: none;
            transition: all 0.3s ease;
        }
        input::placeholder { color: rgba(255, 255, 255, 0.7); }
        input:focus { background: rgba(255, 255, 255, 0.3); border-color: white; }

        .toggle-password {
            position: absolute; right: 20px; top: 50%; transform: translateY(-50%);
            cursor: pointer; color: rgba(255,255,255,0.7);
        }

        .options-row { display: flex; justify-content: space-between; align-items: center; font-size: 0.85rem; margin-bottom: 2rem; padding: 0 5px; }
        .toggle-switch { display: flex; align-items: center; gap: 8px; cursor: pointer; }
        .toggle-switch input { display: none; }
        .slider { width: 44px; height: 24px; background-color: rgba(255,255,255,0.3); border-radius: 34px; position: relative; transition: 0.4s; }
        .slider:before { position: absolute; content: ""; height: 18px; width: 18px; left: 3px; bottom: 3px; background-color: white; border-radius: 50%; transition: 0.4s; }
        .toggle-switch input:checked + .slider { background-color: #34c759; }
        .toggle-switch input:checked + .slider:before { transform: translateX(20px); }

        .forgot-link { color: white; text-decoration: none; opacity: 0.8; transition: opacity 0.3s; }
        .forgot-link:hover { opacity: 1; }

        button {
            background: #e55039;
            color: white; border: none; padding: 16px; width: 100%;
            border-radius: 16px; font-weight: 600; font-size: 1.1rem;
            cursor: pointer; box-shadow: 0 10px 20px rgba(229, 80, 57, 0.3);
            transition: transform 0.2s, background 0.3s;
        }
        button:hover { transform: scale(1.02); background: #d34630; }
        .error-msg { background: rgba(255,0,0,0.2); border-radius: 8px; padding: 10px; margin-bottom: 15px; font-size: 0.85rem; }

        /* ============================================================
           BANNER DE INSTALACIÓN PARA iOS (Safari no tiene botón auto)
           ============================================================ */
        #ios-install-banner {
            display: none;
            position: fixed;
            bottom: 0; left: 0; right: 0;
            background: rgba(26, 92, 139, 0.97);
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
            color: white;
            padding: 16px 20px;
            text-align: center;
            font-size: 0.9rem;
            z-index: 9999;
            border-top: 1px solid rgba(255,255,255,0.2);
        }
        #ios-install-banner strong { display: block; margin-bottom: 5px; font-size: 1rem; }
        #ios-install-banner span { opacity: 0.85; }
        #ios-close-btn {
            position: absolute; top: 10px; right: 16px;
            background: none; border: none; color: white;
            font-size: 1.3rem; cursor: pointer; padding: 0;
            box-shadow: none; width: auto;
        }