/* Eagle Wings Digital Cards – shared theme */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=DM+Serif+Display&display=swap');

:root {
    /* Dashboard-inspired dark theme – surfaces */
    --bg-main: #1A1D2C;
    --bg-card: #212535;
    --bg-card-alt: #282C3F;
    --sig-bg: #1A1D2C;
    --sig-bg-end: #212535;
    /* Brand & accents */
    --brand-primary: #00BCD4;
    --brand-primary-light: #00C8F5;
    --brand-accent: #FFC107;
    --accent-cyan: #00BCD4;
    --accent-gold: #FFC107;
    --accent-red: #F44336;
    --accent-green: #4CAF50;
    --accent-purple: #9C27B0;
    /* Text – light theme (cards/forms) */
    --text-primary: #001a6e;
    --text-muted: #5a6c82;
    /* Text – dark theme */
    --text-primary-dark: #FFFFFF;
    --text-secondary-dark: #E0E0E0;
    --text-muted-dark: #A0A0A0;
    /* Light card (unchanged) */
    --card-bg: #f8fafc;
    --card-bg-end: #eef4fc;
    --font-heading: 'Plus Jakarta Sans', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-body: 'Plus Jakarta Sans', 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, sans-serif;
    --font-name: 'DM Serif Display', Georgia, serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    height: 100%;
    overflow: hidden;
}

body {
    font-family: var(--font-body);
    background: var(--bg-main);
    height: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
}

/* Scrollable main content – use on pages where body is fixed (no body scroll) */
.page-screen {
    height: 100vh;
    height: 100dvh;
    overflow: auto;
    padding: 20px;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 678px) {
    .page-screen {
        padding: 0px;
    }
}

body::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255,255,255, 0.04) 1px, transparent 1px);
    background-size: 50px 50px;
    animation: drift 60s linear infinite;
    pointer-events: none;
}

@keyframes drift {
    0% { transform: translate(0, 0); }
    100% { transform: translate(50px, 50px); }
}