:root{--bg:#07090c;--panel:#0d1117;--panel2:#11161d;--border:#242b35;--text:#f3f5f7;--muted:#8f9baa;--soft:#b7c0ca;--shadow:0 22px 70px rgba(0,0,0,.45)}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 20% 10%,rgba(255,255,255,.04),transparent 28%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{color:inherit}.shell{width:min(1180px,calc(100% - 36px));margin:0 auto}.site-header{display:flex;align-items:center;justify-content:space-between;min-height:76px;border-bottom:1px solid var(--border)}
.brand{display:flex;gap:10px;text-decoration:none;font-weight:800}.brand-mark,.terminal-body{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.nav{display:flex;gap:22px}.nav a{color:var(--muted);text-decoration:none;font-size:14px}.nav a:hover{color:white}
.hero{padding:76px 0 48px;display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}.eyebrow{color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.18em;margin-bottom:16px}
h1,h2,h3{letter-spacing:-.04em;margin-top:0}.hero h1{font-size:clamp(50px,7vw,88px);line-height:.95;margin-bottom:20px}.hero-copy,.section-copy{color:var(--soft);line-height:1.7}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.button,button{border:1px solid var(--text);border-radius:7px;padding:13px 18px;font:inherit;font-weight:750;cursor:pointer;text-decoration:none;background:var(--text);color:#090b0e}.button.secondary{background:transparent;color:var(--text);border-color:var(--border)}
.terminal{overflow:hidden;background:#090c10;border:1px solid var(--border);border-radius:13px;box-shadow:var(--shadow)}.terminal-head{display:flex;gap:7px;padding:13px;border-bottom:1px solid var(--border)}.dot{width:9px;height:9px;border-radius:50%;background:#434b56}.terminal-body{padding:22px;font-size:13px;line-height:1.9}
.page-section{padding:46px 0 80px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.event-card,.panel,.stat{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:22px}.event-card p,.muted{color:var(--muted)}.event-card .duration{font:700 12px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--soft);letter-spacing:.08em}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:grid;gap:7px;margin-bottom:15px}label{font-size:13px;color:var(--soft);font-weight:700}input,select,textarea{width:100%;border:1px solid var(--border);border-radius:7px;background:#090d12;color:var(--text);padding:12px 13px;font:inherit}textarea{min-height:110px}
.slot-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}.day-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.day{background:#0a0e13;border:1px solid var(--border);color:var(--text);padding:12px 8px;border-radius:8px;text-align:center;cursor:pointer}.day.active{border-color:#e7ebef}.day small{display:block;color:var(--muted)}
.slots{display:grid;gap:9px}.slot{width:100%;background:transparent;color:var(--text);border-color:var(--border)}.slot.selected{background:var(--text);color:#090b0e}
.admin-layout{display:grid;grid-template-columns:220px 1fr;gap:24px}.sidebar{border-right:1px solid var(--border);padding-right:18px}.sidebar a{display:block;text-decoration:none;color:var(--muted);padding:10px 0}.sidebar a:hover{color:white}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px}.stat strong{font-size:30px}table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:12px;border-bottom:1px solid var(--border);text-align:left}th{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.inline{display:flex;gap:8px;align-items:end}.footer{display:flex;justify-content:space-between;padding:25px 0 36px;border-top:1px solid var(--border);color:var(--muted);font-size:12px}
@media(max-width:850px){.hero,.slot-layout,.admin-layout{grid-template-columns:1fr}.grid,.stats{grid-template-columns:1fr}.day-grid{grid-template-columns:repeat(3,1fr)}.sidebar{border-right:0;border-bottom:1px solid var(--border);padding-bottom:14px}.nav{display:none}.form-grid{grid-template-columns:1fr}}


/* ==========================================================
   RICHMACKOS ADMIN LOGIN
   ========================================================== */

.login-page {
    min-height: calc(100vh - 140px);
    display: grid;
    align-items: center;
    padding: 70px 0 90px;
}

.login-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(380px, .75fr);
    gap: 80px;
    align-items: center;
}

.login-copy h1 {
    margin: 0 0 24px;
    font-size: clamp(62px, 8vw, 110px);
    line-height: .88;
    letter-spacing: -.065em;
}

.login-copy > p {
    max-width: 640px;
    color: var(--soft);
    line-height: 1.7;
    font-size: 17px;
}

.login-terminal {
    max-width: 560px;
    margin-top: 38px;
    overflow: hidden;
    background: #080b0f;
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.term-line {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    color: var(--muted);
}

.term-line span {
    color: var(--text);
}

.cursor {
    animation: richmack-blink 1s step-end infinite;
}

@keyframes richmack-blink {
    50% {
        opacity: 0;
    }
}

.login-card {
    position: relative;
    padding: 34px;
    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.018),
            transparent
        ),
        #0d1117;
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow:
        0 30px 90px rgba(0,0,0,.55);
}

.login-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: 16px;
    background:
        radial-gradient(
            circle at top right,
            rgba(255,255,255,.045),
            transparent 35%
        );
}

.login-card-header {
    position: relative;
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 30px;
}

.login-icon {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #080b0f;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Monaco,
        monospace;
    font-size: 20px;
}

.login-title {
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.035em;
}

.login-subtitle {
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
}

.login-card .field {
    position: relative;
    margin-bottom: 20px;
}

.login-card label {
    margin-bottom: 2px;
}

.login-card input {
    height: 50px;
    background: #080b0f;
    border: 1px solid #2a313b;
}

.login-card input:focus {
    border-color: #737d89;
    box-shadow:
        0 0 0 3px rgba(255,255,255,.035);
}

.login-button {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
    min-height: 50px;
    margin-top: 8px;
    padding: 0 17px;
    align-items: center;
}

.login-error {
    position: relative;
    display: grid;
    gap: 3px;
    margin-bottom: 22px;
    padding: 13px 15px;
    border: 1px solid #5c3034;
    border-radius: 8px;
    background: #160b0d;
    color: #efc1c5;
    font-size: 13px;
}

.login-error span {
    opacity: .72;
}

.login-security {
    position: relative;
    display: flex;
    gap: 9px;
    align-items: flex-start;
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
    color: var(--muted);
    font-size: 11px;
    line-height: 1.5;
}

.security-dot {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    margin-top: 4px;
    border-radius: 50%;
    background: #8b949e;
}

.nav-logout {
    margin: 0;
}

.nav-logout button {
    width: auto;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--muted);
    font-size: 14px;
    font-weight: 400;
}

