@font-face {
    font-family: 'Old English';
    src: url('assets/OldEnglishFive-axyVg.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Cinzel';
    src: url('assets/Cinzel-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Cinzel';
    src: url('assets/Cinzel-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

body {
    background-color: #09090b;
    color: #f4f4f5;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    margin: 0;
}

h1, h2, h3, #model-badge {
    font-family: 'Outfit', sans-serif;
}

/* Custom fonts for Header Logo */
.logo-tl {
    font-family: 'Old English', serif;
    animation: logo-shadow-pulse 4s ease-in-out infinite alternate;
}

.logo-foundation {
    font-family: 'Cinzel', serif;
}

@keyframes logo-shadow-pulse {
    0% {
        text-shadow: 
            0 0 4px rgba(0, 0, 0, 0.8),
            0 0 10px rgba(59, 130, 246, 0.1);
    }
    50% {
        text-shadow: 
            0 0 10px rgba(0, 0, 0, 0.9),
            0 0 25px rgba(59, 130, 246, 0.55),
            0 0 35px rgba(139, 92, 246, 0.35);
    }
    100% {
        text-shadow: 
            0 0 4px rgba(0, 0, 0, 0.8),
            0 0 10px rgba(59, 130, 246, 0.1);
    }
}


/* Ambient Radial Glow */
.bg-glow {
    background: radial-gradient(
        circle at 50% 50%,
        rgba(37, 99, 235, 0.14) 0%,      /* Slate Blue */
        rgba(124, 58, 237, 0.08) 35%,    /* Violet */
        rgba(9, 9, 11, 0) 70%            /* Transparente */
    );
    width: 100%;
    height: 100%;
}

/* Custom Hide Scrollbar for prompt textarea */
#prompt-input::-webkit-scrollbar {
    display: none;
}
#prompt-input {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

/* Interactive Shake Animation for Validation Failures */
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-6px); }
    40%, 80% { transform: translateX(6px); }
}
.animate-shake {
    animation: shake 0.4s ease-in-out;
}

/* Custom styling for inputs */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus {
    -webkit-text-fill-color: #ffffff;
    -webkit-box-shadow: 0 0 0px 1000px #131314 inset;
    transition: background-color 5000s ease-in-out 0s;
}