@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;900&family=Share+Tech+Mono&display=swap');

/* ---------------------------------------------------------------------------
   Tema "Alien": verde neon su nero, un po' strano.

   Si appoggia a css\Themes\theme-modern.css: il body ha le classi theme-modern theme-alien
   (ApplyTheme in Scripts\common.js) e qui si ridefiniscono solo le variabili, più qualche
   effetto (bagliori, griglia di fondo, scanline, animazioni).
   Vale solo nelle pagine "themable" (ViewBag.BodyClass = "themable"), oggi Views\Profile\Index.cshtml.
   Le animazioni si fermano con prefers-reduced-motion.
   --------------------------------------------------------------------------- */

body.theme-modern.theme-alien {
    --brand: #39ff14;
    --brand-rgb: 57, 255, 20;
    --brand-dark: #2bd10f;
    --on-brand: #021a02;
    --on-brand-rgb: 2, 26, 2;
    --ink: #e6ffe9;
    --ink-hover: #0f2a16;
    --text: #b6ffbf;
    --muted: #5fa86c;
    --placeholder: #3f7a4a;
    --line: #15401f;
    --line-strong: #1f6b31;
    --line-hover: #39ff14;
    --surface: #06100a;
    --bg: #020603;
    --field-disabled: #0a1a0f;
    --success: #39ff14;
    --success-rgb: 57, 255, 20;
    --success-dark: #2bd10f;
    --danger: #ff3860;
    --danger-rgb: 255, 56, 96;
    --danger-dark: #d6284b;
    --warning: #ffcc00;
    --warning-rgb: 255, 204, 0;
    --warning-text: #ffcc00;
    --sensible: #ff9f1c;
    --hero-bg: radial-gradient(ellipse at 85% -20%, rgba(57, 255, 20, .35) 0%, rgba(57, 255, 20, 0) 55%), radial-gradient(ellipse at 10% 120%, rgba(0, 255, 213, .18) 0%, rgba(0, 255, 213, 0) 50%), linear-gradient(180deg, #010401 0%, #031107 100%);
    --hero-text: #d9ffe0;
    --hero-muted: rgba(185, 255, 195, .7);
    --hero-chip-bg: rgba(57, 255, 20, .08);
    --hero-chip-border: rgba(57, 255, 20, .35);
    --radius: 4px;
    --radius-sm: 3px;
    --shadow: 0 0 0 1px rgba(57, 255, 20, .12), 0 0 18px rgba(57, 255, 20, .07);
    --shadow-lg: 0 0 0 1px rgba(57, 255, 20, .3), 0 0 26px rgba(57, 255, 20, .18);
    --font: 'Share Tech Mono', 'Consolas', monospace;
    --heading-font: 'Orbitron', 'Share Tech Mono', sans-serif;
    --glow: 0 0 6px rgba(57, 255, 20, .75), 0 0 18px rgba(57, 255, 20, .35);
    /* The 6% of the modern formula is invisible on black: the same 14% as the hover of the .table
       rows below. Selected stays above the hover, as in theme-astro.css */
    --row-hover: rgba(57, 255, 20, .14);
    --row-selected: rgba(57, 255, 20, .24);
    --accent: #39ff14;
    --accent-rgb: 57, 255, 20;
    --chart-colors: #39ff14, #00ffd5, #ffcc00, #ff3860, #c77dff, #b6ff00, #4cc9f0, #ff8fab, #7fbf8a, #ff9f1c, #9ef01a, #f72585;
    --chart-slice-text: #021a02;
    /* Dotted grid on the background */
    background-image: radial-gradient(rgba(57, 255, 20, .07) 1px, transparent 1px);
    background-size: 22px 22px;
    scrollbar-color: #1f6b31 #020603;
}

    /* Scanlines over the whole page (no clicks) */
    body.theme-modern.theme-alien:after {
        content: "";
        position: fixed;
        inset: 0;
        z-index: 2000;
        pointer-events: none;
        background: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, .18) 3px);
        mix-blend-mode: multiply;
    }

    body.theme-modern.theme-alien ::selection {
        background: #39ff14;
        color: #000;
    }

    body.theme-modern.theme-alien ::-webkit-scrollbar {
        width: 10px;
        height: 10px;
        background: #020603;
    }

    body.theme-modern.theme-alien ::-webkit-scrollbar-thumb {
        background: #1f6b31;
        border-radius: 5px;
    }