.nav-logout button:hover {
    color: white;
    transform: none;
}


@media (max-width: 900px) {

    .login-shell {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .login-copy h1 {
        font-size: clamp(58px, 15vw, 90px);
    }

    .login-terminal {
        display: none;
    }

}


@media (max-width: 520px) {

    .login-page {
        padding-top: 40px;
    }

    .login-card {
        padding: 24px;
    }

}


/* RichmackOS FullCalendar */

.fc {
    --fc-border-color: #242b35;
    --fc-page-bg-color: transparent;
    --fc-neutral-bg-color: #0a0e13;
    --fc-list-event-hover-bg-color: #11161d;
    --fc-today-bg-color: rgba(255,255,255,.035);
}

.fc .fc-toolbar-title {
    font-size: 20px;
    letter-spacing: -.03em;
}

.fc .fc-button {
    background: #11161d;
    border: 1px solid #242b35;
    color: #f3f5f7;
    box-shadow: none;
}

.fc .fc-button:hover {
    background: #181e26;
}

.fc .fc-button-primary:not(:disabled).fc-button-active {
    background: #f3f5f7;
    color: #090b0e;
    border-color: #f3f5f7;
}

.fc .fc-col-header-cell-cushion,
.fc .fc-daygrid-day-number {
    color: #b7c0ca;
    text-decoration: none;
}

.fc .fc-event {
    background: #dfe5eb;
    border: 0;
    color: #090b0e;
    cursor: pointer;
    padding: 2px 4px;
}

.fc-theme-standard td,
.fc-theme-standard th {
    border-color: #242b35;
}



/* RichmackOS FullCalendar */

.fc {
    --fc-border-color: #242b35;
    --fc-page-bg-color: transparent;
    --fc-neutral-bg-color: #0a0e13;
    --fc-list-event-hover-bg-color: #11161d;
    --fc-today-bg-color: rgba(255,255,255,.035);
}

.fc .fc-toolbar-title {
    font-size: 20px;
    letter-spacing: -.03em;
}

.fc .fc-button {
    background: #11161d;
    border: 1px solid #242b35;
    color: #f3f5f7;
    box-shadow: none;
}

.fc .fc-button:hover {
    background: #181e26;
}

.fc .fc-button-primary:not(:disabled).fc-button-active {
    background: #f3f5f7;
    color: #090b0e;
    border-color: #f3f5f7;
}

.fc .fc-col-header-cell-cushion,
.fc .fc-daygrid-day-number {
    color: #b7c0ca;
    text-decoration: none;
}

.fc .fc-event {
    background: #dfe5eb;
    border: 0;
    color: #090b0e;
    cursor: pointer;
    padding: 2px 4px;
}

.fc-theme-standard td,
.fc-theme-standard th {
    border-color: #242b35;
}



/* RichmackOS FullCalendar */

.fc {
    --fc-border-color: #242b35;
    --fc-page-bg-color: transparent;
    --fc-neutral-bg-color: #0a0e13;
    --fc-list-event-hover-bg-color: #11161d;
    --fc-today-bg-color: rgba(255,255,255,.035);
}

.fc .fc-toolbar-title {
    font-size: 20px;
    letter-spacing: -.03em;
}

.fc .fc-button {
    background: #11161d;
    border: 1px solid #242b35;
    color: #f3f5f7;
    box-shadow: none;
}

.fc .fc-button:hover {
    background: #181e26;
}

.fc .fc-button-primary:not(:disabled).fc-button-active {
    background: #f3f5f7;
    color: #090b0e;
    border-color: #f3f5f7;
}

.fc .fc-col-header-cell-cushion,
.fc .fc-daygrid-day-number {
    color: #b7c0ca;
    text-decoration: none;
}

.fc .fc-event {
    background: #dfe5eb;
    border: 0;
    color: #090b0e;
    cursor: pointer;
    padding: 2px 4px;
}

.fc-theme-standard td,
.fc-theme-standard th {
    border-color: #242b35;
}



/* ==========================================================
   RICHMACKOS SCHEDULE — PREMIUM UI
   ========================================================== */

:root {
    --rm-bg-1: #05070b;
    --rm-bg-2: #090d15;
    --rm-bg-3: #0d1320;

    --rm-purple: #7857ff;
    --rm-purple-soft: #a692ff;

    --rm-blue: #3d8dff;
    --rm-cyan: #24d6d2;

    --rm-pink: #da58ff;

    --rm-card:
        rgba(14, 19, 31, .72);

    --rm-card-strong:
        rgba(18, 24, 38, .91);

    --rm-glass-border:
        rgba(255,255,255,.095);

    --rm-glass-highlight:
        rgba(255,255,255,.045);

    --rm-shadow:
        0 30px 100px
        rgba(0,0,0,.52);
}


/* ----- BACKGROUND ----- */

body {
    position: relative;
    isolation: isolate;

    background:
        radial-gradient(
            circle at 8% 5%,
            rgba(120,87,255,.20),
            transparent 31%
        ),

        radial-gradient(
            circle at 91% 18%,
            rgba(61,141,255,.14),
            transparent 29%
        ),

        radial-gradient(
            circle at 50% 95%,
            rgba(36,214,210,.08),
            transparent 30%
        ),

        linear-gradient(
            145deg,
            var(--rm-bg-1),
            var(--rm-bg-2) 46%,
            var(--rm-bg-3)
        );

    background-attachment:
        fixed;
}


body::before {
    content: "";

    position: fixed;
    z-index: -1;

    inset: 0;

    pointer-events: none;

    opacity: .28;

    background-image:
        linear-gradient(
            rgba(255,255,255,.015) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.015) 1px,
            transparent 1px
        );

    background-size:
        44px 44px;
}


