:root {
    --primary: #ef4444;
    --primary-light: #f87171;
    --primary-dark: #be123c;

    --bg-main: #f8fafc;
    --bg-card: rgba(255,255,255,0.78);

    --text-main: #0f172a;
    --text-muted: #64748b;
}

/* ===== SFONDO VISUAL ===== */
.login-visual {
    background-image: url('/public/images/hubfatture/bg-image-login-1.jpg');
    background-position: center;
}

/* ===== FORM WRAPPER (leggero contrasto) ===== */
.login-form-wrapper {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

/* ===== BUTTON ===== */
.btn-login {
    background: linear-gradient(135deg, var(--primary), var(--primary-dark));
    box-shadow: 0 10px 30px rgba(239,68,68,0.30);
}

.btn-login:hover {
    background: linear-gradient(135deg, var(--primary-light), var(--primary));
    box-shadow: 0 15px 45px rgba(239,68,68,0.40);
}

/* ===== INPUT FOCUS (override coerente) ===== */
.form-floating-custom input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(239,68,68,0.12);
}

/* ===== LABEL ATTIVA ===== */
.form-floating-custom input:focus + label,
.form-floating-custom input:not(:placeholder-shown) + label {
    color: var(--primary);
}

/* ===== ICON ATTIVA ===== */
.form-floating-custom input:focus ~ i {
    color: var(--primary);
}

/* ===== ORBS (AMBIENT) ===== */
.orb-1 {
    background: radial-gradient(circle, rgba(239,68,68,0.25), transparent 70%);
}

.orb-2 {
    background: radial-gradient(circle, rgba(190,18,60,0.20), transparent 70%);
}

/* ===== MICRO INTERAZIONE INPUT ===== */
.form-floating-custom input:hover {
    border-color: rgba(239,68,68,0.25);
}

/* ===== LINK ===== */
a {
    color: var(--primary);
}

a:hover {
    color: var(--primary-dark);
}

/* ===== SELEZIONE TESTO (dettaglio pro) ===== */
::selection {
    background: rgba(239,68,68,0.2);
    color: #000;
}