/* Custom styles for 2FA Tool */

/* Smooth width transition for progress bar */
#progress-bar {
    transition: width 1s linear;
}

/* Ensure the font matches the design closely with Inter */
body {
    font-family: 'Inter', sans-serif;
}

/* Specific styling for the generated code to look monospaced and clean */
#otp-code {
    font-variant-numeric: tabular-nums;
}

/* Add a slight pulse effect when code changes */
@keyframes code-update {
    0% { transform: scale(1); opacity: 0.5; }
    50% { transform: scale(1.1); opacity: 1; }
    100% { transform: scale(1); }
}

.code-changed {
    animation: code-update 0.3s ease-in-out;
}