body::after {
    content: "";

    position: fixed;
    z-index: -1;

    width: 600px;
    height: 600px;

    top: -300px;
    left: 50%;

    transform:
        translateX(-50%);

    border-radius:
        50%;

    pointer-events:
        none;

    background:
        rgba(120,87,255,.08);

    filter:
        blur(120px);
}


/* ----- HEADER ----- */

.site-header {
    position: sticky;

    top: 0;

    z-index: 50;

    min-height: 72px;

    border:
        1px solid transparent;

    border-bottom-color:
        rgba(255,255,255,.07);

    background:
        rgba(5,7,11,.70);

    backdrop-filter:
        blur(22px);

    -webkit-backdrop-filter:
        blur(22px);
}


.brand {
    font-size: 16px;

    letter-spacing:
        -.025em;
}


.brand-mark {
    display:
        grid;

    place-items:
        center;

    width: 32px;
    height: 32px;

    border:
        1px solid
        rgba(255,255,255,.10);

    border-radius:
        9px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.09),
            rgba(255,255,255,.02)
        );

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.08);
}


.nav a {
    position:
        relative;

    transition:
        color .18s ease;
}


.nav a::after {
    content: "";

    position:
        absolute;

    left:
        0;

    right:
        100%;

    bottom:
        -8px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            var(--rm-purple),
            var(--rm-cyan)
        );

    transition:
        right .18s ease;
}


.nav a:hover::after {
    right:
        0;
}


/* ----- TYPOGRAPHY ----- */

h1 {
    background:
        linear-gradient(
            115deg,
            #ffffff 10%,
            #dce4ff 53%,
            #b7c7ff
        );

    -webkit-background-clip:
        text;

    background-clip:
        text;

    color:
        transparent;

    text-wrap:
        balance;
}


.eyebrow {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    color:
        #aab6cf;
}


.eyebrow::before {
    content: "";

    width:
        22px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            var(--rm-purple),
            var(--rm-cyan)
        );
}


/* ----- HERO ----- */

.hero {
    position:
        relative;

    min-height:
        650px;
}


.hero h1 {
    text-shadow:
        0 15px 60px
        rgba(126,108,255,.08);
}


.hero-copy {
    max-width:
        650px;
}


/* ----- CARDS ----- */

.panel,
.event-card,
.stat,
.login-card,
.glass-card {

    position:
        relative;

    overflow:
        hidden;

    background:
        linear-gradient(
            145deg,
            rgba(20,27,43,.85),
            rgba(10,14,24,.72)
        );

    border:
        1px solid
        var(--rm-glass-border);

    box-shadow:
        var(--rm-shadow);

    backdrop-filter:
        blur(20px);

    -webkit-backdrop-filter:
        blur(20px);
}


.panel::before,
.event-card::before,
.stat::before,
.login-card::before,
.glass-card::before {

    content: "";

    position:
        absolute;

    pointer-events:
        none;

    inset:
        0;

    background:
        radial-gradient(
            circle at top right,
            rgba(120,87,255,.10),
            transparent 38%
        );
}


.event-card {
    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}


.event-card:hover {
    transform:
        translateY(-5px);

    border-color:
        rgba(166,146,255,.36);

    box-shadow:
        0 34px 110px
        rgba(0,0,0,.58),
        0 0 50px
        rgba(120,87,255,.07);
}


/* ----- BUTTONS ----- */

.button,
button {

    position:
        relative;

    overflow:
        hidden;

    border:
        1px solid
        rgba(255,255,255,.13);

    background:
        linear-gradient(
            115deg,
            #ffffff,
            #e0e6f0
        );

    color:
        #090d14;

    box-shadow:
        0 10px 30px
        rgba(0,0,0,.22);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        filter .18s ease;
}