/* ---- Accents: alien colors ---- */
body.theme-modern.theme-alien .accent-blue { --accent: #00ffd5; --accent-rgb: 0, 255, 213; }
body.theme-modern.theme-alien .accent-orange { --accent: #b6ff00; --accent-rgb: 182, 255, 0; }
body.theme-modern.theme-alien .accent-green { --accent: #39ff14; --accent-rgb: 57, 255, 20; }
body.theme-modern.theme-alien .accent-violet { --accent: #c77dff; --accent-rgb: 199, 125, 255; }
body.theme-modern.theme-alien .accent-slate { --accent: #7fbf8a; --accent-rgb: 127, 191, 138; }

/* Dashboard sections (css\Report\ReportDashboard.css): alien colors */
body.theme-modern.theme-alien .rd-accent-blue { --rd-accent: #00ffd5; --rd-accent-rgb: 0, 255, 213; }
body.theme-modern.theme-alien .rd-accent-orange { --rd-accent: #b6ff00; --rd-accent-rgb: 182, 255, 0; }
body.theme-modern.theme-alien .rd-accent-green { --rd-accent: #39ff14; --rd-accent-rgb: 57, 255, 20; }
body.theme-modern.theme-alien .rd-accent-violet { --rd-accent: #c77dff; --rd-accent-rgb: 199, 125, 255; }
body.theme-modern.theme-alien .rd-accent-neutral { --rd-accent: #7fbf8a; --rd-accent-rgb: 127, 191, 138; }

body.theme-modern.theme-alien .rd-title {
    letter-spacing: .08em;
    text-transform: uppercase;
    text-shadow: 0 0 12px rgba(57, 255, 20, .5);
}

body.theme-modern.theme-alien .rd-card:hover,
body.theme-modern.theme-alien .rd-card:focus {
    box-shadow: 0 0 0 1px var(--rd-accent), 0 0 18px rgba(var(--rd-accent-rgb), .45);
}

/* Objective sheet (css\Academy\SchedaObiettivi.css): dark sheet, neon accent */
body.theme-modern.theme-alien {
    --so-paper: #06100a;
    --so-ink: #b6ffbf;
    --so-line: #1f6b31;
    --so-input-bg: rgba(57, 255, 20, .1);
    --so-badge-bg: #39ff14;
    --so-badge-text: #000000;
}

body.theme-modern.theme-alien .scheda-obiettivi {
    box-shadow: 0 0 0 32px var(--so-paper), 0 0 0 33px rgba(57, 255, 20, .45), 0 0 60px rgba(57, 255, 20, .2);
}

    body.theme-modern.theme-alien .scheda-obiettivi h1 {
        letter-spacing: .06em;
        text-transform: uppercase;
        text-shadow: 0 0 10px rgba(57, 255, 20, .6);
    }

    /* Cover: the color logo is not readable on the dark sheet, the white one instead */
    body.theme-modern.theme-alien .scheda-obiettivi .cover > div > img {
        content: url("../../img/LogoOrbytaWhiteTransparent.png");
    }

    /* Cover frame: a light neon wash instead of the full green (40% of the accent) */
    body.theme-modern.theme-alien .scheda-obiettivi .cover {
        background-color: rgba(57, 255, 20, .08) !important;
        box-shadow: inset 0 0 60px rgba(57, 255, 20, .15);
    }

    body.theme-modern.theme-alien .scheda-obiettivi .cover > div > div.reserved {
        color: #000 !important;
        font-weight: bold;
    }

/* Dark title bars (floating panels, timesheet header: theme-modern-components.css): a green band, visible on the black page */
body.theme-modern.theme-alien {
    --ts-head-bg: #0f3a17;
    --ts-head-text: var(--brand);
    --ts-head-line: var(--line-strong);
}

/* ---- Header ---- */
body.theme-modern.theme-alien .profile-hero {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(57, 255, 20, .35);
}

    /* Scanning beam */
    body.theme-modern.theme-alien .profile-hero:after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -30%;
        width: 30%;
        pointer-events: none;
        background: linear-gradient(90deg, rgba(57, 255, 20, 0) 0%, rgba(57, 255, 20, .12) 50%, rgba(57, 255, 20, 0) 100%);
        animation: alien-scan 6s linear infinite;
    }

body.theme-modern.theme-alien .profile-hero-name {
    text-transform: uppercase;
    letter-spacing: .08em;
    text-shadow: 2px 0 rgba(255, 0, 200, .45), -2px 0 rgba(0, 255, 213, .45), 0 0 14px rgba(57, 255, 20, .6);
}

body.theme-modern.theme-alien .profile-hero-photo {
    border-color: #39ff14;
    box-shadow: var(--glow), 0 0 40px rgba(57, 255, 20, .25);
}

/* ---- Tabs ---- */
body.theme-modern.theme-alien .profile-tabs-bar {
    box-shadow: 0 1px 0 rgba(57, 255, 20, .25), 0 6px 18px rgba(0, 0, 0, .6);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .nav-tabs > li > a {
    font-family: var(--heading-font);
    font-size: 12px;
    letter-spacing: .06em;
    text-transform: uppercase;
}

body.theme-modern.theme-alien :is(.body-content, .modal) .nav-tabs > li.active > a,
body.theme-modern.theme-alien :is(.body-content, .modal) .nav-tabs > li.active > a:hover,
body.theme-modern.theme-alien :is(.body-content, .modal) .nav-tabs > li.active > a:focus {
    color: var(--accent);
    text-shadow: 0 0 8px rgba(var(--accent-rgb), .7);
    box-shadow: inset 0 -3px 0 var(--accent), 0 6px 14px -6px rgba(var(--accent-rgb), .8);
}

/* ---- Panels ---- */
body.theme-modern.theme-alien :is(.body-content, .modal) .panel {
    border-color: rgba(var(--accent-rgb), .28);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .panel > .panel-heading {
    color: var(--accent);
    font-size: 13px;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(var(--accent-rgb), .6);
}

    body.theme-modern.theme-alien :is(.body-content, .modal) .panel > .panel-heading:before {
        box-shadow: 0 0 10px var(--accent), 0 0 20px var(--accent);
        animation: alien-pulse 2.4s ease-in-out infinite;
    }

    body.theme-modern.theme-alien :is(.body-content, .modal) .panel > .panel-heading[onclick]:after {
        color: var(--accent);
    }

/* ---- Fields ---- */
body.theme-modern.theme-alien :is(.body-content, .modal) .form-control:focus {
    box-shadow: 0 0 0 1px var(--brand), 0 0 14px rgba(57, 255, 20, .45);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .label.label-dark {
    text-shadow: 0 0 6px rgba(var(--accent-rgb), .6);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .field-outlined > .label.label-dark,
body.theme-modern.theme-alien :is(.body-content, .modal) .field-outlined > label.label {
    text-shadow: none;
}

/* ---- Buttons: dark text on neon, glow on hover ---- */
body.theme-modern.theme-alien :is(.body-content, .modal) .btn {
    font-family: var(--heading-font);
    font-size: 12px;
    letter-spacing: .06em;
    text-transform: uppercase;
}

body.theme-modern.theme-alien :is(.body-content, .modal) .btn-primary:hover,
body.theme-modern.theme-alien :is(.body-content, .modal) .btn-success:hover {
    box-shadow: var(--glow);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .btn-dark,
body.theme-modern.theme-alien :is(.body-content, .modal) .btn-default {
    background-color: transparent;
    border-color: var(--line-strong);
    color: var(--brand);
}

    body.theme-modern.theme-alien :is(.body-content, .modal) .btn-dark:hover,
    body.theme-modern.theme-alien :is(.body-content, .modal) .btn-dark:focus,
    body.theme-modern.theme-alien :is(.body-content, .modal) .btn-default:hover,
    body.theme-modern.theme-alien :is(.body-content, .modal) .btn-default:focus {
        background-color: rgba(57, 255, 20, .08);
        border-color: var(--brand);
        color: var(--brand);
        box-shadow: var(--glow);
    }

body.theme-modern.theme-alien :is(.body-content, .modal) .btn-danger {
    color: #1a0006;
}

/* ---- Tables ---- */
body.theme-modern.theme-alien :is(.body-content, .modal) .table > thead > tr > th,
body.theme-modern.theme-alien :is(.body-content, .modal) .file-table th,
body.theme-modern.theme-alien :is(.body-content, .modal) .academy-table th,
body.theme-modern.theme-alien :is(.body-content, .modal) .objectives-table th,
body.theme-modern.theme-alien :is(.body-content, .modal) .uniqversity-rewards-table th,
body.theme-modern.theme-alien :is(.body-content, .modal) .rd-ai-tools-table th {
    background: #071a0c;
    color: var(--brand);
    text-shadow: 0 0 6px rgba(57, 255, 20, .5);
}

/* Row hover: the 4% wash of the modern theme is invisible on black. An overlay and never a color:
   a hovered row can hold both normal cells (light text on the dark surface) and light data cells
   with dark text (theme-modern-components.css, body.theme-dark), so no single color is right */
body.theme-modern.theme-alien :is(.body-content, .modal) .table > tbody > tr:hover > td,
body.theme-modern.theme-alien :is(.body-content, .modal) .file-table tr:hover td,
body.theme-modern.theme-alien :is(.body-content, .modal) .academy-table tbody tr:hover td,
body.theme-modern.theme-alien :is(.body-content, .modal) .objectives-table tbody tr:hover td,
body.theme-modern.theme-alien :is(.body-content, .modal) .uniqversity-rewards-table tbody tr:hover td {
    background-image: linear-gradient(rgba(57, 255, 20, .14), rgba(57, 255, 20, .14));   /* an overlay, as in theme-modern.css */
}

/* File type icons and other images: a bit of green */
body.theme-modern.theme-alien :is(.body-content, .modal) .file-table td > img,
body.theme-modern.theme-alien :is(.body-content, .modal) .event-card thead img {
    filter: grayscale(1) sepia(1) hue-rotate(65deg) saturate(4) brightness(1.1);
}

/* Black line icons (img\AssetType\*.svg): inverted, then green */
body.theme-modern.theme-alien :is(.body-content, .modal) .profile-asset-icon img {
    filter: invert(1) sepia(1) hue-rotate(65deg) saturate(6) drop-shadow(0 0 6px rgba(57, 255, 20, .6));
}

/* The charts (Google Charts, Chart.js) take the theme colors from their options:
   ApplyThemeToGoogleChartOptions / ApplyThemeToChartJsOptions in Scripts\common.js */

/* ---- Misc ---- */
body.theme-modern.theme-alien :is(.body-content, .modal) .badge {
    background-color: var(--line-strong);
    color: var(--ink);
}

/* Colored badges (e.g. the Uniqversity areas): alien colors, dark text */
body.theme-modern.theme-alien :is(.body-content, .modal) .badge-blue {
    background-color: #00ffd5;
    color: var(--on-brand);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .badge-orange {
    background-color: #b6ff00;
    color: var(--on-brand);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .badge-green {
    background-color: #39ff14;
    color: var(--on-brand);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .alert-info {
    border-color: rgba(var(--accent-rgb), .45);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .event-card:before {
    box-shadow: 0 0 0 3px var(--surface), 0 0 12px var(--accent);
}

body.theme-modern.theme-alien .profile-stat-bar > span {
    box-shadow: 0 0 10px var(--accent);
}

body.theme-modern.theme-alien .profile-stat-value {
    font-family: var(--heading-font);
    text-shadow: 0 0 10px rgba(57, 255, 20, .45);
}

body.theme-modern.theme-alien .annual-review-number {
    box-shadow: 0 0 10px var(--accent);
}

/* ---- Shared components (theme-modern-components.css) ---- */
body.theme-modern.theme-alien .modal-content {
    border-color: rgba(57, 255, 20, .45);
    box-shadow: 0 0 0 1px rgba(57, 255, 20, .25), 0 0 40px rgba(57, 255, 20, .25);
}

body.theme-modern.theme-alien .modal-header.modal-header-dark .modal-title {
    letter-spacing: .1em;
    text-transform: uppercase;
    text-shadow: 0 0 10px rgba(57, 255, 20, .7);
}

/* Waiting dialog: black, the astronaut gif (img\AstronautaSulRazzo.gif, opaque white background) as a green negative */
body.theme-modern.theme-alien #waiting-dialog .modal-body {
    background-color: #000;
}

    body.theme-modern.theme-alien #waiting-dialog .modal-body img {
        filter: invert(1) hue-rotate(180deg) sepia(.35) hue-rotate(55deg) saturate(1.6);
    }

body.theme-modern.theme-alien .notify-popup-div {
    background-color: #06100a;
    color: var(--text);
    box-shadow: 0 0 18px rgba(57, 255, 20, .35);
}

body.theme-modern.theme-alien :is(.body-content, .modal) .table-small mark {
    background-color: #39ff14;
    color: #000;
}

body.theme-modern.theme-alien .datepicker.datepicker-dropdown,
body.theme-modern.theme-alien .context-menu {
    border-color: rgba(57, 255, 20, .45);
    box-shadow: 0 0 22px rgba(57, 255, 20, .25);
}

/* Leaflet map (Views\Resources\FaceWall.cshtml): OpenStreetMap tiles turned into a dark green map */
body.theme-modern.theme-alien .leaflet-tile-pane {
    filter: invert(1) hue-rotate(180deg) brightness(.8) contrast(1.1) sepia(.35) hue-rotate(55deg) saturate(1.6);
}


/* ---- Top bar, side menu, footer (rules in theme-modern-components.css): black and neon ---- */
body.theme-modern.theme-alien {
    --chrome-bg: #020603;
    --chrome-bar-bg: #020603;
    --chrome-bg-2: #010301;
    --chrome-border: #15401f;
    --chrome-text: #5fa86c;
    --chrome-text-active: #39ff14;
    --chrome-hover-bg: rgba(57, 255, 20, .08);
    --chrome-active-bg: rgba(57, 255, 20, .1);
    --chrome-accent: #39ff14;
    --chrome-header-font: var(--heading-font);
    --chrome-popup-bg: #06100a;
    --chrome-popup-text: #b6ffbf;
    --chrome-popup-border: #1f6b31;
}

body.theme-modern.theme-alien .top-bar {
    box-shadow: 0 1px 0 rgba(57, 255, 20, .25), 0 0 18px rgba(57, 255, 20, .12);
}

body.theme-modern.theme-alien :is(.side-menu-list > li.active > a, .side-menu-list a:hover) {
    text-shadow: 0 0 8px rgba(57, 255, 20, .7);
}

/* The monospaced font is wider: a bit smaller, the items fit the 220px menu */
body.theme-modern.theme-alien .side-menu-list a {
    font-size: 12.5px;
}

body.theme-modern.theme-alien .userMenu {
    box-shadow: 0 0 22px rgba(57, 255, 20, .25);
}

/* ---- Animations ---- */
@keyframes alien-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .35; }
}

@keyframes alien-scan {
    from { transform: translateX(0); }
    to { transform: translateX(440%); }
}

@media (prefers-reduced-motion: reduce) {
    body.theme-modern.theme-alien .profile-hero:after,
    body.theme-modern.theme-alien :is(.body-content, .modal) .panel > .panel-heading:before {
        animation: none;
    }
}