/* Custom CSS for Ocati Analytics - Professional Color Palette */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* Ocati Color Palette Variables */
:root {
    /* Primary Colors */
    --primary-dark: #004132;
    --primary-bright: #2DE187;
    --primary-neon: #E6FA41;

    /* Secondary Colors */
    --secondary-dark-gray: #242E2C;
    --secondary-very-dark: #173330;
    --secondary-medium: #157F67;

    /* Support Colors */
    --support-light-gray: #F2F4F8;
    --support-blue-gray: #E3E9F1;
    --support-green-light: #E0E8E6;
    --support-green-gray: #BFCFCC;
    --support-text-secondary: #64716D;

    /* Gradients */
    --gradient-primary: linear-gradient(135deg, #004132 0%, #157F67 100%);
    --gradient-secondary: linear-gradient(90deg, #157F67 0%, #E0E8E6 100%);
}

[data-theme="dark"] {
    --primary-dark: #2DE187;
    --secondary-dark-gray: #E0E8E6;
    --secondary-medium: #E6FA41;
    --support-light-gray: #1A1A1A;
    --support-green-light: #2A2A2A;
    --gradient-primary: linear-gradient(135deg, #2DE187 0%, #157F67 100%);
    --gradient-secondary: linear-gradient(90deg, #2DE187 0%, #E6FA41 100%);
}

/* Global Typography */
body {
    font-family: 'Inter', sans-serif !important;
    line-height: 1.6;
}

/* Hide default logo images */
.MuiToolbar-root img[alt="logo"] {
    display: none !important;
}

/* Add SVG logo in header */
.MuiToolbar-root > div:first-child::after {
    content: '';
    display: block;
    width: 120px;
    height: 40px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 181 40'%3E%3Cpath fill='%23004132' d='M52.305 16.174c-1.139-1.656-2.71-2.954-4.76-3.849s-4.394-1.342-7.058-1.342c-2.437 0-4.691.402-6.786 1.208-2.072.805-3.848 1.924-5.306 3.356l3.78 4.296a11.05 11.05 0 0 1 3.575-2.506 11.1 11.1 0 0 1 4.395-.895c2.14 0 3.848.515 5.078 1.566 1.139.963 1.73 2.283 1.822 3.983h-6.308c-2.664 0-5.01.358-7.013 1.074-2.027.716-3.575 1.723-4.668 3.043-1.093 1.298-1.64 2.886-1.64 4.744 0 1.745.456 3.289 1.344 4.609s2.14 2.372 3.734 3.11 3.461 1.119 5.579 1.119c2.323 0 4.372-.47 6.148-1.432a10.8 10.8 0 0 0 3.37-2.82l3.439 3.379h2.96V22.215c0-2.394-.57-4.43-1.685-6.086zm-5.807 14.901a7.65 7.65 0 0 1-2.846 2.44 8.56 8.56 0 0 1-3.871.894c-1.503 0-2.71-.335-3.643-1.029-.934-.671-1.39-1.611-1.39-2.797 0-1.298.593-2.282 1.8-2.953 1.206-.672 2.777-1.03 4.758-1.03h5.784v3.29c-.182.402-.341.805-.592 1.163zm73.846-14.901c-1.138-1.656-2.709-2.954-4.759-3.849-2.049-.895-4.395-1.342-7.059-1.342-2.436 0-4.691.402-6.786 1.208-2.072.805-3.848 1.924-5.305 3.356l3.78 4.296a11 11 0 0 1 3.575-2.506 11.1 11.1 0 0 1 4.395-.895c2.14 0 3.848.515 5.078 1.566 1.138.963 1.73 2.283 1.821 3.983h-6.307c-2.665 0-5.01.358-7.014 1.074-2.026.716-3.575 1.723-4.668 3.043-1.093 1.298-1.64 2.886-1.64 4.744 0 1.745.456 3.289 1.344 4.609s2.14 2.372 3.735 3.11 3.461 1.119 5.578 1.119c2.323 0 4.372-.47 6.149-1.432a10.8 10.8 0 0 0 3.37-2.82l3.438 3.379h2.96V22.215c0-2.394-.569-4.43-1.685-6.086zm-5.806 14.901a7.65 7.65 0 0 1-2.847 2.44 8.56 8.56 0 0 1-3.871.894c-1.503 0-2.709-.335-3.643-1.029-.934-.671-1.389-1.611-1.389-2.797 0-1.298.592-2.282 1.799-2.953 1.207-.672 2.778-1.03 4.759-1.03h5.784v3.29c-.182.402-.342.805-.592 1.163zm37.708-19.22v27.007h-3.233l-3.871-3.647a9.7 9.7 0 0 1-3.256 3.087c-1.617.94-3.53 1.432-5.716 1.432-3.233 0-5.807-.94-7.697-2.819s-2.846-4.609-2.846-8.189v-16.87h7.218v16.11c0 1.924.479 3.4 1.458 4.385q1.434 1.476 3.962 1.476a7.2 7.2 0 0 0 3.325-.783c1.024-.514 1.867-1.253 2.573-2.192.387-.515.66-1.097.865-1.7V11.854zm2.255 22.98 3.939-4.408c1.23 1.208 2.732 2.192 4.463 2.908a13.8 13.8 0 0 0 5.328 1.074c1.685 0 3.006-.313 4.008-.917s1.503-1.365 1.503-2.26-.455-1.611-1.343-2.058c-.889-.448-2.551-.828-4.942-1.164-4.007-.582-6.945-1.5-8.789-2.775-1.845-1.275-2.778-3.043-2.778-5.28 0-1.79.501-3.356 1.525-4.699s2.437-2.394 4.258-3.132c1.822-.76 3.871-1.119 6.171-1.119 2.733 0 5.147.425 7.241 1.298 2.095.85 3.894 1.991 5.374 3.378l-3.939 4.408a13.2 13.2 0 0 0-3.917-2.73 11.3 11.3 0 0 0-4.736-1.029c-1.571 0-2.823.291-3.734.85-.934.582-1.389 1.298-1.389 2.149 0 .76.455 1.32 1.366 1.722.911.403 2.505.739 4.805 1.03 3.939.581 6.876 1.521 8.857 2.841 1.959 1.32 2.961 3.245 2.961 5.75 0 1.835-.547 3.424-1.64 4.811s-2.596 2.439-4.508 3.177c-1.913.739-4.145 1.097-6.695 1.097-2.733 0-5.237-.448-7.537-1.343s-4.236-2.08-5.852-3.535zM.001 38.861V.467h7.377v29.557l-3.689 2.55h22.156v6.288zM84.48.467v16.087H65.853V.467h-7.378v38.395h7.377V25.907l-4.53-3.133h23.18v16.088h7.378V.467H84.48'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    padding: 8px 0;
}

[data-theme="dark"] .MuiToolbar-root > div:first-child::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 181 40'%3E%3Cpath fill='%232DE187' d='M52.305 16.174c-1.139-1.656-2.71-2.954-4.76-3.849s-4.394-1.342-7.058-1.342c-2.437 0-4.691.402-6.786 1.208-2.072.805-3.848 1.924-5.306 3.356l3.78 4.296a11.05 11.05 0 0 1 3.575-2.506 11.1 11.1 0 0 1 4.395-.895c2.14 0 3.848.515 5.078 1.566 1.139.963 1.73 2.283 1.822 3.983h-6.308c-2.664 0-5.01.358-7.013 1.074-2.027.716-3.575 1.723-4.668 3.043-1.093 1.298-1.64 2.886-1.64 4.744 0 1.745.456 3.289 1.344 4.609s2.14 2.372 3.734 3.11 3.461 1.119 5.579 1.119c2.323 0 4.372-.47 6.148-1.432a10.8 10.8 0 0 0 3.37-2.82l3.439 3.379h2.96V22.215c0-2.394-.57-4.43-1.685-6.086zm-5.807 14.901a7.65 7.65 0 0 1-2.846 2.44 8.56 8.56 0 0 1-3.871.894c-1.503 0-2.71-.335-3.643-1.029-.934-.671-1.39-1.611-1.39-2.797 0-1.298.593-2.282 1.8-2.953 1.206-.672 2.777-1.03 4.758-1.03h5.784v3.29c-.182.402-.341.805-.592 1.163zm73.846-14.901c-1.138-1.656-2.709-2.954-4.759-3.849-2.049-.895-4.395-1.342-7.059-1.342-2.436 0-4.691.402-6.786 1.208-2.072.805-3.848 1.924-5.305 3.356l3.78 4.296a11 11 0 0 1 3.575-2.506 11.1 11.1 0 0 1 4.395-.895c2.14 0 3.848.515 5.078 1.566 1.138.963 1.73 2.283 1.821 3.983h-6.307c-2.665 0-5.01.358-7.014 1.074-2.026.716-3.575 1.723-4.668 3.043-1.093 1.298-1.64 2.886-1.64 4.744 0 1.745.456 3.289 1.344 4.609s2.14 2.372 3.735 3.11 3.461 1.119 5.578 1.119c2.323 0 4.372-.47 6.149-1.432a10.8 10.8 0 0 0 3.37-2.82l3.438 3.379h2.96V22.215c0-2.394-.569-4.43-1.685-6.086zm-5.806 14.901a7.65 7.65 0 0 1-2.847 2.44 8.56 8.56 0 0 1-3.871.894c-1.503 0-2.709-.335-3.643-1.029-.934-.671-1.389-1.611-1.389-2.797 0-1.298.592-2.282 1.799-2.953 1.207-.672 2.778-1.03 4.759-1.03h5.784v3.29c-.182.402-.342.805-.592 1.163zm37.708-19.22v27.007h-3.233l-3.871-3.647a9.7 9.7 0 0 1-3.256 3.087c-1.617.94-3.53 1.432-5.716 1.432-3.233 0-5.807-.94-7.697-2.819s-2.846-4.609-2.846-8.189v-16.87h7.218v16.11c0 1.924.479 3.4 1.458 4.385q1.434 1.476 3.962 1.476a7.2 7.2 0 0 0 3.325-.783c1.024-.514 1.867-1.253 2.573-2.192.387-.515.66-1.097.865-1.7V11.854zm2.255 22.98 3.939-4.408c1.23 1.208 2.732 2.192 4.463 2.908a13.8 13.8 0 0 0 5.328 1.074c1.685 0 3.006-.313 4.008-.917s1.503-1.365 1.503-2.26-.455-1.611-1.343-2.058c-.889-.448-2.551-.828-4.942-1.164-4.007-.582-6.945-1.5-8.789-2.775-1.845-1.275-2.778-3.043-2.778-5.28 0-1.79.501-3.356 1.525-4.699s2.437-2.394 4.258-3.132c1.822-.76 3.871-1.119 6.171-1.119 2.733 0 5.147.425 7.241 1.298 2.095.85 3.894 1.991 5.374 3.378l-3.939 4.408a13.2 13.2 0 0 0-3.917-2.73 11.3 11.3 0 0 0-4.736-1.029c-1.571 0-2.823.291-3.734.85-.934.582-1.389 1.298-1.389 2.149 0 .76.455 1.32 1.366 1.722.911.403 2.505.739 4.805 1.03 3.939.581 6.876 1.521 8.857 2.841 1.959 1.32 2.961 3.245 2.961 5.75 0 1.835-.547 3.424-1.64 4.811s-2.596 2.439-4.508 3.177c-1.913.739-4.145 1.097-6.695 1.097-2.733 0-5.237-.448-7.537-1.343s-4.236-2.08-5.852-3.535zM.001 38.861V.467h7.377v29.557l-3.689 2.55h22.156v6.288zM84.48.467v16.087H65.853V.467h-7.378v38.395h7.377V25.907l-4.53-3.133h23.18v16.088h7.378V.467H84.48'/%3E%3C/svg%3E");
}

/* Welcome Screen Container */
.step-container .step.Welcome {
    max-width: 1200px;
    margin: 0 auto;
    background: white;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 10px 30px rgba(0, 65, 50, 0.1);
}

[data-theme="dark"] .step-container .step.Welcome {
    background: var(--support-light-gray);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* Hide all logo images in welcome screen and main view */
.step.Welcome img,
.MuiBox-root img[alt="logo"],
img[src*="logo"],
img[src*="favicon"],
.css-1oy0u9v img,
.css-bjn8wh img,
/* Chainlit v2 welcome screen logo */
#welcome-screen img.logo,
.welcome-screen img.logo,
img.logo[alt="logo"],
img[alt="logo"] {
    display: none !important;
}

/* Also hide any logo container that might show fallback */
.MuiBox-root:has(img[alt="logo"]) {
    min-height: 0 !important;
}

/* Override ALL step/tool avatars with Ocati logo */
/* Hide original avatar images from /avatars/ endpoint */
img[src*="/avatars/"],
img[alt*="Avatar for"] {
    visibility: hidden !important;
    position: absolute !important;
}

/* Show Ocati avatar via container background */
span:has(> img[src*="/avatars/"]),
span:has(> img[alt*="Avatar for"]) {
    background-image: url('/public/favicon.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Also target the specific Tailwind classes used */
.rounded-full:has(img[alt*="Avatar"]) {
    background-image: url('/public/favicon.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
}

.rounded-full:has(img[alt*="Avatar"]) img {
    visibility: hidden !important;
}

/* Add welcome text in the center */
.step.Welcome::before {
    content: "Hola, ¿qué quieres analizar hoy?";
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 2.5rem;
    font-weight: 600;
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-align: center;
    margin: 40px auto;
    padding: 20px;
    letter-spacing: -0.02em;
}

/* Main Title - Centinela Analytics */
.step.Welcome h1 {
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-size: 3.5em !important;
    text-align: center;
    margin-bottom: 10px !important;
    letter-spacing: -0.02em;
}

/* Subtitle */
.step.Welcome h2 {
    font-family: 'Inter', sans-serif !important;
    font-weight: 500 !important;
    color: var(--secondary-dark-gray) !important;
    text-align: center;
    font-size: 1.3em !important;
    margin-bottom: 40px !important;
}

/* Section Headers */
.step.Welcome h3 {
    font-family: 'Inter', sans-serif !important;
    color: var(--primary-dark) !important;
    font-size: 1.5em !important;
    margin-top: 30px !important;
    margin-bottom: 20px !important;
    padding-bottom: 10px;
    border-bottom: 3px solid var(--primary-bright);
}

/* Feature Cards */
.step.Welcome p strong {
    display: block;
    background: linear-gradient(135deg, var(--support-light-gray) 0%, var(--support-green-light) 100%);
    border-radius: 12px;
    padding: 15px;
    margin: 10px 0;
    border-left: 4px solid var(--secondary-medium);
    color: var(--primary-dark);
    font-weight: 600;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.step.Welcome p strong:hover {
    transform: translateX(5px);
    box-shadow: 0 5px 20px rgba(21, 127, 103, 0.2);
}

.step.Welcome p:not(:has(strong)) {
    color: var(--support-text-secondary);
    margin-left: 20px;
    font-size: 0.95em;
}

/* Lists */
.step.Welcome ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 20px 0 !important;
}

.step.Welcome ul li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 10px;
    color: var(--secondary-dark-gray);
}

.step.Welcome ul li::before {
    content: "▸" !important;
    position: absolute;
    left: 0;
    color: var(--secondary-medium);
    font-weight: bold;
    font-size: 1.2em;
}

/* Dividers */
.step.Welcome hr {
    border: none !important;
    height: 2px !important;
    background: var(--gradient-secondary) !important;
    margin: 40px 0 !important;
    border-radius: 2px;
}

/* Footer */
.step.Welcome em {
    display: block;
    text-align: center;
    color: var(--support-text-secondary);
    font-size: 0.9em;
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid var(--support-green-light);
}

/* Dark mode adjustments */
[data-theme="dark"] .step.Welcome h2 {
    color: var(--support-green-light) !important;
}

[data-theme="dark"] .step.Welcome h3 {
    color: var(--primary-dark) !important;
    border-bottom-color: var(--secondary-medium);
}

[data-theme="dark"] .step.Welcome p strong {
    background: linear-gradient(135deg, #2A2A2A 0%, #1F1F1F 100%);
    border-left-color: var(--secondary-medium);
    color: var(--primary-dark);
}

[data-theme="dark"] .step.Welcome ul li {
    color: var(--support-green-light);
}

[data-theme="dark"] .step.Welcome em {
    color: var(--support-green-gray);
    border-top-color: #2A2A2A;
}

/* Chat Input Improvements */
.MuiInputBase-root {
    background-color: var(--support-light-gray) !important;
    border: 1px solid var(--support-green-light) !important;
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
}

.MuiInputBase-root:hover {
    border-color: var(--secondary-medium) !important;
    background-color: white !important;
}

.MuiInputBase-root.Mui-focused {
    border-color: var(--primary-dark) !important;
    background-color: white !important;
    box-shadow: 0 0 0 3px rgba(0, 65, 50, 0.1) !important;
}

[data-theme="dark"] .MuiInputBase-root {
    background-color: var(--secondary-very-dark) !important;
    border-color: var(--secondary-dark-gray) !important;
}

[data-theme="dark"] .MuiInputBase-root:hover {
    border-color: var(--secondary-medium) !important;
    background-color: #1A3A36 !important;
}

[data-theme="dark"] .MuiInputBase-root.Mui-focused {
    border-color: var(--secondary-medium) !important;
    box-shadow: 0 0 0 3px rgba(21, 127, 103, 0.2) !important;
}

/* Buttons */
.MuiButton-containedPrimary {
    background-color: var(--primary-dark) !important;
    color: white !important;
    font-weight: 600 !important;
    transition: background-color 0.3s ease !important;
}

.MuiButton-containedPrimary:hover {
    background-color: var(--secondary-medium) !important;
}

/* Send button */
.MuiButtonBase-root.MuiIconButton-root[type="submit"] {
    color: var(--primary-dark) !important;
}

.MuiButtonBase-root.MuiIconButton-root[type="submit"]:hover {
    background-color: rgba(0, 65, 50, 0.1) !important;
}

[data-theme="dark"] .MuiButtonBase-root.MuiIconButton-root[type="submit"] {
    color: var(--secondary-medium) !important;
}

/* Accessibility Contrast Indicators */
.contrast-indicator {
    position: absolute;
    top: 10px;
    right: 10px;
    color: white;
    background: rgba(0, 0, 0, 0.5);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.8em;
}

/* ========== LOGIN PAGE CUSTOMIZATION ========== */

/* Login page container */
[data-testid="login-page"],
.MuiContainer-root:has([data-testid*="login"]) {
    background: linear-gradient(135deg, #f8faf9 0%, #e3f2e8 100%) !important;
    min-height: 100vh !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
}

/* Login card */
[data-testid="login-page"] > div,
.MuiPaper-root:has(button[aria-label*="Google"]) {
    background: white !important;
    border-radius: 16px !important;
    box-shadow: 0 8px 32px rgba(0, 65, 50, 0.12) !important;
    padding: 48px 40px !important;
    max-width: 420px !important;
    width: 100% !important;
    text-align: center !important;
    border: 1px solid rgba(0, 65, 50, 0.08) !important;
}

/* Add Ocati logo at top */
[data-testid="login-page"]::before,
.MuiPaper-root:has(button[aria-label*="Google"])::before {
    content: "";
    display: block;
    width: 80px;
    height: 80px;
    background: url('/public/favicon.jpg') no-repeat center;
    background-size: contain;
    margin: 0 auto 32px auto;
    border-radius: 50%;
}

/* Custom login title */
[data-testid="login-page"] h1,
.MuiPaper-root:has(button[aria-label*="Google"]) h1 {
    font-family: 'Inter', sans-serif !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #004132 !important;
    margin-bottom: 12px !important;
    letter-spacing: -0.02em !important;
}

/* Hide default title and show custom */
[data-testid="login-page"] h1:empty::after,
.MuiPaper-root:has(button[aria-label*="Google"]) h1:empty::after {
    content: "🌿 Accede a Ocati Analytics";
}

[data-testid="login-page"] h1:not(:empty) {
    display: none;
}

/* Add custom title if needed */
[data-testid="login-page"]:not(:has(h1))::after,
.MuiPaper-root:has(button[aria-label*="Google"]):not(:has(h1))::after {
    content: "🏠 Accede a Centinela Analytics";
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 28px;
    font-weight: 700;
    color: #004132;
    margin-bottom: 12px;
    letter-spacing: -0.02em;
}

/* Login subtitle */
[data-testid="login-page"] p,
.MuiPaper-root:has(button[aria-label*="Google"]) p {
    color: #64716d !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    margin-bottom: 32px !important;
    font-weight: 400 !important;
}

/* Hide default subtitle and show custom */
[data-testid="login-page"] p:empty::after,
.MuiPaper-root:has(button[aria-label*="Google"]) p:empty::after {
    content: "Conecta con Google para acceder a tu centro de inteligencia de negocios inmobiliarios";
}

/* Google login button */
[data-testid="login-page"] button,
.MuiPaper-root:has(button[aria-label*="Google"]) button {
    background: #004132 !important;
    color: white !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 16px 32px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    font-family: 'Inter', sans-serif !important;
    transition: all 0.3s ease !important;
    width: 100% !important;
    box-shadow: 0 4px 12px rgba(0, 65, 50, 0.2) !important;
}

[data-testid="login-page"] button:hover,
.MuiPaper-root:has(button[aria-label*="Google"]) button:hover {
    background: #2DE187 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(45, 225, 135, 0.3) !important;
}

[data-testid="login-page"] button:active,
.MuiPaper-root:has(button[aria-label*="Google"]) button:active {
    transform: translateY(0) !important;
}

/* Google icon styling */
[data-testid="login-page"] button svg,
.MuiPaper-root:has(button[aria-label*="Google"]) button svg {
    margin-right: 12px !important;
    width: 20px !important;
    height: 20px !important;
}

/* Footer text */
[data-testid="login-page"]::after,
.MuiPaper-root:has(button[aria-label*="Google"])::after {
    content: "Solo usuarios de Centinela pueden acceder";
    display: block;
    margin-top: 24px;
    color: #64716d;
    font-size: 14px;
    opacity: 0.8;
}

/* Dark mode support for login */
[data-theme="dark"] [data-testid="login-page"],
[data-theme="dark"] .MuiContainer-root:has([data-testid*="login"]) {
    background: linear-gradient(135deg, #1a1a1a 0%, #242e2c 100%) !important;
}

[data-theme="dark"] [data-testid="login-page"] > div,
[data-theme="dark"] .MuiPaper-root:has(button[aria-label*="Google"]) {
    background: #242424 !important;
    border-color: rgba(45, 225, 135, 0.2) !important;
}

[data-theme="dark"] [data-testid="login-page"] h1,
[data-theme="dark"] .MuiPaper-root:has(button[aria-label*="Google"]) h1 {
    color: #2DE187 !important;
}

[data-theme="dark"] [data-testid="login-page"] p,
[data-theme="dark"] .MuiPaper-root:has(button[aria-label*="Google"]) p {
    color: #bfcfcc !important;
}

/* Animation for login page */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

[data-testid="login-page"] > div,
.MuiPaper-root:has(button[aria-label*="Google"]) {
    animation: fadeInUp 0.6s ease-out !important;
}