.button:hover,
button:hover {

    transform:
        translateY(-2px);

    box-shadow:
        0 16px 40px
        rgba(0,0,0,.32);

    filter:
        brightness(1.06);
}


.button.secondary {

    background:
        rgba(255,255,255,.035);

    color:
        #e7ebf3;

    border-color:
        rgba(255,255,255,.11);
}


/* ----- FORMS ----- */

input,
select,
textarea {

    background:
        rgba(3,6,11,.54);

    border:
        1px solid
        rgba(255,255,255,.09);

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.025);

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}


input:hover,
select:hover,
textarea:hover {
    border-color:
        rgba(255,255,255,.16);
}


input:focus,
select:focus,
textarea:focus {

    border-color:
        rgba(132,111,255,.68);

    background:
        rgba(7,10,18,.78);

    box-shadow:
        0 0 0 4px
        rgba(120,87,255,.10),
        0 10px 35px
        rgba(0,0,0,.18);
}


/* ----- ADMIN ----- */

.admin-layout {
    grid-template-columns:
        245px minmax(0,1fr);

    gap:
        34px;
}


.sidebar {

    position:
        sticky;

    top:
        100px;

    align-self:
        start;

    padding:
        22px;

    border:
        1px solid
        rgba(255,255,255,.075);

    border-radius:
        16px;

    background:
        linear-gradient(
            155deg,
            rgba(20,27,43,.70),
            rgba(8,12,20,.62)
        );

    box-shadow:
        0 25px 70px
        rgba(0,0,0,.28);

    backdrop-filter:
        blur(18px);
}


.sidebar-brand {

    display:
        flex;

    align-items:
        center;

    gap:
        12px;

    padding-bottom:
        20px;

    margin-bottom:
        18px;

    border-bottom:
        1px solid
        rgba(255,255,255,.07);
}


.sidebar-icon {

    display:
        grid;

    place-items:
        center;

    width:
        38px;

    height:
        38px;

    border-radius:
        10px;

    background:
        linear-gradient(
            145deg,
            rgba(120,87,255,.26),
            rgba(61,141,255,.12)
        );

    border:
        1px solid
        rgba(161,145,255,.25);
}


.sidebar-brand strong {
    display:
        block;

    font-size:
        14px;
}


.sidebar-brand small {
    display:
        block;

    margin-top:
        3px;

    font-size:
        9px;

    letter-spacing:
        .15em;

    color:
        var(--muted);
}


.sidebar-section {
    margin-top:
        22px;
}


.sidebar-section > span {

    display:
        block;

    padding:
        0 10px 8px;

    color:
        #626e83;

    font-size:
        9px;

    letter-spacing:
        .16em;

    font-weight:
        800;
}


.sidebar a {

    display:
        flex;

    align-items:
        center;

    gap:
        10px;

    margin:
        3px 0;

    padding:
        10px 11px;

    border-radius:
        9px;

    transition:
        color .18s ease,
        background .18s ease,
        transform .18s ease;
}


.sidebar a b {

    width:
        17px;

    color:
        #7d899d;

    font-weight:
        500;

    text-align:
        center;
}


.sidebar a:hover {

    color:
        white;

    background:
        rgba(255,255,255,.045);

    transform:
        translateX(2px);
}


.sidebar a.active {

    color:
        white;

    background:
        linear-gradient(
            90deg,
            rgba(120,87,255,.17),
            rgba(61,141,255,.07)
        );

    border:
        1px solid
        rgba(134,113,255,.17);
}


.page-heading {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        flex-start;

    gap:
        24px;

    margin-bottom:
        28px;
}


.page-heading h1 {

    margin-bottom:
        8px;

    font-size:
        clamp(40px,5vw,62px);
}


.page-heading p {
    max-width:
        680px;

    color:
        var(--muted);

    line-height:
        1.6;
}


.status-pill {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    white-space:
        nowrap;

    padding:
        8px 12px;

    border:
        1px solid
        rgba(255,255,255,.09);

    border-radius:
        999px;

    background:
        rgba(255,255,255,.03);

    color:
        #aeb8c8;

    font-size:
        11px;
}


.status-pill span {

    width:
        7px;

    height:
        7px;

    border-radius:
        50%;

    background:
        #63e6a7;

    box-shadow:
        0 0 12px
        rgba(99,230,167,.65);
}


.settings-grid {

    display:
        grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:
        20px;
}


.glass-card {

    padding:
        26px;

    border-radius:
        16px;
}


.card-heading {

    display:
        flex;

    gap:
        14px;

    margin-bottom:
        24px;
}


.card-heading h2 {
    margin:
        0 0 4px;

    font-size:
        21px;
}


.card-heading p {

    margin:
        0;

    color:
        var(--muted);

    font-size:
        12px;

    line-height:
        1.5;
}


.card-icon {

    flex:
        0 0 auto;

    display:
        grid;

    place-items:
        center;

    width:
        42px;

    height:
        42px;

    border-radius:
        11px;

    background:
        linear-gradient(
            145deg,
            rgba(120,87,255,.22),
            rgba(61,141,255,.11)
        );

    border:
        1px solid
        rgba(146,127,255,.22);
}


.field-note {

    color:
        #68758a;

    font-size:
        10px;
}


