/* ===== KnowItOwl! — Shared Styles =====
   Used by index.html, privacy.html, support.html.
   The Tailwind theme/colors live in scripts/tailwind-config.js. */

/* ---- Glass effect (used by nav) ---- */
.glass {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}
.dark .glass {
    background: rgba(15, 23, 42, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* ---- Animations (landing page) ---- */
@keyframes float {
    0%   { transform: translateY(0px); }
    50%  { transform: translateY(-10px); }
    100% { transform: translateY(0px); }
}
.float-animation { animation: float 4s ease-in-out infinite; }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}
.animate-fade-in { animation: fadeIn 0.5s ease-out forwards; }

/* ---- Form focus / FAQ details (support page) ---- */
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: #6B8E7E;
    ring-color: #6B8E7E;
}
.faq-item summary::-webkit-details-marker { display: none; }

/* ---- Privacy page ---- */
.prose h2 { scroll-margin-top: 100px; }

/* ---- Print rules (legal/support pages) ---- */
@media print {
    .glass, #theme-toggle, nav, footer, #contact-form-section {
        display: none !important;
    }
    body {
        background: white !important;
        color: black !important;
    }
    .max-w-4xl {
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
}