/*@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";*/
@tailwind base;
@tailwind components;
@tailwind utilities;


/* Remove the conflicting overrides that prevent theme changes */
/* Comment out or remove this entire section: */
/*
html {
    color-scheme: light !important;
    forced-color-adjust: none !important;
}

* {
    forced-color-adjust: none !important;
}

body, body * {
    color: inherit !important;
    background-color: inherit !important;
}
*/

/* Keep only essential overrides without !important */
.table {
    color: inherit;
    background-color: inherit;
}

.btn {
    color: inherit;
    background-color: inherit;
}

/* Form elements styling */
input, select, textarea {
    color: inherit;
    background-color: inherit;
}

/* ===== Circuit reconnect modal ===== */
#components-reconnect-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(15, 23, 42, 0.75);
    align-items: center;
    justify-content: center;
}

    #components-reconnect-modal.components-reconnect-show,
    #components-reconnect-modal.components-reconnect-failed,
    #components-reconnect-modal.components-reconnect-rejected {
        display: flex;
    }

.aco-reconnect-card {
    background: #1e293b;
    color: #f1f5f9;
    border-radius: 12px;
    padding: 32px 40px;
    max-width: 340px;
    text-align: center;
    font-family: 'Inter', sans-serif;
}

.aco-reconnect-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 12px 0 4px;
}

.aco-reconnect-text {
    font-size: 0.9rem;
    color: #94a3b8;
}

.aco-reconnect-spinner {
    width: 36px;
    height: 36px;
    margin: 0 auto;
    border: 3px solid #334155;
    border-top-color: #f59e0b;
    border-radius: 50%;
    animation: aco-spin 0.9s linear infinite;
}

@keyframes aco-spin {
    to {
        transform: rotate(360deg);
    }
}
/* failure-only elements hidden while retrying */
.aco-reconnect-failed-text, .aco-reconnect-reload {
    display: none;
}

#components-reconnect-modal.components-reconnect-failed .aco-reconnect-failed-text,
#components-reconnect-modal.components-reconnect-failed .aco-reconnect-reload {
    display: block;
}

#components-reconnect-modal.components-reconnect-failed .aco-reconnect-spinner,
#components-reconnect-modal.components-reconnect-failed .aco-reconnect-text {
    display: none;
}

.aco-reconnect-reload {
    margin: 16px auto 0;
    background: #f59e0b;
    color: #0f172a;
    border: none;
    border-radius: 8px;
    padding: 10px 24px;
    font-weight: 600;
    cursor: pointer;
}

/* ===== Lighthouse beam keyframes =====
   Defined globally so animation-name resolves regardless of
   when the component's inline <style> block is parsed. */
@keyframes lh-rotate {
    from {
        transform: translateY(-50%) rotate(var(--lh-angle-from, 0deg));
    }

    to {
        transform: translateY(-50%) rotate(var(--lh-angle-to, 360deg));
    }
}

@keyframes lh-pulse {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.25);
    }
}