/* ----- NOTICES ----- */

.notice {

    display:
        flex;

    gap:
        10px;

    margin-bottom:
        20px;

    padding:
        13px 15px;

    border-radius:
        10px;

    font-size:
        12px;
}


.notice.success {

    border:
        1px solid
        rgba(99,230,167,.22);

    background:
        rgba(42,145,94,.09);

    color:
        #aae9c6;
}


.notice.error {

    border:
        1px solid
        rgba(255,102,119,.22);

    background:
        rgba(181,52,67,.09);

    color:
        #ffc0c7;
}


/* ----- LOGIN ----- */

.login-card {
    border-color:
        rgba(147,129,255,.16);

    box-shadow:
        0 40px 130px
        rgba(0,0,0,.55),
        0 0 85px
        rgba(120,87,255,.06);
}


.login-terminal {
    border-color:
        rgba(255,255,255,.085);

    background:
        rgba(4,7,12,.72);

    backdrop-filter:
        blur(15px);
}


/* ----- CALENDAR ----- */

.fc {

    --fc-border-color:
        rgba(255,255,255,.075);

    --fc-today-bg-color:
        rgba(120,87,255,.075);

    --fc-neutral-bg-color:
        rgba(255,255,255,.025);
}


.fc .fc-button {

    border:
        1px solid
        rgba(255,255,255,.08);

    background:
        rgba(255,255,255,.035);

    color:
        #dce3ee;
}


.fc .fc-button-primary:not(:disabled).fc-button-active {

    border-color:
        rgba(151,133,255,.35);

    background:
        linear-gradient(
            120deg,
            rgba(120,87,255,.38),
            rgba(61,141,255,.23)
        );

    color:
        white;
}


.fc .fc-event {

    border:
        1px solid
        rgba(255,255,255,.13);

    border-radius:
        5px;

    background:
        linear-gradient(
            115deg,
            rgba(120,87,255,.88),
            rgba(61,141,255,.78)
        );

    color:
        white;

    box-shadow:
        0 5px 18px
        rgba(53,60,160,.25);
}


/* ----- STATS ----- */

.stat {

    padding:
        20px;

    border-radius:
        14px;
}


.stat strong {

    display:
        block;

    margin-top:
        8px;

    background:
        linear-gradient(
            120deg,
            white,
            #b9c9ff
        );

    -webkit-background-clip:
        text;

    background-clip:
        text;

    color:
        transparent;
}


/* ----- MOBILE ----- */

@media (max-width: 920px) {

    .settings-grid {
        grid-template-columns:
            1fr;
    }

    .admin-layout {
        grid-template-columns:
            1fr;
    }

    .sidebar {
        position:
            relative;

        top:
            auto;
    }

    .page-heading {
        flex-direction:
            column;
    }

}



/* ==========================================================
   APPOINTMENT APPROVAL WORKFLOW
   ========================================================== */

.workflow-badge {

    display:
        inline-flex;

    align-items:
        center;

    min-height:
        28px;

    padding:
        5px 10px;

    border-radius:
        999px;

    border:
        1px solid
        rgba(255,255,255,.11);

    background:
        rgba(255,255,255,.045);

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        .08em;

    text-transform:
        uppercase;
}


.status-requested {

    color:
        #ffd98a;

    border-color:
        rgba(255,201,92,.22);

    background:
        rgba(255,184,54,.07);
}


.status-approved {

    color:
        #98edbf;

    border-color:
        rgba(99,230,167,.25);

    background:
        rgba(44,195,119,.07);
}


.status-reschedule_requested {

    color:
        #b9c8ff;

    border-color:
        rgba(109,132,255,.25);

    background:
        rgba(85,100,230,.08);
}


.status-declined,
.status-cancelled {

    color:
        #ffb5bd;

    border-color:
        rgba(255,104,123,.24);

    background:
        rgba(210,59,79,.08);
}


.status-completed {

    color:
        #9be4e0;

    border-color:
        rgba(36,214,210,.24);

    background:
        rgba(36,214,210,.07);
}


.appointment-grid {

    display:
        grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:
        20px;
}


.info-list {

    display:
        grid;

    gap:
        15px;

    margin-top:
        20px;
}


.info-list div {

    padding-bottom:
        13px;

    border-bottom:
        1px solid
        rgba(255,255,255,.06);
}


.info-list span {

    display:
        block;

    margin-bottom:
        5px;

    color:
        var(--muted);

    font-size:
        10px;

    letter-spacing:
        .12em;

    text-transform:
        uppercase;
}


.info-list strong {

    font-size:
        14px;
}


.appointment-notes {

    color:
        var(--soft);

    line-height:
        1.75;

    white-space:
        pre-wrap;
}


.workflow-actions {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        10px;
}


.workflow-actions form {
    display:
        block;
}


.action-approve {

    background:
        linear-gradient(
            115deg,
            #85f0ba,
            #55d89a
        );

    color:
        #06110b;

    border-color:
        rgba(133,240,186,.35);
}


.button.danger {

    background:
        rgba(210,59,79,.08);

    color:
        #ffb0b9;

    border-color:
        rgba(255,92,111,.20);
}


.reschedule-box {

    display:
        none;

    margin-top:
        8px;
}


.reschedule-box.show {
    display:
        block;
}


.divider {

    height:
        1px;

    margin:
        28px 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.10),
            transparent
        );
}


.proposal-list {

    display:
        grid;

    gap:
        9px;

    margin-top:
        18px;
}


.proposal-row {

    display:
        flex;

    justify-content:
        space-between;

    gap:
        15px;

    padding:
        13px 14px;

    border:
        1px solid
        rgba(255,255,255,.075);

    border-radius:
        9px;

    background:
        rgba(255,255,255,.025);
}


.proposal-row span {

    color:
        var(--muted);

    font-size:
        10px;

    font-weight:
        800;
}


.client-status-box {

    margin:
        22px 0;

    padding:
        17px 18px;

    border:
        1px solid
        rgba(255,201,92,.17);

    border-radius:
        11px;

    background:
        linear-gradient(
            120deg,
            rgba(255,184,54,.07),
            rgba(255,255,255,.015)
        );
}


.client-status-box.approved {

    border-color:
        rgba(99,230,167,.18);

    background:
        linear-gradient(
            120deg,
            rgba(44,195,119,.07),
            rgba(255,255,255,.015)
        );
}


.client-status-box strong {

    display:
        block;

    margin-bottom:
        6px;
}


.client-status-box p {

    margin:
        0;

    color:
        var(--muted);

    font-size:
        13px;

    line-height:
        1.6;
}


.client-proposals {

    display:
        grid;

    gap:
        10px;
}


.proposal-button {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

    gap:
        18px;

    width:
        100%;

    background:
        linear-gradient(
            115deg,
            rgba(120,87,255,.12),
            rgba(61,141,255,.07)
        );

    color:
        white;

    border:
        1px solid
        rgba(135,116,255,.20);

    text-align:
        left;
}


.proposal-button span {

    font-size:
        13px;

    color:
        #dce4f0;
}


.proposal-button strong {

    white-space:
        nowrap;

    font-size:
        11px;
}


.appointment-link {

    color:
        #dce5ff;

    font-weight:
        700;

    text-decoration:
        none;
}


.appointment-link:hover {

    color:
        white;

    text-decoration:
        underline;
}


.approval-setting {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        25px;

    margin:
        22px 0;

    padding:
        18px;

    border:
        1px solid
        rgba(255,255,255,.075);

    border-radius:
        11px;

    background:
        rgba(255,255,255,.025);
}


.approval-setting p {

    margin:
        5px 0 0;

    color:
        var(--muted);

    font-size:
        11px;

    line-height:
        1.5;
}


.switch {

    position:
        relative;

    flex:
        0 0 auto;

    display:
        inline-block;

    width:
        48px;

    height:
        26px;
}


.switch input {

    width:
        0;

    height:
        0;

    opacity:
        0;
}


.slider {

    position:
        absolute;

    inset:
        0;

    cursor:
        pointer;

    border:
        1px solid
        rgba(255,255,255,.12);

    border-radius:
        999px;

    background:
        rgba(255,255,255,.07);

    transition:
        .2s ease;
}


.slider::before {

    content:
        "";

    position:
        absolute;

    width:
        18px;

    height:
        18px;

    left:
        3px;

    top:
        3px;

    border-radius:
        50%;

    background:
        #aab3c0;

    transition:
        .2s ease;
}


.switch input:checked + .slider {

    border-color:
        rgba(120,87,255,.40);

    background:
        linear-gradient(
            90deg,
            rgba(120,87,255,.45),
            rgba(61,141,255,.38)
        );
}


.switch input:checked + .slider::before {

    transform:
        translateX(22px);

    background:
        white;

    box-shadow:
        0 0 12px
        rgba(166,146,255,.40);
}


@media (max-width: 800px) {

    .appointment-grid {
        grid-template-columns:
            1fr;
    }

    .proposal-button {
        align-items:
            flex-start;

        flex-direction:
            column;
    }

}



/* ==========================================================
   LIVE LINUX TERMINAL STATUS
   ========================================================== */

.hero .terminal,
.login-terminal {
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(56, 255, 149, .045),
            transparent 35%
        ),
        #050807;

    border:
        1px solid rgba(105, 255, 170, .16);

    box-shadow:
        inset 0 0 40px rgba(0,0,0,.55),
        0 25px 80px rgba(0,0,0,.45),
        0 0 40px rgba(80,255,150,.035);
}


.hero .terminal::before,
.login-terminal::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    opacity: .12;

    background:
        repeating-linear-gradient(
            to bottom,
            rgba(255,255,255,.04) 0px,
            rgba(255,255,255,.04) 1px,
            transparent 1px,
            transparent 4px
        );

    animation:
        terminal-scan 8s linear infinite;
}


.hero .terminal::after,
.login-terminal::after {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background:
        radial-gradient(
            ellipse at center,
            transparent 48%,
            rgba(0,0,0,.35) 100%
        );
}


.terminal-body {
    position: relative;
    z-index: 2;

    color: #a9ffca;

    font-family:
        "SFMono-Regular",
        Menlo,
        Monaco,
        Consolas,
        "Liberation Mono",
        monospace;

    text-shadow:
        0 0 7px rgba(91,255,158,.25);

    animation:
        terminal-flicker 4.8s infinite;
}


.terminal-body > div:first-child {
    color: #d8ffe6;
}


.term-line,
.terminal-body .status-line {
    display: flex;
    justify-content: space-between;
    gap: 40px;

    color: #87cda2;
}


.term-line span,
.terminal-body .status-line span {
    color: #72ffad;

    font-weight: 700;

    text-shadow:
        0 0 8px rgba(80,255,145,.45);

    animation:
        terminal-status-pulse 1.7s ease-in-out infinite;
}


/* stagger the pulses so it looks alive */

.term-line:nth-of-type(2) span {
    animation-delay: .18s;
}

.term-line:nth-of-type(3) span {
    animation-delay: .36s;
}

.term-line:nth-of-type(4) span {
    animation-delay: .54s;
}

.term-line:nth-of-type(5) span {
    animation-delay: .72s;
}


.terminal-cursor,
.cursor {
    display: inline-block;

    width: .65em;
    height: 1.05em;

    margin-left: 4px;

    vertical-align: -2px;

    background: #70ffac;

    box-shadow:
        0 0 8px rgba(84,255,148,.75);

    animation:
        linux-cursor-blink .82s steps(1,end) infinite;
}


/* add cursor after terminal command if one isn't already in HTML */

.hero .terminal-body > div:first-child::after {
    content: " █";

    color: #72ffad;

    animation:
        linux-cursor-blink .82s steps(1,end) infinite;

    text-shadow:
        0 0 8px rgba(84,255,148,.7);
}


/* top terminal dots */

.terminal-head .dot {
    opacity: .75;
}

.terminal-head .dot:nth-child(1) {
    box-shadow:
        0 0 9px rgba(255,100,100,.25);
}

.terminal-head .dot:nth-child(2) {
    box-shadow:
        0 0 9px rgba(255,210,90,.25);
}

.terminal-head .dot:nth-child(3) {
    box-shadow:
        0 0 10px rgba(80,255,145,.38);
}


/* animation */

@keyframes linux-cursor-blink {
    0%,
    48% {
        opacity: 1;
    }

    49%,
    100% {
        opacity: 0;
    }
}


@keyframes terminal-status-pulse {
    0%,
    100% {
        opacity: .76;

        text-shadow:
            0 0 5px rgba(80,255,145,.28);
    }

    50% {
        opacity: 1;

        text-shadow:
            0 0 12px rgba(80,255,145,.68);
    }
}


@keyframes terminal-flicker {
    0%,
    19%,
    21%,
    23%,
    80%,
    100% {
        opacity: 1;
    }

    20% {
        opacity: .96;
    }

    22% {
        opacity: .985;
    }

    81% {
        opacity: .97;
    }
}


@keyframes terminal-scan {
    from {
        transform: translateY(-6px);
    }

    to {
        transform: translateY(6px);
    }
}


/* accessibility */

@media (prefers-reduced-motion: reduce) {

    .terminal-body,
    .term-line span,
    .terminal-cursor,
    .cursor,
    .hero .terminal-body > div:first-child::after,
    .hero .terminal::before {
        animation: none !important;
    }

}



/* ==========================================================
   LIVE LINUX TERMINAL STATUS
   ========================================================== */

.hero .terminal,
.login-terminal {
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(56, 255, 149, .045),
            transparent 35%
        ),
        #050807;

    border:
        1px solid rgba(105, 255, 170, .16);

    box-shadow:
        inset 0 0 40px rgba(0,0,0,.55),
        0 25px 80px rgba(0,0,0,.45),
        0 0 40px rgba(80,255,150,.035);
}


.hero .terminal::before,
.login-terminal::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    opacity: .12;

    background:
        repeating-linear-gradient(
            to bottom,
            rgba(255,255,255,.04) 0px,
            rgba(255,255,255,.04) 1px,
            transparent 1px,
            transparent 4px
        );

    animation:
        terminal-scan 8s linear infinite;
}


.hero .terminal::after,
.login-terminal::after {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background:
        radial-gradient(
            ellipse at center,
            transparent 48%,
            rgba(0,0,0,.35) 100%
        );
}


.terminal-body {
    position: relative;
    z-index: 2;

    color: #a9ffca;

    font-family:
        "SFMono-Regular",
        Menlo,
        Monaco,
        Consolas,
        "Liberation Mono",
        monospace;

    text-shadow:
        0 0 7px rgba(91,255,158,.25);

    animation:
        terminal-flicker 4.8s infinite;
}


.terminal-body > div:first-child {
    color: #d8ffe6;
}


.term-line,
.terminal-body .status-line {
    display: flex;
    justify-content: space-between;
    gap: 40px;

    color: #87cda2;
}


.term-line span,
.terminal-body .status-line span {
    color: #72ffad;

    font-weight: 700;

    text-shadow:
        0 0 8px rgba(80,255,145,.45);

    animation:
        terminal-status-pulse 1.7s ease-in-out infinite;
}


/* stagger the pulses so it looks alive */

.term-line:nth-of-type(2) span {
    animation-delay: .18s;
}

.term-line:nth-of-type(3) span {
    animation-delay: .36s;
}

.term-line:nth-of-type(4) span {
    animation-delay: .54s;
}

.term-line:nth-of-type(5) span {
    animation-delay: .72s;
}


.terminal-cursor,
.cursor {
    display: inline-block;

    width: .65em;
    height: 1.05em;

    margin-left: 4px;

    vertical-align: -2px;

    background: #70ffac;

    box-shadow:
        0 0 8px rgba(84,255,148,.75);

    animation:
        linux-cursor-blink .82s steps(1,end) infinite;
}


/* add cursor after terminal command if one isn't already in HTML */

.hero .terminal-body > div:first-child::after {
    content: " █";

    color: #72ffad;

    animation:
        linux-cursor-blink .82s steps(1,end) infinite;

    text-shadow:
        0 0 8px rgba(84,255,148,.7);
}


/* top terminal dots */

.terminal-head .dot {
    opacity: .75;
}

.terminal-head .dot:nth-child(1) {
    box-shadow:
        0 0 9px rgba(255,100,100,.25);
}

.terminal-head .dot:nth-child(2) {
    box-shadow:
        0 0 9px rgba(255,210,90,.25);
}

.terminal-head .dot:nth-child(3) {
    box-shadow:
        0 0 10px rgba(80,255,145,.38);
}


/* animation */

@keyframes linux-cursor-blink {
    0%,
    48% {
        opacity: 1;
    }

    49%,
    100% {
        opacity: 0;
    }
}


@keyframes terminal-status-pulse {
    0%,
    100% {
        opacity: .76;

        text-shadow:
            0 0 5px rgba(80,255,145,.28);
    }

    50% {
        opacity: 1;

        text-shadow:
            0 0 12px rgba(80,255,145,.68);
    }
}


@keyframes terminal-flicker {
    0%,
    19%,
    21%,
    23%,
    80%,
    100% {
        opacity: 1;
    }

    20% {
        opacity: .96;
    }

    22% {
        opacity: .985;
    }

    81% {
        opacity: .97;
    }
}


@keyframes terminal-scan {
    from {
        transform: translateY(-6px);
    }

    to {
        transform: translateY(6px);
    }
}


/* accessibility */

@media (prefers-reduced-motion: reduce) {

    .terminal-body,
    .term-line span,
    .terminal-cursor,
    .cursor,
    .hero .terminal-body > div:first-child::after,
    .hero .terminal::before {
        animation: none !important;
    }

}


/* ==========================================================
   RICHMACKOS LIVE TERMINAL
   ========================================================== */

.hero .terminal {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(55,255,140,.07),
            transparent 42%
        ),
        #040806;
    border: 1px solid rgba(91,255,154,.18);
    box-shadow:
        inset 0 0 50px rgba(0,0,0,.68),
        0 30px 90px rgba(0,0,0,.48),
        0 0 45px rgba(70,255,140,.04);
}

.hero .terminal::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    opacity: .12;

    background:
        repeating-linear-gradient(
            to bottom,
            rgba(255,255,255,.04) 0,
            rgba(255,255,255,.04) 1px,
            transparent 1px,
            transparent 4px
        );

    animation: rm-scan 8s linear infinite;
}

.hero .terminal::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;

    background:
        radial-gradient(
            ellipse at center,
            transparent 48%,
            rgba(0,0,0,.38) 100%
        );
}

.hero .terminal-body {
    position: relative;
    z-index: 2;

    font-family:
        "SFMono-Regular",
        Menlo,
        Monaco,
        Consolas,
        "Liberation Mono",
        monospace;

    color: #8dffb6;

    text-shadow:
        0 0 7px rgba(72,255,137,.32);

    animation:
        rm-terminal-flicker 5s infinite;
}

/* command line */
.hero .terminal-body > div:first-child {
    color: #d4ffe2;
}

/* status rows */
.hero .terminal-body > div:nth-of-type(n+2) {
    color: #75ee9e;
    letter-spacing: .02em;
    animation:
        rm-status-pulse 1.8s ease-in-out infinite;
}

/* staggered blinking */
.hero .terminal-body > div:nth-of-type(2) {
    animation-delay: 0s;
}

.hero .terminal-body > div:nth-of-type(3) {
    animation-delay: .22s;
}

.hero .terminal-body > div:nth-of-type(4) {
    animation-delay: .44s;
}

.hero .terminal-body > div:nth-of-type(5) {
    animation-delay: .66s;
}

/* Linux block cursor */
.hero .terminal-body::after {
    content: " █";
    color: #67ffa0;

    text-shadow:
        0 0 10px rgba(73,255,137,.85);

    animation:
        rm-cursor .78s steps(1,end) infinite;
}

@keyframes rm-cursor {
    0%, 48% {
        opacity: 1;
    }

    49%, 100% {
        opacity: 0;
    }
}

@keyframes rm-status-pulse {
    0%, 100% {
        opacity: .65;

        text-shadow:
            0 0 4px rgba(70,255,135,.22);
    }

    50% {
        opacity: 1;

        text-shadow:
            0 0 13px rgba(70,255,135,.7);
    }
}

@keyframes rm-terminal-flicker {
    0%, 18%, 20%, 22%, 80%, 100% {
        opacity: 1;
    }

    19% {
        opacity: .96;
    }

    21% {
        opacity: .985;
    }

    81% {
        opacity: .97;
    }
}

@keyframes rm-scan {
    from {
        transform: translateY(-7px);
    }

    to {
        transform: translateY(7px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero .terminal::before,
    .hero .terminal-body,
    .hero .terminal-body::after,
    .hero .terminal-body > div {
        animation: none !important;
    }
}