:root {
    --fs-bg: #070809;
    --fs-bg-soft: #0b0d10;
    --fs-panel: #101217;
    --fs-panel-2: #15181e;
    --fs-panel-3: #0c0e12;

    --fs-red: #ff1e2d;
    --fs-red-bright: #ff4f5c;
    --fs-red-deep: #7d1019;
    --fs-red-soft: rgba(255, 30, 45, .10);
    --fs-red-glow: rgba(255, 30, 45, .30);

    --fs-text: #f5f7fa;
    --fs-muted: #99a2ad;
    --fs-dim: #5f6872;

    --fs-line: rgba(255,255,255,.07);
    --fs-line-red: rgba(255,30,45,.18);

    --fs-success: #45d58b;
    --fs-warning: #f1b64c;
    --fs-danger: #ff5b67;
    --fs-info: #68a9ff;

    --fs-sidebar: 274px;
    --fs-sidebar-collapsed: 78px;

    --fs-radius: 14px;
    --fs-shadow: 0 18px 55px rgba(0,0,0,.36);

    --fs-font: Inter, "Segoe UI", Arial, sans-serif;
    --fs-mono: "Share Tech Mono", Consolas, monospace;
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    min-height: 100%;
    background: var(--fs-bg);
    color: var(--fs-text);
    font-family: var(--fs-font);
}

body {
    background-image:
        linear-gradient(rgba(255,30,45,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,30,45,.045) 1px, transparent 1px);
    background-size: 42px 42px;
    background-attachment: fixed;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(900px 520px at 82% 0%, rgba(110, 8, 16, .34), transparent 64%),
        radial-gradient(720px 500px at 8% 100%, rgba(255, 30, 45, .08), transparent 70%);
    z-index: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font: inherit;
}

button {
    color: inherit;
}

.fs-app {
    position: relative;
    z-index: 1;
    min-height: 100vh;
    display: grid;
    grid-template-columns: var(--fs-sidebar) minmax(0, 1fr);
    transition: grid-template-columns .35s ease;
}

.fs-app.is-collapsed {
    grid-template-columns: var(--fs-sidebar-collapsed) minmax(0, 1fr);
}

/* =========================
   SIDEBAR
========================= */

.fs-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: linear-gradient(180deg, rgba(13,14,17,.98), rgba(7,8,10,.98));
    border-right: 1px solid var(--fs-red-deep);
    box-shadow: 8px 0 34px rgba(0,0,0,.30);
}

.fs-sidebar::after {
    content: "";
    position: absolute;
    top: 0;
    right: -1px;
    bottom: 0;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--fs-red), transparent);
    opacity: .48;
}

.fs-brand {
    min-height: 92px;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 17px 15px;
    border-bottom: 1px solid var(--fs-line-red);
}

.fs-logo-toggle {
    width: 49px;
    height: 49px;
    flex: 0 0 49px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 12px;
    background: transparent;
    cursor: pointer;
    transition: background .2s ease;
}

.fs-logo-toggle:hover {
    background: var(--fs-red-soft);
}

.fs-logo {
    width: 47px;
    height: 47px;
    object-fit: contain;
    filter: drop-shadow(0 0 10px rgba(255,30,45,.55));
    transition: transform .5s ease;
}

.fs-app.is-collapsed .fs-logo {
    transform: rotate(360deg);
}

.fs-brand-copy {
    min-width: 0;
    white-space: nowrap;
    transition: opacity .2s ease, transform .2s ease;
}

.fs-app.is-collapsed .fs-brand-copy {
    opacity: 0;
    transform: translateX(-8px);
    pointer-events: none;
}

.fs-brand-name {
    font-family: var(--fs-mono);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 2.2px;
}

.fs-brand-name span {
    color: var(--fs-red);
}

.fs-brand-tag {
    margin-top: 4px;
    color: var(--fs-dim);
    font-family: var(--fs-mono);
    font-size: 9px;
    letter-spacing: 1.8px;
}

.fs-soc-line {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 13px 17px;
    border-bottom: 1px solid var(--fs-line-red);
    color: var(--fs-muted);
    font-family: var(--fs-mono);
    font-size: 11px;
    white-space: nowrap;
}

.fs-pulse {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: var(--fs-red);
    box-shadow: 0 0 10px var(--fs-red-glow);
    animation: fsPulse 1.7s ease-in-out infinite;
}

@keyframes fsPulse {
    50% {
        opacity: .35;
        transform: scale(.78);
    }
}

.fs-hide-on-collapse {
    transition: opacity .2s ease;
}

.fs-app.is-collapsed .fs-hide-on-collapse {
    opacity: 0;
    pointer-events: none;
}

.fs-nav {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 14px 11px;
    overflow-y: auto;
}

.fs-nav-link {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: var(--fs-muted);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    transition: color .18s ease, background .18s ease, border-color .18s ease;
}

.fs-nav-link:hover {
    color: #fff;
    background: var(--fs-red-soft);
    border-color: var(--fs-line-red);
}

.fs-nav-link.active {
    color: #fff;
    background: linear-gradient(90deg, rgba(255,30,45,.18), rgba(255,30,45,.025));
    border-color: rgba(255,30,45,.28);
    box-shadow: inset 3px 0 0 var(--fs-red);
}

.fs-nav-link svg {
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
}

.fs-nav-label {
    transition: opacity .2s ease;
}

.fs-app.is-collapsed .fs-nav-label {
    opacity: 0;
}

.fs-nav-badge {
    margin-left: auto;
    padding: 2px 7px;
    border: 1px solid var(--fs-red-deep);
    border-radius: 999px;
    background: var(--fs-red-soft);
    color: var(--fs-red-bright);
    font: 10px var(--fs-mono);
}

.fs-app.is-collapsed .fs-nav-badge {
    display: none;
}

.fs-sidebar-user {
    padding: 15px 16px 18px;
    border-top: 1px solid var(--fs-line-red);
}

.fs-sidebar-user-name {
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.fs-sidebar-user-role {
    margin-top: 4px;
    color: var(--fs-dim);
    font: 10px var(--fs-mono);
    text-transform: uppercase;
}

.fs-logout {
    width: 100%;
    margin-top: 12px;
    padding: 9px 10px;
    border: 1px solid var(--fs-line-red);
    border-radius: 9px;
    background: rgba(255,30,45,.04);
    color: var(--fs-muted);
    text-align: left;
    cursor: pointer;
    transition: .18s ease;
}

.fs-logout:hover {
    color: #fff;
    border-color: var(--fs-red-deep);
    background: var(--fs-red-soft);
}

/* =========================
   MAIN / TOPBAR
========================= */

.fs-main {
    min-width: 0;
}

.fs-topbar {
    position: sticky;
    top: 0;
    z-index: 10;
    min-height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 0 28px;
    border-bottom: 1px solid var(--fs-line-red);
    background: rgba(7,8,9,.80);
    backdrop-filter: blur(14px);
}

.fs-topbar-title {
    color: var(--fs-muted);
    font: 12px var(--fs-mono);
    letter-spacing: 1px;
}

.fs-topbar-title strong {
    color: #fff;
}

.fs-topbar-right {
    display: flex;
    align-items: center;
    gap: 14px;
}

.fs-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 11px;
    border: 1px solid var(--fs-line-red);
    border-radius: 999px;
    background: rgba(255,30,45,.05);
    color: var(--fs-red-bright);
    font: 10px var(--fs-mono);
    letter-spacing: 1px;
}

.fs-clock {
    color: var(--fs-muted);
    font: 12px var(--fs-mono);
}

/* =========================
   CONTENT
========================= */

.fs-page {
    padding: 30px;
}

.fs-page-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.fs-eyebrow {
    margin-bottom: 8px;
    color: var(--fs-red);
    font: 11px var(--fs-mono);
    letter-spacing: 2.6px;
    text-transform: uppercase;
}

.fs-page-title {
    margin: 0;
    font-family: var(--fs-mono);
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1;
    letter-spacing: .5px;
}

.fs-page-subtitle {
    max-width: 720px;
    margin-top: 12px;
    color: var(--fs-muted);
    font-size: 14px;
    line-height: 1.6;
}

.fs-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 14px;
    margin-bottom: 22px;
}

.fs-kpi {
    position: relative;
    overflow: hidden;
    padding: 20px;
    border: 1px solid var(--fs-line-red);
    border-radius: var(--fs-radius);
    background: linear-gradient(180deg, rgba(18,20,25,.95), rgba(11,13,17,.95));
    box-shadow: var(--fs-shadow);
}

.fs-kpi::after {
    content: "";
    position: absolute;
    right: -35px;
    bottom: -45px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,30,45,.14), transparent 68%);
}

.fs-kpi-label {
    color: var(--fs-dim);
    font: 10px var(--fs-mono);
    letter-spacing: 1.3px;
    text-transform: uppercase;
}

.fs-kpi-value {
    margin-top: 9px;
    color: #fff;
    font: 31px var(--fs-mono);
    text-shadow: 0 0 16px rgba(255,30,45,.18);
}

.fs-kpi-value.red {
    color: var(--fs-red-bright);
}

.fs-kpi-foot {
    margin-top: 8px;
    color: var(--fs-muted);
    font-size: 11px;
}

.fs-grid-2 {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 18px;
}

.fs-panel {
    overflow: hidden;
    border: 1px solid var(--fs-line-red);
    border-radius: var(--fs-radius);
    background: rgba(15,17,22,.94);
    box-shadow: var(--fs-shadow);
}

.fs-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--fs-line);
}

.fs-panel-title {
    display: flex;
    align-items: center;
    gap: 9px;
    font: 12px var(--fs-mono);
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.fs-panel-body {
    padding: 18px;
}

.fs-table-wrap {
    overflow-x: auto;
}

.fs-table {
    width: 100%;
    border-collapse: collapse;
}

.fs-table th,
.fs-table td {
    padding: 13px 14px;
    border-bottom: 1px solid var(--fs-line);
    text-align: left;
    white-space: nowrap;
}

.fs-table th {
    color: var(--fs-dim);
    font: 10px var(--fs-mono);
    letter-spacing: 1.1px;
    text-transform: uppercase;
}

.fs-table td {
    color: #e9edf2;
    font-size: 12px;
}

.fs-table tr:last-child td {
    border-bottom: 0;
}

.fs-table tr:hover td {
    background: rgba(255,30,45,.035);
}

.fs-link {
    color: #fff;
    font-weight: 700;
}

.fs-link:hover {
    color: var(--fs-red-bright);
}

.fs-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 9px;
    border-radius: 999px;
    font: 10px var(--fs-mono);
    letter-spacing: .5px;
}

.fs-badge.success {
    color: #8ef0bb;
    background: rgba(69,213,139,.10);
    border: 1px solid rgba(69,213,139,.24);
}

.fs-badge.warning {
    color: #ffd083;
    background: rgba(241,182,76,.10);
    border: 1px solid rgba(241,182,76,.24);
}

.fs-badge.danger {
    color: #ff9aa2;
    background: rgba(255,91,103,.10);
    border: 1px solid rgba(255,91,103,.24);
}

.fs-badge.info {
    color: #9fc8ff;
    background: rgba(104,169,255,.10);
    border: 1px solid rgba(104,169,255,.24);
}

.fs-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fs-list-item {
    padding: 13px 14px;
    border: 1px solid var(--fs-line);
    border-radius: 11px;
    background: rgba(255,255,255,.015);
}

.fs-list-item-title {
    font-size: 12px;
    font-weight: 700;
}

.fs-list-item-meta {
    margin-top: 4px;
    color: var(--fs-dim);
    font: 10px var(--fs-mono);
}

.fs-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.fs-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 10px 14px;
    border: 1px solid var(--fs-line-red);
    border-radius: 10px;
    background: rgba(255,30,45,.045);
    color: #fff;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    transition: .18s ease;
}

.fs-btn:hover {
    transform: translateY(-1px);
    border-color: var(--fs-red);
    box-shadow: 0 0 20px rgba(255,30,45,.12);
}

.fs-btn.primary {
    border-color: var(--fs-red);
    background: var(--fs-red);
    color: #09090a;
}

.fs-btn.success {
    border-color: rgba(69,213,139,.45);
    background: rgba(69,213,139,.12);
    color: #91efba;
}

.fs-btn.warning {
    border-color: rgba(241,182,76,.45);
    background: rgba(241,182,76,.12);
    color: #ffd083;
}

.fs-btn.danger {
    border-color: rgba(255,91,103,.48);
    background: rgba(255,91,103,.12);
    color: #ff9da5;
}

.fs-state-box {
    padding: 18px;
    border: 1px solid var(--fs-line-red);
    border-radius: var(--fs-radius);
    background: rgba(255,255,255,.018);
}

.fs-state-box.active {
    border-color: rgba(69,213,139,.30);
    background: rgba(69,213,139,.06);
}

.fs-state-box.maintenance {
    border-color: rgba(241,182,76,.34);
    background: rgba(241,182,76,.06);
}

.fs-state-box.pending {
    border-color: rgba(104,169,255,.34);
    background: rgba(104,169,255,.06);
}

.fs-state-title {
    font-family: var(--fs-mono);
    font-size: 13px;
    letter-spacing: 1px;
}

.fs-state-text {
    margin-top: 7px;
    color: var(--fs-muted);
    font-size: 12px;
    line-height: 1.55;
}

.fs-info-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
}

.fs-info {
    padding: 14px;
    border: 1px solid var(--fs-line);
    border-radius: 11px;
    background: rgba(255,255,255,.016);
}

.fs-info-label {
    color: var(--fs-dim);
    font: 10px var(--fs-mono);
    letter-spacing: 1px;
    text-transform: uppercase;
}

.fs-info-value {
    margin-top: 6px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    word-break: break-word;
}

.fs-login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 28px;
}

.fs-login-card {
    width: min(440px, 100%);
    padding: 30px;
    border: 1px solid var(--fs-line-red);
    border-radius: 18px;
    background: rgba(15,17,22,.96);
    box-shadow: 0 20px 70px rgba(0,0,0,.48);
}

.fs-login-brand {
    text-align: center;
    margin-bottom: 24px;
}

.fs-login-brand img {
    width: 112px;
    filter: drop-shadow(0 0 16px rgba(255,30,45,.35));
}

.fs-form-label {
    display: block;
    margin: 15px 0 7px;
    color: var(--fs-muted);
    font-size: 12px;
}

.fs-input {
    width: 100%;
    padding: 12px 13px;
    border: 1px solid var(--fs-line-red);
    border-radius: 10px;
    outline: none;
    background: var(--fs-panel-3);
    color: #fff;
}

.fs-input:focus {
    border-color: var(--fs-red);
    box-shadow: 0 0 0 3px rgba(255,30,45,.07);
}

.fs-alert {
    margin-top: 15px;
    padding: 12px 13px;
    border-radius: 10px;
    font-size: 12px;
}

.fs-alert.error {
    border: 1px solid rgba(255,91,103,.26);
    background: rgba(255,91,103,.10);
    color: #ffacb2;
}

.fs-empty {
    padding: 28px;
    color: var(--fs-muted);
    text-align: center;
}

.fs-footer {
    padding: 22px 30px 30px;
    color: var(--fs-dim);
    font: 10px var(--fs-mono);
    letter-spacing: 1px;
}


/* =========================================================
   FOXSHIELD SOC DASHBOARD V2
   Layout operativo / riferimento dashboard SOC
========================================================= */

:root {
    --fs-sidebar: 238px;
    --fs-sidebar-collapsed: 76px;

    --fs-bg: #050709;
    --fs-panel: #090d12;
    --fs-panel-2: #0c1117;

    --fs-line: rgba(255,255,255,.075);
    --fs-line-red: rgba(255,30,45,.22);

    --fs-radius: 11px;
}


/* ---------- APP ---------- */

.fs-app {
    grid-template-columns:
        var(--fs-sidebar)
        minmax(0, 1fr);

    transition:
        grid-template-columns
        .5s cubic-bezier(.77,0,.18,1);
}

.fs-app.is-collapsed {
    grid-template-columns:
        var(--fs-sidebar-collapsed)
        minmax(0, 1fr);
}


/* ---------- SIDEBAR ---------- */

.fs-sidebar {
    background:
        radial-gradient(
            circle at 30% 0%,
            rgba(255,30,45,.07),
            transparent 32%
        ),
        linear-gradient(
            180deg,
            #070a0e 0%,
            #050709 100%
        );

    border-right:
        1px solid rgba(255,30,45,.26);

    box-shadow:
        8px 0 35px rgba(0,0,0,.55);
}

.fs-sidebar::after {
    opacity: .75;

    animation:
        fsSidebarEdge 4s
        ease-in-out infinite;
}

@keyframes fsSidebarEdge {
    0%,
    100% {
        opacity: .25;
    }

    50% {
        opacity: .85;
    }
}


/* ---------- LOGO / BRAND ---------- */

.fs-brand {
    min-height: 88px;

    gap: 10px;

    padding:
        13px 13px;

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

.fs-logo-toggle {
    width: 54px;
    height: 54px;

    flex:
        0 0 54px;

    border-radius: 10px;

    position: relative;
}

.fs-logo-toggle::before {
    content: "";

    position: absolute;

    inset: -5px;

    border-radius: 12px;

    background:
        radial-gradient(
            circle,
            rgba(255,30,45,.25),
            transparent 70%
        );

    opacity: 0;

    transition:
        opacity .25s ease;
}

.fs-logo-toggle:hover::before {
    opacity: 1;
}

.fs-logo {
    position: relative;

    width: 53px;
    height: 53px;

    object-fit: contain;

    filter:
        drop-shadow(
            0 0 9px
            rgba(255,30,45,.55)
        );

    transition:
        transform
        .7s cubic-bezier(.65,0,.15,1),
        filter .25s ease;
}

/*
 * NON TOGLIERE.
 * È la rotazione del logo quando
 * la navbar viene chiusa.
 */
.fs-app.is-collapsed .fs-logo {
    transform: rotate(360deg);
}

.fs-brand-copy {
    transition:
        opacity .3s ease .08s,
        transform .35s ease .08s;
}

.fs-brand-name {
    font-size: 19px;

    letter-spacing: 1.2px;

    font-family: var(--fs-font);

    font-weight: 800;
}

.fs-brand-name span {
    color: var(--fs-red);
}

.fs-brand-tag {
    margin-top: 2px;

    font-size: 8px;

    letter-spacing: .5px;

    color: #d3d6da;
}


/* ---------- SOC STATUS ---------- */

.fs-soc-line {
    padding:
        12px 17px;

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

    font-size: 10px;

    color: #aab1ba;
}


/* ---------- NAV ---------- */

.fs-nav {
    padding:
        15px 13px;

    gap: 4px;
}

.fs-nav-link {
    min-height: 47px;

    padding:
        11px 12px;

    border-radius: 8px;

    font-size: 13px;

    color: #d0d5dc;

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

.fs-nav-link:hover {
    color: #fff;

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

    border-color:
        rgba(255,30,45,.16);
}

.fs-nav-link.active {
    color: #fff;

    background:
        linear-gradient(
            90deg,
            rgba(255,30,45,.20),
            rgba(80,10,15,.24)
        );

    border-color:
        rgba(255,30,45,.34);

    box-shadow:
        inset 3px 0 0 var(--fs-red),
        0 0 22px rgba(255,30,45,.09);
}

.fs-nav-link svg {
    width: 20px;
    height: 20px;

    flex:
        0 0 20px;
}


/* ---------- TOP BAR ---------- */

.fs-topbar {
    min-height: 62px;

    padding:
        0 26px;

    background:
        rgba(5,7,9,.91);

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

    backdrop-filter:
        blur(12px);
}

.fs-topbar-title {
    font-size: 11px;

    color: #858d98;
}

.fs-chip {
    min-height: 30px;

    padding:
        6px 12px;

    border-radius: 7px;

    color: #62e89a;

    border-color:
        rgba(69,213,139,.18);

    background:
        rgba(69,213,139,.045);
}

.fs-chip .fs-pulse {
    background:
        #30df7c;

    box-shadow:
        0 0 10px
        rgba(48,223,124,.55);
}


/* ---------- PAGE ---------- */

.fs-page {
    padding:
        25px 27px 40px;
}

.fs-page-head {
    align-items: center;

    margin-bottom: 18px;
}

.fs-eyebrow {
    display: none;
}

.fs-page-title {
    font-family:
        var(--fs-font);

    font-weight: 800;

    font-size:
        clamp(27px, 3vw, 37px);

    line-height: 1.1;

    letter-spacing: -.7px;
}

.fs-page-subtitle {
    margin-top: 7px;

    font-size: 13px;

    color: #b2b8c1;
}


/* ---------- KPI ---------- */

.fs-kpis {
    grid-template-columns:
        repeat(4, minmax(0,1fr));

    gap: 14px;

    margin-bottom: 19px;
}

.fs-kpi {
    min-height: 112px;

    padding:
        17px 18px;

    border-radius: 10px;

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

    background:
        radial-gradient(
            circle at 95% 100%,
            rgba(255,30,45,.10),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );

    box-shadow:
        0 12px 36px
        rgba(0,0,0,.27);
}

.fs-kpi::after {
    display: none;
}

.fs-kpi-label {
    color: #9ba3ae;

    font-size: 10px;

    font-family:
        var(--fs-font);

    font-weight: 700;

    letter-spacing: .45px;
}

.fs-kpi-value {
    margin-top: 7px;

    font-family:
        var(--fs-font);

    font-size: 34px;

    font-weight: 800;

    line-height: 1;

    color: #fff;
}

.fs-kpi-foot {
    margin-top: 8px;

    font-size: 11px;

    color: #a8afb8;
}


/* ---------- MAIN COLUMNS ---------- */

.fs-grid-2 {
    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(380px, .95fr);

    gap: 16px;

    align-items: stretch;
}


/* ---------- PANELS ---------- */

.fs-panel {
    border-radius: 11px;

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

    background:
        linear-gradient(
            180deg,
            rgba(10,14,19,.98),
            rgba(7,10,14,.98)
        );

    box-shadow:
        0 14px 42px
        rgba(0,0,0,.26);
}

.fs-panel-head {
    min-height: 56px;

    padding:
        13px 16px;

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

.fs-panel-title {
    font-family:
        var(--fs-font);

    font-size: 17px;

    font-weight: 800;

    letter-spacing: -.2px;

    text-transform: none;
}

.fs-panel-title .fs-pulse {
    width: 9px;
    height: 9px;

    flex:
        0 0 9px;

    background:
        var(--fs-red);

    box-shadow:
        0 0 12px
        rgba(255,30,45,.8);

    animation:
        fsLivePulse 1.1s
        ease-in-out infinite;
}

@keyframes fsLivePulse {
    0%,
    100% {
        opacity: 1;

        transform: scale(1);

        box-shadow:
            0 0 8px
            rgba(255,30,45,.65);
    }

    50% {
        opacity: .40;

        transform: scale(.65);

        box-shadow:
            0 0 18px
            rgba(255,30,45,1);
    }
}

.fs-panel-body {
    padding: 13px 15px 15px;
}


/* ---------- EVENT FEED ---------- */

.fs-list {
    gap: 7px;
}

.fs-list-item {
    position: relative;

    padding:
        12px 13px;

    border-radius: 9px;

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

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.023),
            rgba(255,255,255,.010)
        );

    transition:
        transform .16s ease,
        border-color .16s ease,
        background .16s ease;
}

.fs-list-item:hover {
    transform:
        translateX(2px);

    border-color:
        rgba(255,255,255,.14);

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

.fs-list-item-title {
    display: flex;

    align-items: center;

    gap: 9px;

    line-height: 1.35;

    color: #f5f7fa;

    font-size: 12px;

    font-weight: 700;
}

.fs-list-item-meta {
    margin-top: 6px;

    padding-left: 2px;

    font-family:
        var(--fs-mono);

    font-size: 9.5px;

    color: #707a86;
}


/* ---------- BADGES ---------- */

.fs-badge {
    flex:
        0 0 auto;

    min-width: 58px;

    justify-content: center;

    padding:
        4px 8px;

    border-radius: 6px;

    font-family:
        var(--fs-font);

    font-size: 9px;

    font-weight: 800;
}

.fs-badge.danger {
    color: #ff626c;

    border-color:
        rgba(255,30,45,.40);

    background:
        rgba(255,30,45,.13);

    box-shadow:
        0 0 15px
        rgba(255,30,45,.07);
}

.fs-badge.warning {
    color: #ffb23e;

    border-color:
        rgba(255,164,24,.32);

    background:
        rgba(255,164,24,.10);
}

.fs-badge.info {
    color: #4ac8ff;

    border-color:
        rgba(49,170,255,.28);

    background:
        rgba(49,170,255,.09);
}

.fs-badge.success {
    color: #42df89;

    border-color:
        rgba(50,211,121,.24);

    background:
        rgba(50,211,121,.08);
}


/* ---------- BUTTON ---------- */

.fs-btn {
    min-height: 34px;

    padding:
        8px 12px;

    border-radius: 7px;

    font-size: 11px;

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


/* ---------- FOOTER ---------- */

.fs-footer {
    padding:
        20px 27px 30px;

    color: #5f6874;
}

/* =========================
   RESPONSIVE
========================= */

@media (max-width: 1050px) {
    .fs-kpis {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .fs-grid-2 {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    :root {
        --fs-sidebar: 246px;
    }

    .fs-app,
    .fs-app.is-collapsed {
        grid-template-columns: 1fr;
    }

    .fs-sidebar {
        position: fixed;
        left: 0;
        z-index: 100;
        width: var(--fs-sidebar);
        transform: translateX(-100%);
        transition: transform .25s ease;
    }

    .fs-app.mobile-open .fs-sidebar {
        transform: translateX(0);
    }

    .fs-topbar {
        padding: 0 16px;
    }

    .fs-page {
        padding: 20px 16px;
    }

    .fs-page-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .fs-kpis {
        grid-template-columns: 1fr;
    }

    .fs-info-grid {
        grid-template-columns: 1fr;
    }

    .fs-clock {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}

/* =========================================================
   FOXSHIELD DASHBOARD V3
   Feed SOC + Endpoint criticità
========================================================= */

.fs-dashboard-v3 {
    padding-top: 22px;
}

.fs-dashboard-head {
    margin-bottom: 16px;
}

.fs-kpis-soc {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.fs-kpi-online {
    background:
        radial-gradient(circle at 88% 80%, rgba(69,213,139,.15), transparent 28%),
        linear-gradient(145deg, #0b0f14, #080b10);
}

.fs-kpi-maintenance {
    background:
        radial-gradient(circle at 88% 80%, rgba(241,182,76,.15), transparent 28%),
        linear-gradient(145deg, #0b0f14, #080b10);
}

.fs-kpi-critical {
    background:
        radial-gradient(circle at 88% 80%, rgba(255,30,45,.18), transparent 30%),
        linear-gradient(145deg, #0b0f14, #080b10);
}

.fs-kpi-pending {
    background:
        radial-gradient(circle at 88% 80%, rgba(104,169,255,.14), transparent 28%),
        linear-gradient(145deg, #0b0f14, #080b10);
}

.fs-soc-grid {
    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(400px, .95fr);
    align-items: start;
}

/* =========================
   FEED HEADER
========================= */

.fs-feed-head {
    align-items: center;
}

.fs-live-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.fs-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: 6px;
    padding: 4px 8px;
    border-radius: 6px;
    background: rgba(255,30,45,.14);
    border: 1px solid rgba(255,30,45,.30);
    color: #ff6a73;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .4px;
}

.fs-live-badge .fs-pulse {
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
}

/* =========================
   FEED FILTERS
========================= */

.fs-feed-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 11px 14px;
    border-bottom: 1px solid rgba(255,255,255,.06);
    background: rgba(255,255,255,.012);
}

.fs-feed-filter {
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.07);
    background: rgba(255,255,255,.02);
    color: #aeb6c0;
    font-size: 10px;
    font-weight: 700;
}

.fs-feed-filter.active {
    color: #fff;
    border-color: rgba(255,255,255,.14);
    background: rgba(255,255,255,.055);
}

.fs-feed-filter.critical {
    color: #ff6d76;
    border-color: rgba(255,30,45,.27);
    background: rgba(255,30,45,.08);
}

.fs-feed-filter.high {
    color: #ffb648;
    border-color: rgba(241,182,76,.24);
    background: rgba(241,182,76,.08);
}

.fs-feed-filter.medium {
    color: #55caff;
    border-color: rgba(104,169,255,.24);
    background: rgba(104,169,255,.08);
}

.fs-feed-filter.low {
    color: #57df90;
    border-color: rgba(69,213,139,.22);
    background: rgba(69,213,139,.07);
}

/* =========================
   EVENT FEED
========================= */

.fs-feed-body {
    padding: 10px 12px 14px;
}

.fs-event-feed {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fs-event-row {
    position: relative;
    display: grid;
    grid-template-columns: 74px minmax(0,1fr) 128px;
    gap: 12px;
    align-items: center;

    min-height: 74px;
    padding: 10px 12px;

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

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.018),
            rgba(255,255,255,.007)
        );

    overflow: hidden;
    transition:
        transform .16s ease,
        border-color .16s ease,
        background .16s ease;
}

.fs-event-row::before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    bottom: 8px;
    width: 3px;
    border-radius: 0 3px 3px 0;
}

.fs-event-row:hover {
    transform: translateX(2px);
    border-color: rgba(255,255,255,.15);
    background: rgba(255,255,255,.027);
}

.fs-event-danger {
    border-color: rgba(255,30,45,.20);
    background:
        linear-gradient(
            90deg,
            rgba(255,30,45,.075),
            rgba(255,30,45,.012) 35%,
            rgba(255,255,255,.006)
        );
}

.fs-event-danger::before {
    background: var(--fs-red);
    box-shadow: 0 0 12px rgba(255,30,45,.85);
}

.fs-event-warning {
    border-color: rgba(241,182,76,.16);
}

.fs-event-warning::before {
    background: #f1b64c;
    box-shadow: 0 0 10px rgba(241,182,76,.42);
}

.fs-event-info::before {
    background: #45bfff;
    box-shadow: 0 0 10px rgba(69,191,255,.38);
}

.fs-event-success::before {
    background: #45d58b;
    box-shadow: 0 0 10px rgba(69,213,139,.34);
}

.fs-event-severity {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 52px;
    border-radius: 7px;

    background: rgba(255,255,255,.025);
    border: 1px solid rgba(255,255,255,.06);
}

.fs-event-severity strong {
    margin-top: 3px;
    font-size: 17px;
    line-height: 1;
    color: #fff;
}

.fs-event-level {
    font-size: 9px;
    font-weight: 800;
}

.fs-event-danger .fs-event-level {
    color: #ff606a;
}

.fs-event-warning .fs-event-level {
    color: #ffb342;
}

.fs-event-info .fs-event-level {
    color: #4fc8ff;
}

.fs-event-success .fs-event-level {
    color: #4bdd8a;
}

.fs-event-content {
    min-width: 0;
}

.fs-event-title {
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    line-height: 1.25;
}

.fs-event-description {
    margin-top: 4px;
    color: #9ba5b1;
    font-size: 10.5px;
    line-height: 1.35;
}

.fs-event-description strong {
    color: #dce1e7;
}

.fs-event-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;

    color: #76808c;
    font-family: var(--fs-mono);
    font-size: 9px;
    text-align: right;
}

.fs-event-meta strong {
    color: #e6e9ed;
    font-size: 10px;
}

/* =========================
   CRITICAL SUMMARY
========================= */

.fs-critical-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 7px;
    padding: 11px 12px;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.fs-critical-summary-box {
    min-height: 58px;
    padding: 9px 8px;
    border-radius: 8px;
    text-align: center;
    border: 1px solid rgba(255,255,255,.06);
    background: rgba(255,255,255,.018);
}

.fs-critical-summary-box span {
    display: block;
    font-size: 9px;
    color: #929ca8;
}

.fs-critical-summary-box strong {
    display: block;
    margin-top: 3px;
    font-size: 19px;
    color: #fff;
}

.fs-critical-summary-box.danger {
    background: rgba(255,30,45,.075);
    border-color: rgba(255,30,45,.18);
}

.fs-critical-summary-box.warning {
    background: rgba(241,182,76,.07);
    border-color: rgba(241,182,76,.15);
}

.fs-critical-summary-box.info {
    background: rgba(104,169,255,.07);
    border-color: rgba(104,169,255,.15);
}

.fs-critical-summary-box.success {
    background: rgba(69,213,139,.065);
    border-color: rgba(69,213,139,.14);
}

/* =========================
   ENDPOINT CARDS
========================= */

.fs-critical-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fs-endpoint-card {
    padding: 12px 13px;
    border-radius: 9px;
    border: 1px solid rgba(255,255,255,.075);
    background: rgba(255,255,255,.018);
}

.fs-endpoint-card.isolated,
.fs-endpoint-card.danger {
    border-color: rgba(255,30,45,.32);
    background:
        linear-gradient(
            90deg,
            rgba(255,30,45,.09),
            rgba(255,30,45,.018)
        );
    box-shadow: 0 0 22px rgba(255,30,45,.055);
}

.fs-endpoint-card.warning {
    border-color: rgba(241,182,76,.24);
    background:
        linear-gradient(
            90deg,
            rgba(241,182,76,.075),
            rgba(241,182,76,.012)
        );
}

.fs-endpoint-card.info {
    border-color: rgba(104,169,255,.20);
}

.fs-endpoint-card.success {
    border-color: rgba(69,213,139,.18);
}

.fs-endpoint-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.fs-endpoint-name {
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.fs-endpoint-name:hover {
    color: var(--fs-red-bright);
}

.fs-endpoint-card-meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 7px;

    color: #929ca8;
    font-size: 10px;
}

.fs-endpoint-card-meta strong {
    color: #d6dbe1;
    font-weight: 600;
}

/* =========================
   ENDPOINT CARD — DETAIL (v3 fix)
   Queste classi sono usate da dashboard.php
   ma mancavano completamente nel CSS,
   causando il layout "rotto" rispetto al mock.
========================= */

.fs-endpoint-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 15px 13px 18px;
    overflow: hidden;
}

.fs-endpoint-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: rgba(255,255,255,.12);
}

.fs-endpoint-card.isolated::before {
    background: var(--fs-red);
    box-shadow: 0 0 12px rgba(255,30,45,.85);
}

.fs-endpoint-card.warning::before {
    background: #f1b64c;
    box-shadow: 0 0 10px rgba(241,182,76,.5);
}

.fs-endpoint-card.success::before {
    background: #45d58b;
}

.fs-endpoint-card-top {
    align-items: flex-start;
}

.fs-endpoint-card-identity {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.fs-endpoint-device-icon {
    display: grid;
    place-items: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(104,169,255,.10);
    border: 1px solid rgba(104,169,255,.22);
    color: #68a9ff;
    font-size: 15px;
    line-height: 1;
}

.fs-endpoint-card.isolated .fs-endpoint-device-icon {
    background: rgba(255,30,45,.10);
    border-color: rgba(255,30,45,.28);
    color: var(--fs-red-bright);
}

.fs-endpoint-card.warning .fs-endpoint-device-icon {
    background: rgba(241,182,76,.10);
    border-color: rgba(241,182,76,.28);
    color: #f1b64c;
}

.fs-endpoint-client {
    margin-top: 2px;
    color: var(--fs-dim);
    font-size: 10px;
}

.fs-endpoint-state {
    flex: 0 0 auto;
    padding: 5px 10px;
    border-radius: 999px;
    font: 9px var(--fs-mono);
    font-weight: 800;
    letter-spacing: .6px;
    text-transform: uppercase;
    white-space: nowrap;
    color: #fff;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.14);
}

.fs-endpoint-state.isolated {
    color: #ffd9dc;
    background: var(--fs-red);
    border-color: var(--fs-red);
    box-shadow: 0 0 14px rgba(255,30,45,.45);
}

.fs-endpoint-state.warning {
    color: #2b1c02;
    background: #f1b64c;
    border-color: #f1b64c;
}

.fs-endpoint-state.success {
    color: #06301c;
    background: #45d58b;
    border-color: #45d58b;
}

.fs-endpoint-card-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
}

.fs-endpoint-card-details > div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.fs-endpoint-card-details strong {
    font-size: 12px;
    font-weight: 700;
    color: #e9edf2;
}

.fs-endpoint-detail-label {
    color: var(--fs-dim);
    font-size: 10px;
}

.fs-text-success {
    color: #45d58b !important;
}

.fs-text-warning {
    color: #f1b64c !important;
}

.fs-endpoint-reason {
    padding: 8px 10px;
    border-radius: 8px;
    font-size: 11px;
    line-height: 1.4;
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(255,255,255,.06);
    color: var(--fs-muted);
}

.fs-endpoint-reason.danger {
    color: #ff9aa2;
    background: rgba(255,30,45,.08);
    border-color: rgba(255,30,45,.22);
}

.fs-endpoint-reason.warning {
    color: #ffd083;
    background: rgba(241,182,76,.08);
    border-color: rgba(241,182,76,.22);
}

.fs-endpoint-reason.success {
    color: #8ef0bb;
    background: rgba(69,213,139,.07);
    border-color: rgba(69,213,139,.18);
}

.fs-endpoint-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 2px;
    padding-top: 8px;
    border-top: 1px solid rgba(255,255,255,.05);
}

.fs-endpoint-card-footer > span {
    color: var(--fs-dim);
    font: 9px var(--fs-mono);
    letter-spacing: .8px;
}

.fs-endpoint-detail-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 11px;
    border-radius: 7px;
    border: 1px solid var(--fs-line-red);
    background: rgba(255,30,45,.045);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    transition: .18s ease;
}

.fs-endpoint-detail-btn::after {
    content: "\203A";
    font-weight: 800;
}

.fs-endpoint-detail-btn:hover {
    border-color: var(--fs-red);
    background: var(--fs-red-soft);
}

.fs-endpoint-card.isolated .fs-endpoint-detail-btn {
    border-color: var(--fs-red);
    background: var(--fs-red);
    color: #09090a;
}

.fs-endpoint-card.warning .fs-endpoint-detail-btn {
    border-color: rgba(241,182,76,.5);
    background: rgba(241,182,76,.14);
    color: #ffd083;
}

/* =========================
   TOPBAR — USER / AVATAR
========================= */

.fs-topbar-user {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-left: 14px;
    border-left: 1px solid rgba(255,255,255,.08);
}

.fs-topbar-user-copy {
    text-align: right;
    line-height: 1.35;
}

.fs-topbar-user-name {
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
}

.fs-topbar-user-role {
    color: var(--fs-dim);
    font-size: 10px;
}

.fs-topbar-avatar {
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--fs-red), var(--fs-red-deep));
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 6px 16px rgba(255,30,45,.28);
}

@media (max-width: 760px) {
    .fs-topbar-user-copy {
        display: none;
    }
}

/* =========================
   PAGE HEAD — MANAGE BUTTON
========================= */

.fs-dashboard-head {
    align-items: center;
}

.fs-manage-endpoints-btn {
    flex: 0 0 auto;
}

.fs-manage-endpoints-btn svg {
    width: 16px;
    height: 16px;
}

/* =========================
   PANEL TITLE ICON
========================= */

.fs-panel-title-icon {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    color: var(--fs-red);
    filter: drop-shadow(0 0 6px rgba(255,30,45,.5));
}

/* =========================
   KPI ICON
========================= */

.fs-kpi {
    position: relative;
}

.fs-kpi-icon {
    position: absolute;
    top: 16px;
    right: 16px;
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 9px;
    background: rgba(255,30,45,.08);
    border: 1px solid rgba(255,30,45,.20);
    color: var(--fs-red-bright);
}

.fs-kpi-icon svg {
    width: 29px;
    height: 29px;
}

.fs-kpi-online .fs-kpi-icon {
    background: rgba(69,213,139,.10);
    border-color: rgba(69,213,139,.24);
    color: #45d58b;
}

.fs-kpi-maintenance .fs-kpi-icon {
    background: rgba(241,182,76,.10);
    border-color: rgba(241,182,76,.24);
    color: #f1b64c;
}

.fs-kpi-critical .fs-kpi-icon {
    background: rgba(255,30,45,.12);
    border-color: rgba(255,30,45,.28);
    color: var(--fs-red-bright);
}

.fs-kpi-pending .fs-kpi-icon {
    background: rgba(104,169,255,.10);
    border-color: rgba(104,169,255,.24);
    color: #68a9ff;
}

/* =========================
   SIDEBAR — SOC STATUS WIDGET
========================= */

.fs-sidebar-status {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 14px 4px;
    margin-top: auto;
}

.fs-soc-status-widget {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 14px 10px 16px;
    border: 1px solid var(--fs-line-red);
    border-radius: 12px;
    background: radial-gradient(circle at 50% 0%, rgba(69,213,139,.08), transparent 60%), rgba(255,255,255,.015);
    text-align: center;
}

.fs-soc-status-title {
    align-self: flex-start;
    color: var(--fs-dim);
    font: 10px var(--fs-mono);
    letter-spacing: 1.2px;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.fs-radar {
    position: relative;
    width: 84px;
    height: 84px;
    margin: 2px auto 8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(69,213,139,.14), rgba(5,7,9,.9) 70%);
    border: 1px solid rgba(69,213,139,.30);
    overflow: hidden;
}

.fs-radar-ring {
    position: absolute;
    inset: 14px;
    border: 1px solid rgba(69,213,139,.20);
    border-radius: 50%;
}

.fs-radar-ring:last-of-type {
    inset: 30px;
}

.fs-radar-sweep {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: conic-gradient(from 0deg, rgba(69,213,139,.55), transparent 32%);
    animation: fsRadarSpin 2.6s linear infinite;
}

.fs-radar-line {
    position: absolute;
    left: 8px;
    right: 8px;
    top: 50%;
    height: 1px;
    background: rgba(69,213,139,.18);
}

.fs-radar-dot {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 6px;
    height: 6px;
    margin: -3px 0 0 -3px;
    border-radius: 50%;
    background: #45d58b;
    box-shadow: 0 0 10px rgba(69,213,139,.9);
    animation: fsPulse 1.7s ease-in-out infinite;
}

@keyframes fsRadarSpin {
    to {
        transform: rotate(360deg);
    }
}

.fs-soc-status-state {
    margin-top: 2px;
    color: #7ef0ac;
    font-size: 13px;
    font-weight: 800;
}

.fs-soc-status-sub {
    color: var(--fs-dim);
    font: 10px var(--fs-mono);
    letter-spacing: .5px;
}

.fs-sidebar-brand-box {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 13px;
    border: 1px solid var(--fs-line-red);
    border-radius: 12px;
    background: rgba(255,255,255,.015);
}

.fs-sidebar-brand-box-logo {
    width: 30px;
    height: 30px;
    object-fit: contain;
    filter: drop-shadow(0 0 8px rgba(255,30,45,.5));
}

.fs-sidebar-brand-box-name {
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

.fs-sidebar-brand-box-tag {
    margin-top: 2px;
    color: var(--fs-dim);
    font-size: 10px;
}

.fs-sidebar-version {
    padding: 2px 2px 6px;
    color: var(--fs-dim);
    font: 10px var(--fs-mono);
    text-align: left;
    opacity: .7;
}

.fs-app.is-collapsed .fs-sidebar-status {
    display: none;
}

/*
 * Nome e ruolo ora sono mostrati nella topbar
 * (fs-topbar-user), quindi qui teniamo visibile
 * solo il pulsante di logout per non duplicare
 * l'informazione, senza toccare la funzionalità.
 */
.fs-sidebar-user {
    padding-top: 10px;
}

.fs-sidebar-user-name,
.fs-sidebar-user-role {
    display: none;
}

.fs-logout {
    margin-top: 0;
}

/* =========================
   DASHBOARD RESPONSIVE
========================= */

@media (max-width: 1350px) {
    .fs-kpis-soc {
        grid-template-columns: repeat(3, minmax(0,1fr));
    }

    .fs-soc-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .fs-kpis-soc {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .fs-event-row {
        grid-template-columns: 64px minmax(0,1fr);
    }

    .fs-event-meta {
        grid-column: 2;
        align-items: flex-start;
        text-align: left;
    }

    .fs-critical-summary {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 600px) {
    .fs-kpis-soc {
        grid-template-columns: 1fr;
    }

    .fs-feed-filters {
        gap: 5px;
    }
}

/* =========================================================
   FOXSHIELD — DASHBOARD FINAL ADJUSTMENTS
   - user spostato in basso a sinistra
   - logout a icona
   - rimosso user dalla topbar
   - rimosso FoxShield SOC/versione dal fondo sidebar
========================================================= */

.fs-topbar-user {
    display: none !important;
}

.fs-manage-endpoints-btn {
    display: none !important;
}

.fs-sidebar-brand-box,
.fs-sidebar-version {
    display: none !important;
}

.fs-sidebar-user {
    margin-top: 0;
    padding: 12px 14px 14px;
    border-top: 1px solid rgba(255,255,255,.07);
}

.fs-sidebar-user-row {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 38px;
    align-items: center;
    gap: 10px;
}

.fs-sidebar-user-avatar {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid rgba(255,30,45,.55);
    background:
        radial-gradient(circle at 35% 30%, rgba(255,79,92,.18), transparent 45%),
        rgba(255,30,45,.05);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    box-shadow: 0 0 16px rgba(255,30,45,.10);
}

.fs-sidebar-user-copy {
    min-width: 0;
}

.fs-sidebar-user-name {
    display: block !important;
    overflow: hidden;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fs-sidebar-user-role {
    display: block !important;
    margin-top: 2px;
    overflow: hidden;
    color: var(--fs-dim);
    font: 9px var(--fs-mono);
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.fs-sidebar-logout-form {
    margin: 0;
}

.fs-sidebar-logout-btn {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(255,30,45,.30);
    border-radius: 9px;
    background: rgba(255,30,45,.055);
    color: #ff6f78;
    cursor: pointer;
    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}

.fs-sidebar-logout-btn svg {
    width: 18px;
    height: 18px;
}

.fs-sidebar-logout-btn:hover {
    transform: translateY(-1px);
    border-color: var(--fs-red);
    background: rgba(255,30,45,.13);
    box-shadow: 0 0 16px rgba(255,30,45,.13);
    color: #fff;
}

/*
 * La sidebar status resta, ma senza il box FoxShield SOC
 * e senza la versione. Lo spazio residuo viene compattato.
 */
.fs-sidebar-status {
    padding-bottom: 8px;
}

/*
 * Quando la sidebar è collassata, nascondiamo il blocco
 * utente completo per non interferire con la rotazione/logo.
 */
.fs-app.is-collapsed .fs-sidebar-user-row {
    opacity: 0;
    pointer-events: none;
}

/* =========================================================
   KPI — ICONE GRANDI COME MOCKUP
========================================================= */

.fs-kpi {
    min-height: 122px;
    padding: 20px 86px 18px 20px;
    overflow: hidden;
}

/* Elimina il piccolo box attorno all'icona */
.fs-kpi-icon {
    position: absolute;
    top: 50%;
    right: 18px;

    width: 62px;
    height: 62px;

    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;

    display: flex;
    align-items: center;
    justify-content: center;

    transform: translateY(-42%);
    opacity: .95;
}

/* Icona vera e propria molto più grande */
.fs-kpi-icon svg {
    width: 54px !important;
    height: 54px !important;

    stroke-width: 1.55;
    filter: drop-shadow(0 0 8px currentColor);
}

/* Numero KPI più importante */
.fs-kpi-value {
    margin-top: 7px;
    font-size: 34px;
    line-height: 1;
}

/* Titolo */
.fs-kpi-label {
    font-size: 11px;
    letter-spacing: .7px;
}

/* Descrizione */
.fs-kpi-sub {
    margin-top: 8px;
    font-size: 11px;
}

/* KPI — SOLO ICONA, NESSUN RIQUADRO */

.fs-kpi-icon {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.fs-kpi-icon::before,
.fs-kpi-icon::after {
    display: none !important;
    content: none !important;
}

.fs-kpi-icon svg {
    background: transparent !important;
    box-shadow: none !important;
}

/* LIVE — lampeggio badge */

.fs-live-badge {
    animation: fsLiveFlash 2.2s ease-in-out infinite !important;
}

@keyframes fsLiveBadgeBlink {
    0%,
    100% {
        opacity: 1;
        box-shadow:
            0 0 0 rgba(255,30,45,0),
            0 0 10px rgba(255,30,45,.12);
    }

    50% {
        opacity: .45;
        box-shadow:
            0 0 12px rgba(255,30,45,.35),
            0 0 24px rgba(255,30,45,.18);
    }
}

/* =========================================================
   LIVE — lampeggio forzato
========================================================= */

.fs-live-badge {
    animation: fsLiveFlash 1s ease-in-out infinite !important;
    will-change: opacity, box-shadow, transform;
}

.fs-live-badge .fs-pulse {
    animation: fsLiveDotFlash 1.8s ease-in-out infinite !important;
}

@keyframes fsLiveFlash {
    0%,
    100% {
        opacity: 1;
        transform: scale(1);
        background: rgba(255,30,45,.16);
        border-color: rgba(255,30,45,.45);
        box-shadow:
            0 0 6px rgba(255,30,45,.25),
            0 0 14px rgba(255,30,45,.12);
    }

    50% {
        opacity: .35;
        transform: scale(.96);
        background: rgba(255,30,45,.06);
        border-color: rgba(255,30,45,.15);
        box-shadow: none;
    }
}

@keyframes fsLiveDotFlash {
    0%,
    100% {
        opacity: 1;
        transform: scale(1.15);
        box-shadow:
            0 0 5px #ff1e2d,
            0 0 12px rgba(255,30,45,.9);
    }

    50% {
        opacity: .2;
        transform: scale(.65);
        box-shadow: none;
    }
}

/* Manteniamo LIVE animato anche con "riduci movimento" attivo */
@media (prefers-reduced-motion: reduce) {

    .fs-live-badge {
        animation:
            fsLiveFlash 2.2s ease-in-out infinite !important;
    }

    .fs-live-badge .fs-pulse {
        animation:
            fsLiveDotFlash 1.8s ease-in-out infinite !important;
    }
}

/* =========================================================
   STATO SOC — RADAR FLUIDO + 24/7 BOLD
========================================================= */

.fs-radar {
    position: relative;
    overflow: hidden;

    box-shadow:
        inset 0 0 16px rgba(69,213,139,.08),
        0 0 12px rgba(69,213,139,.05);
}

/* Sweep radar: unica animazione continua */
.fs-radar-sweep {
    position: absolute;
    inset: 0;

    border-radius: 50%;

    background:
        conic-gradient(
            from 0deg,
            rgba(69,213,139,.72) 0deg,
            rgba(69,213,139,.30) 28deg,
            rgba(69,213,139,.08) 55deg,
            transparent 88deg
        );

    transform-origin: 50% 50%;

    animation:
        fsRadarSpin 3.8s linear infinite !important;

    will-change: transform;

    /* niente filter: evita micro-lag */
    filter: none !important;
}

@keyframes fsRadarSpin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Anelli fermi: più fluidità */
.fs-radar-ring {
    animation: none !important;
    opacity: .55;
}

/* Punto centrale fermo ma luminoso */
.fs-radar-dot {
    animation: none !important;

    background: #45d58b;

    box-shadow:
        0 0 7px rgba(69,213,139,.90),
        0 0 15px rgba(69,213,139,.38);
}

/* 24/7 stessa dimensione originale, solo più marcato */
.fs-soc-status-sub {
    margin-top: 2px;

    color: #d8dde3 !important;

    font: 10px var(--fs-mono) !important;

    font-weight: 800 !important;

    letter-spacing: .5px !important;

    opacity: 1 !important;

    text-shadow: none !important;
}

/* =========================================================
   FOXSHIELD - FIX ICONE PAGINA AZIENDE
   ========================================================= */

/* Icona nel titolo "Elenco aziende" */
.companies-page .panel-title svg,
.companies-page .section-title svg,
.companies-page .companies-title svg {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    min-height: 18px !important;
    max-height: 18px !important;
    flex: 0 0 18px !important;
}

/* Icone interne alle card delle aziende */
.companies-page .company-card svg {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    flex: 0 0 22px !important;
}

/* Contenitore dell'icona azienda */
.companies-page .company-icon {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    flex: 0 0 44px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    overflow: hidden !important;
}

/* Impedisce a SVG/Lucide di espandersi */
.companies-page svg {
    max-width: 100%;
    vertical-align: middle;
}

/* =========================================================
   AZIENDE — FIX DIMENSIONI ICONE
========================================================= */

/* Icona accanto a "Elenco aziende" */
.fs-companies-page .fs-panel-title-icon {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    flex: 0 0 18px !important;
}

/* Box icona della singola azienda */
.fs-companies-page .fs-company-icon {
    display: grid !important;
    place-items: center !important;

    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;

    flex: 0 0 46px !important;

    overflow: hidden !important;

    border-radius: 10px;

    border: 1px solid rgba(255,30,45,.22);
    background: rgba(255,30,45,.07);
    color: var(--fs-red-bright);
}

/* SVG edificio dentro la card azienda */
.fs-companies-page .fs-company-icon svg {
    width: 24px !important;
    height: 24px !important;

    min-width: 24px !important;
    max-width: 24px !important;

    min-height: 24px !important;
    max-height: 24px !important;
}

/*
 * Sicurezza: impedisce all'SVG della pagina aziende
 * di espandersi oltre il suo contenitore.
 */
.fs-companies-page svg {
    max-width: 100%;
}

/* =========================================================
   AZIENDE — LAYOUT CARD
========================================================= */

.fs-companies-page {
    padding-top: 22px;
}

.fs-companies-kpis {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.fs-companies-panel .fs-panel-body {
    padding: 16px;
}

.fs-company-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.fs-company-card {
    position: relative;
    overflow: hidden;

    padding: 18px;

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

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255,30,45,.08),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            rgba(12,16,22,.98),
            rgba(8,11,15,.98)
        );

    box-shadow:
        0 12px 34px rgba(0,0,0,.22);

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

.fs-company-card:hover {
    transform: translateY(-2px);
    border-color: rgba(255,30,45,.25);
    box-shadow:
        0 16px 38px rgba(0,0,0,.30),
        0 0 22px rgba(255,30,45,.05);
}

.fs-company-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 14px;
    bottom: 14px;
    width: 3px;

    border-radius: 0 3px 3px 0;

    background: var(--fs-red);
    box-shadow: 0 0 12px rgba(255,30,45,.45);
}

.fs-company-card.active::before {
    background: var(--fs-success);
    box-shadow: 0 0 12px rgba(69,213,139,.42);
}

.fs-company-card.suspended::before {
    background: var(--fs-warning);
    box-shadow: 0 0 12px rgba(241,182,76,.38);
}

.fs-company-card.disabled::before {
    background: var(--fs-danger);
}


/* =========================
   HEAD AZIENDA
========================= */

.fs-company-card-head {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
}

.fs-company-icon {
    display: grid;
    place-items: center;

    width: 46px;
    height: 46px;

    border-radius: 10px;

    border: 1px solid rgba(255,30,45,.25);
    background: rgba(255,30,45,.07);
    color: var(--fs-red-bright);
}

.fs-company-icon svg {
    width: 23px !important;
    height: 23px !important;
}

.fs-company-card.active .fs-company-icon {
    border-color: rgba(69,213,139,.22);
    background: rgba(69,213,139,.07);
    color: var(--fs-success);
}

.fs-company-identity {
    min-width: 0;
}

.fs-company-identity h2 {
    margin: 0;

    color: #fff;

    font-size: 18px;
    font-weight: 800;
    line-height: 1.15;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fs-company-identity > span {
    display: block;

    margin-top: 4px;

    color: var(--fs-dim);

    font: 10px var(--fs-mono);
}


/* =========================
   STATISTICHE
========================= */

.fs-company-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;

    margin-top: 18px;
}

.fs-company-stats > div {
    padding: 11px 12px;

    border-radius: 9px;
    border: 1px solid rgba(255,255,255,.065);

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

.fs-company-stats span {
    display: block;

    color: var(--fs-dim);

    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.fs-company-stats strong {
    display: block;

    margin-top: 5px;

    color: #fff;

    font-size: 13px;
    font-weight: 800;
}


/* =========================
   UTILIZZO ENDPOINT
========================= */

.fs-company-usage {
    margin-top: 14px;

    padding: 12px;

    border-radius: 9px;
    border: 1px solid rgba(255,255,255,.06);

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

.fs-company-usage-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 8px;
}

.fs-company-usage-head span {
    color: var(--fs-muted);
    font-size: 10px;
}

.fs-company-usage-head strong {
    color: #fff;
    font-size: 11px;
}

.fs-company-progress {
    height: 6px;

    overflow: hidden;

    border-radius: 999px;

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

.fs-company-progress span {
    display: block;

    height: 100%;

    border-radius: inherit;

    background:
        linear-gradient(
            90deg,
            var(--fs-red-deep),
            var(--fs-red)
        );

    box-shadow: 0 0 10px rgba(255,30,45,.30);
}

.fs-company-card.active .fs-company-progress span {
    background:
        linear-gradient(
            90deg,
            #197647,
            var(--fs-success)
        );

    box-shadow: 0 0 10px rgba(69,213,139,.26);
}


/* =========================
   META
========================= */

.fs-company-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;

    margin-top: 12px;
}

.fs-company-meta > div {
    min-width: 0;

    padding: 10px 11px;

    border-radius: 8px;

    background: rgba(255,255,255,.012);
    border: 1px solid rgba(255,255,255,.05);
}

.fs-company-meta span {
    display: block;

    color: var(--fs-dim);

    font-size: 9px;
}

.fs-company-meta strong {
    display: block;

    margin-top: 4px;

    color: #dfe4ea;

    font: 10px var(--fs-mono);

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================
   FOOTER CARD
========================= */

.fs-company-card-footer {
    display: flex;
    justify-content: flex-end;

    margin-top: 14px;
    padding-top: 12px;

    border-top: 1px solid rgba(255,255,255,.055);
}

.fs-company-open {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    min-height: 36px;

    padding: 8px 12px;

    border: 1px solid rgba(255,30,45,.28);
    border-radius: 8px;

    background: rgba(255,30,45,.06);

    color: #fff;

    font-size: 11px;
    font-weight: 800;

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

.fs-company-open span {
    color: var(--fs-red-bright);
    font-size: 17px;
    line-height: 1;
}

.fs-company-open:hover {
    transform: translateY(-1px);

    background: rgba(255,30,45,.12);

    border-color: var(--fs-red);
}


/* =========================
   RESPONSIVE AZIENDE
========================= */

@media (max-width: 1200px) {
    .fs-company-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 800px) {
    .fs-companies-kpis {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .fs-company-stats,
    .fs-company-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .fs-companies-kpis {
        grid-template-columns: 1fr;
    }

    .fs-company-card-head {
        grid-template-columns: 46px minmax(0,1fr);
    }

    .fs-company-card-head > .fs-badge {
        grid-column: 1 / -1;
        justify-self: start;
    }
}

/* =========================================================
   AZIENDE — RICERCA + LEGGIBILITÀ META
========================================================= */

.fs-company-search-wrap {
    display: flex;
    align-items: center;
    gap: 12px;

    padding: 13px 16px;

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

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

.fs-company-search {
    position: relative;

    flex: 1;

    max-width: 620px;
}

.fs-company-search svg {
    position: absolute;

    left: 13px;
    top: 50%;

    width: 17px !important;
    height: 17px !important;

    transform: translateY(-50%);

    color: #77818d;

    pointer-events: none;
}

.fs-company-search input {
    width: 100%;

    height: 42px;

    padding: 0 14px 0 40px;

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

    outline: none;

    background: #090d12;

    color: #fff;

    font-size: 12px;

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

.fs-company-search input::placeholder {
    color: #69737f;
}

.fs-company-search input:focus {
    border-color: rgba(255,30,45,.48);

    background: #0b0f14;

    box-shadow:
        0 0 0 3px rgba(255,30,45,.055),
        0 0 16px rgba(255,30,45,.045);
}

.fs-company-search-count {
    flex: 0 0 auto;

    padding: 6px 9px;

    border-radius: 7px;

    border: 1px solid rgba(69,213,139,.15);

    background: rgba(69,213,139,.045);

    color: #6be4a0;

    font: 10px var(--fs-mono);

    white-space: nowrap;
}


/* Gruppo Wazuh / data più leggibili */

.fs-company-meta span {
    color: #8e98a4 !important;

    font-size: 10px !important;

    font-weight: 600;

    letter-spacing: .15px;
}

.fs-company-meta strong {
    margin-top: 5px;

    color: #eef2f6 !important;

    font-size: 11px !important;

    font-weight: 700 !important;

    line-height: 1.35;

    opacity: 1 !important;
}


/* Anche slug leggermente più leggibile */

.fs-company-identity > span {
    color: #88929e !important;
}


/* Elementi filtrati */

.fs-company-card[hidden] {
    display: none !important;
}

@media (max-width: 700px) {
    .fs-company-search-wrap {
        align-items: stretch;
        flex-direction: column;
    }

    .fs-company-search {
        max-width: none;
    }

    .fs-company-search-count {
        align-self: flex-start;
    }
}

/* =========================================================
   AZIENDE — TESTI META PIÙ LEGGIBILI
   + BARRA RICERCA FULL WIDTH
========================================================= */

/* Barra ricerca lunga quanto tutta la card */
.fs-company-search {
    flex: 1 1 auto;
    width: 100%;
    max-width: none !important;
}

.fs-company-search-wrap {
    width: 100%;
}

.fs-company-search input {
    width: 100%;
}


/* Gruppo Wazuh / Creata: font normale e leggibile */
.fs-company-meta span {
    color: #9ca6b2 !important;

    font-family: var(--fs-font) !important;
    font-size: 11px !important;
    font-weight: 600 !important;

    letter-spacing: 0 !important;
    text-transform: none !important;
}

.fs-company-meta strong {
    margin-top: 5px;

    color: #f2f4f7 !important;

    font-family: var(--fs-font) !important;
    font-size: 12px !important;
    font-weight: 700 !important;

    line-height: 1.35;

    letter-spacing: 0 !important;

    opacity: 1 !important;
}

/* =========================================================
   COMPANY DETAIL — FOXSHIELD SOC STYLE
========================================================= */

.fs-company-detail-page {
    padding-top: 24px;
}


/* =========================
   HEADER AZIENDA
========================= */

.fs-company-detail-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 18px;
}

.fs-company-detail-identity {
    min-width: 0;
}

.fs-company-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    margin-bottom: 10px;

    color: #8e98a4;

    font-size: 11px;
    font-weight: 700;

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

.fs-company-back:hover {
    color: #fff;
    transform: translateX(-2px);
}

.fs-company-detail-title-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.fs-company-detail-title-row .fs-page-title {
    font-size: clamp(30px, 3vw, 40px);
}

.fs-company-detail-title-row .fs-badge {
    flex: 0 0 auto;
}

.fs-company-detail-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}


/* =========================
   TAB AZIENDA
========================= */

.fs-company-tabs {
    display: flex;
    align-items: center;
    gap: 6px;

    margin-bottom: 20px;
    padding: 6px;

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

    background: rgba(8,11,15,.92);
}

.fs-company-tabs a {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    min-height: 38px;

    padding: 8px 13px;

    border: 1px solid transparent;
    border-radius: 8px;

    color: #9aa4af;

    font-size: 11px;
    font-weight: 700;

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

.fs-company-tabs a:hover {
    color: #fff;
    background: rgba(255,255,255,.025);
}

.fs-company-tabs a.active {
    color: #fff;

    border-color: rgba(255,30,45,.28);

    background:
        linear-gradient(
            90deg,
            rgba(255,30,45,.13),
            rgba(255,30,45,.035)
        );

    box-shadow:
        inset 2px 0 0 var(--fs-red);
}

.fs-company-tabs a span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 20px;
    height: 20px;

    padding: 0 6px;

    border-radius: 999px;

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

    color: #dce2e8;

    font-size: 9px;
}


/* =========================
   SEZIONI
========================= */

.fs-company-section {
    margin-top: 22px;
}

.fs-company-section:first-of-type {
    margin-top: 0;
}

.fs-company-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 12px;
}

.fs-company-section-head h2 {
    margin: 0;

    color: #fff;

    font-size: 18px;
    font-weight: 800;
}

.fs-company-section-head p {
    margin: 5px 0 0;

    color: #8f99a4;

    font-size: 11px;
}


/* =========================
   KPI PANORAMICA
========================= */

.fs-company-detail-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 12px;
}

.fs-company-detail-kpi {
    position: relative;
    overflow: hidden;

    min-height: 112px;

    padding: 16px;

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

    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,30,45,.08),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );

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

.fs-company-detail-kpi span {
    display: block;

    color: #8f99a4;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .5px;
    text-transform: uppercase;
}

.fs-company-detail-kpi strong {
    display: block;

    margin-top: 7px;

    color: #fff;

    font-size: 28px;
    font-weight: 800;

    line-height: 1;
}

.fs-company-detail-kpi small {
    display: block;

    margin-top: 8px;

    color: #7e8893;

    font-size: 10px;
}

.fs-company-detail-kpi.success {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(69,213,139,.12),
            transparent 34%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-detail-kpi.warning {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(241,182,76,.13),
            transparent 34%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-detail-kpi.danger {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,30,45,.14),
            transparent 34%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-detail-kpi.info {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(104,169,255,.12),
            transparent 34%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}


/* =========================
   INFO AZIENDA
========================= */

.fs-company-info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px;

    margin-top: 12px;
}

.fs-company-info-card {
    min-width: 0;

    padding: 13px 14px;

    border: 1px solid rgba(255,255,255,.065);
    border-radius: 9px;

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

.fs-company-info-card span {
    display: block;

    color: #8d97a2;

    font-family: var(--fs-font);
    font-size: 10px;
    font-weight: 600;
}

.fs-company-info-card strong {
    display: block;

    margin-top: 5px;

    color: #f2f4f7;

    font-family: var(--fs-font);
    font-size: 11px;
    font-weight: 700;

    line-height: 1.4;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================
   ENDPOINT TABLE
========================= */

.fs-company-detail-page .fs-table {
    font-size: 11px;
}

.fs-company-detail-page .fs-table th {
    padding-top: 12px;
    padding-bottom: 12px;

    color: #77818c;

    font-size: 9px;
}

.fs-company-detail-page .fs-table td {
    padding-top: 13px;
    padding-bottom: 13px;

    font-size: 11px;
}

.fs-company-detail-page .fs-table tr:hover td {
    background: rgba(255,30,45,.025);
}


/* =========================
   DEPLOYMENT
========================= */

.fs-company-deployment-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    padding: 18px;

    border: 1px solid rgba(69,213,139,.16);
    border-radius: 11px;

    background:
        radial-gradient(
            circle at 100% 50%,
            rgba(69,213,139,.08),
            transparent 38%
        ),
        rgba(10,14,18,.96);
}

.fs-company-deployment-label {
    display: block;

    color: #8b96a1;

    font-size: 10px;
    font-weight: 600;
}

.fs-company-deployment-card strong {
    display: block;

    margin-top: 5px;

    font-size: 13px;
}

.fs-company-deployment-card p {
    margin: 8px 0 0;

    color: #8e98a3;

    font-size: 11px;
}

.fs-company-deployment-card p b {
    color: #dfe4e9;
}


/* =========================
   ALERT PLACEHOLDER
========================= */

.fs-company-detail-page #alerts .fs-panel {
    min-height: 110px;
}

.fs-company-detail-page #alerts .fs-empty {
    display: grid;
    place-items: center;

    min-height: 90px;

    color: #737d88;

    font-size: 11px;
}


/* =========================
   RESPONSIVE DETAIL COMPANY
========================= */

@media (max-width: 1350px) {
    .fs-company-detail-kpis {
        grid-template-columns: repeat(3, minmax(0,1fr));
    }

    .fs-company-info-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .fs-company-detail-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .fs-company-detail-kpis {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .fs-company-tabs {
        overflow-x: auto;
    }

    .fs-company-tabs a {
        flex: 0 0 auto;
    }
}

@media (max-width: 620px) {
    .fs-company-detail-kpis,
    .fs-company-info-grid {
        grid-template-columns: 1fr;
    }

    .fs-company-deployment-card {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* =========================================================
   COMPANY DETAIL — MOCKUP FINAL
========================================================= */

.fs-company-detail-page {
    padding: 26px 30px 40px;
}

/* HEADER */

.fs-company-detail-head {
    min-height: 92px;
    align-items: center;
    margin-bottom: 14px;
}

.fs-company-back {
    margin-bottom: 8px;
    color: #89939f;
    font-size: 11px;
}

.fs-company-detail-title-row {
    align-items: center;
    gap: 14px;
}

.fs-company-detail-title-row .fs-page-title {
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -.8px;
}

.fs-company-detail-actions .fs-btn.primary {
    min-height: 42px;
    padding: 10px 18px;
    border-radius: 8px;
    color: #08090b;
}

/* TABS */

.fs-company-tabs {
    margin: 0 0 20px;
    padding: 6px;
    min-height: 50px;

    border-radius: 10px;

    background:
        linear-gradient(
            180deg,
            rgba(10,14,19,.98),
            rgba(7,10,14,.98)
        );
}

.fs-company-tabs a {
    min-height: 38px;
    padding: 8px 14px;
}

.fs-company-tabs a.active {
    border-color: rgba(255,30,45,.50);

    background:
        linear-gradient(
            180deg,
            rgba(255,30,45,.14),
            rgba(255,30,45,.045)
        );

    box-shadow:
        inset 0 0 0 1px rgba(255,30,45,.12),
        0 0 16px rgba(255,30,45,.06);
}

/* KPI */

.fs-company-detail-kpis {
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 14px;
}

.fs-company-detail-kpi {
    position: relative;

    min-height: 110px;

    padding: 18px 76px 17px 18px;

    overflow: hidden;
}

.fs-company-detail-kpi strong {
    font-size: 30px;
}

.fs-company-detail-kpi small {
    font-size: 10px;
}

/* ICONA KPI */

.fs-company-detail-kpi-icon {
    position: absolute;

    top: 50%;
    right: 17px;

    width: 52px;
    height: 52px;

    transform: translateY(-50%);

    display: grid;
    place-items: center;

    background: transparent;
    border: 0;
}

.fs-company-detail-kpi-icon svg {
    width: 42px !important;
    height: 42px !important;

    filter:
        drop-shadow(0 0 8px currentColor);
}

.fs-company-detail-kpi-icon.endpoint {
    color: #ff2638;
}

.fs-company-detail-kpi-icon.online {
    color: #35dc83;
}

.fs-company-detail-kpi-icon.maintenance {
    color: #ffad20;
}

.fs-company-detail-kpi-icon.isolated {
    color: #ff6b25;
}

.fs-company-detail-kpi-icon.pending {
    color: #3dafff;
}

/* INFO SOTTO KPI */

.fs-company-info-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));

    margin-top: 12px;

    gap: 10px;
}

.fs-company-info-card {
    min-height: 58px;

    padding: 12px 15px;

    background:
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );
}

.fs-company-info-card span {
    font-size: 10px;
}

.fs-company-info-card strong {
    font-size: 12px;
}

/* ENDPOINT + DEPLOYMENT AFFIANCATI */

.fs-company-main-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(420px, 1fr);

    gap: 14px;

    align-items: stretch;

    margin-top: 20px;
}

.fs-company-main-grid .fs-company-section {
    margin: 0;
}

.fs-company-main-grid .fs-panel,
.fs-company-main-grid .fs-company-deployment-card {
    height: calc(100% - 46px);
}

/* TITOLI */

.fs-company-section-head h2 {
    font-size: 19px;
}

.fs-company-section-head p {
    color: #959faa;
    font-size: 11px;
}

/* ENDPOINT */

.fs-company-detail-page #endpoints .fs-panel {
    border: 1px solid rgba(255,255,255,.08);

    background:
        linear-gradient(
            180deg,
            #0a0e13,
            #070a0e
        );
}

.fs-company-detail-page #endpoints .fs-panel-body {
    padding: 12px 15px;
}

.fs-company-detail-page .fs-table th {
    color: #828c98;
    font-size: 9px;
}

.fs-company-detail-page .fs-table td {
    color: #eef1f4;
    font-size: 11px;
}

/* DEPLOYMENT */

.fs-company-deployment-card {
    min-height: 92px;

    padding: 20px;

    background:
        radial-gradient(
            circle at 92% 50%,
            rgba(38,210,124,.08),
            transparent 35%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080c10
        );

    border-color:
        rgba(69,213,139,.12);
}

.fs-company-deployment-card > div {
    flex: 1;
}

.fs-company-deployment-card .fs-btn {
    flex: 0 0 auto;
}

/* ALERT */

.fs-company-detail-page #alerts {
    margin-top: 18px;
}

.fs-company-detail-page #alerts .fs-panel {
    min-height: 164px;

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

    background:
        linear-gradient(
            180deg,
            #0a0e13,
            #070a0e
        );
}

/* Responsive */

@media (max-width: 1400px) {

    .fs-company-detail-kpis {
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

    .fs-company-main-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 800px) {

    .fs-company-detail-kpis {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .fs-company-info-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }
}

/* =========================================================
   COMPANY DETAIL — ALERT WAZUH
========================================================= */

.fs-company-alert-panel {
    overflow: hidden;
}

.fs-company-alert-table-head,
.fs-company-alert-row {
    display: grid;

    grid-template-columns:
        150px
        minmax(0,1.6fr)
        minmax(150px,.8fr)
        180px
        100px;

    gap: 14px;

    align-items: center;
}

.fs-company-alert-table-head {
    min-height: 44px;

    padding: 0 18px;

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

    color: #77818d;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .7px;

    text-transform: uppercase;
}

.fs-company-alert-list {
    display: flex;
    flex-direction: column;
}

.fs-company-alert-row {
    position: relative;

    min-height: 58px;

    padding: 10px 18px;

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

    color: #b9c1ca;

    font-size: 10.5px;

    transition:
        background .18s ease;
}

.fs-company-alert-row:last-child {
    border-bottom: 0;
}

.fs-company-alert-row:hover {
    background:
        rgba(255,255,255,.018);
}

.fs-company-alert-row::before {
    content: "";

    position: absolute;

    left: 0;
    top: 10px;
    bottom: 10px;

    width: 3px;

    border-radius:
        0 3px 3px 0;
}

.fs-company-alert-row.danger::before {
    background: #ff2538;

    box-shadow:
        0 0 10px rgba(255,37,56,.60);
}

.fs-company-alert-row.warning::before {
    background: #ffae23;
}

.fs-company-alert-row.info::before {
    background: #39bfff;
}

.fs-company-alert-row.success::before {
    background: #3add86;
}

.fs-company-alert-title {
    color: #fff;

    font-size: 11px;
    font-weight: 700;
}

.fs-company-alert-status {
    display: inline-flex;

    padding: 4px 7px;

    border-radius: 6px;

    border:
        1px solid rgba(104,169,255,.20);

    background:
        rgba(104,169,255,.06);

    color: #83bdff;

    font-size: 9px;
    font-weight: 700;
}

.fs-company-alert-empty {
    min-height: 150px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    gap: 7px;

    padding: 24px;

    text-align: center;

    color: #7f8994;
}

.fs-company-alert-empty-icon {
    display: grid;
    place-items: center;

    width: 48px;
    height: 48px;

    margin-bottom: 3px;

    border-radius: 50%;

    border:
        1px solid rgba(255,30,45,.20);

    background:
        rgba(255,30,45,.08);

    color: #fff;

    box-shadow:
        0 0 24px rgba(255,30,45,.08);
}

.fs-company-alert-empty-icon svg {
    width: 25px !important;
    height: 25px !important;
}

.fs-company-alert-empty strong {
    color: #fff;

    font-size: 12px;
}

.fs-company-alert-empty span {
    font-size: 10.5px;
}

@media (max-width: 1050px) {

    .fs-company-alert-panel {
        overflow-x: auto;
    }

    .fs-company-alert-table-head,
    .fs-company-alert-row {
        min-width: 900px;
    }
}

/* =========================================================
   COMPANY DEPLOYMENT
========================================================= */

.fs-company-deployment-page {
    padding-top: 24px;
}

.fs-company-deployment-head {
    margin-bottom: 18px;
}

.fs-company-deployment-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.fs-company-deployment-kpi {
    min-height: 105px;
    padding: 17px;

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

    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,30,45,.08),
            transparent 35%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-deployment-kpi.success {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(69,213,139,.12),
            transparent 35%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-deployment-kpi.info {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(70,170,255,.12),
            transparent 35%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-deployment-kpi.warning {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(241,182,76,.12),
            transparent 35%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-deployment-kpi span {
    color: #8d97a2;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.fs-company-deployment-kpi strong {
    display: block;
    margin-top: 7px;
    color: #fff;
    font-size: 28px;
}

.fs-company-deployment-kpi small {
    display: block;
    margin-top: 7px;
    color: #828c97;
    font-size: 10px;
}

.fs-company-deployment-layout {
    display: grid;
    grid-template-columns: minmax(0,1.1fr) minmax(380px,.9fr);
    gap: 14px;
    margin-bottom: 16px;
}

.fs-deployment-form {
    display: grid;
    gap: 14px;
}

.fs-deployment-field label {
    display: block;
    margin-bottom: 7px;
    color: #dce1e6;
    font-size: 11px;
    font-weight: 700;
}

.fs-deployment-field input {
    width: 100%;
    height: 42px;
    box-sizing: border-box;

    padding: 0 12px;

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

    outline: none;

    background: #080c10;
    color: #fff;
    font-size: 12px;
}

.fs-deployment-field input:focus {
    border-color: rgba(255,30,45,.50);
    box-shadow: 0 0 0 3px rgba(255,30,45,.05);
}

.fs-deployment-field small {
    display: block;
    margin-top: 6px;
    color: #747f8a;
    font-size: 9.5px;
}

.fs-deployment-input-unit {
    display: grid;
    grid-template-columns: minmax(0,1fr) 70px;
}

.fs-deployment-input-unit input {
    border-radius: 8px 0 0 8px;
}

.fs-deployment-input-unit span {
    display: grid;
    place-items: center;

    border: 1px solid rgba(255,255,255,.10);
    border-left: 0;
    border-radius: 0 8px 8px 0;

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

    color: #89939e;
    font-size: 10px;
}

.fs-deployment-company-info {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
}

.fs-deployment-company-info > div {
    padding: 12px;

    border: 1px solid rgba(255,255,255,.06);
    border-radius: 8px;

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

.fs-deployment-company-info span {
    display: block;
    color: #838d98;
    font-size: 10px;
}

.fs-deployment-company-info strong {
    display: block;
    margin-top: 5px;
    color: #edf1f5;
    font-size: 11px;
}

.fs-deployment-message {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    margin-bottom: 14px;
    padding: 14px 16px;

    border-radius: 9px;
}

.fs-deployment-message.error {
    border: 1px solid rgba(255,30,45,.25);
    background: rgba(255,30,45,.07);
}

.fs-deployment-message.success {
    border: 1px solid rgba(69,213,139,.22);
    background: rgba(69,213,139,.06);
}

.fs-deployment-message strong {
    display: block;
    color: #fff;
    font-size: 12px;
}

.fs-deployment-message span {
    display: block;
    margin-top: 3px;
    color: #a1aab4;
    font-size: 10px;
}

.fs-deployment-created-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.fs-deployment-hash {
    max-width: 400px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    font-family: var(--fs-mono);
}

.fs-deployment-table-wrap {
    overflow-x: auto;
}

.fs-deployment-table {
    width: 100%;
    border-collapse: collapse;
}

.fs-deployment-table th,
.fs-deployment-table td {
    padding: 12px 13px;
    text-align: left;
    border-bottom: 1px solid rgba(255,255,255,.055);
}

.fs-deployment-table th {
    color: #77818c;
    font-size: 9px;
    letter-spacing: .5px;
    text-transform: uppercase;
}

.fs-deployment-table td {
    color: #d9dee4;
    font-size: 10.5px;
}

.fs-deployment-table tbody tr:hover td {
    background: rgba(255,255,255,.016);
}

.fs-deployment-download {
    display: inline-flex;
    padding: 6px 9px;

    border: 1px solid rgba(69,213,139,.20);
    border-radius: 6px;

    background: rgba(69,213,139,.06);

    color: #58e596;
    font-size: 10px;
    font-weight: 700;
}

.fs-deployment-missing {
    color: #737d88;
    font-size: 10px;
}

@media (max-width: 1100px) {
    .fs-company-deployment-kpis {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .fs-company-deployment-layout {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   COMPANY DEPLOYMENT
========================================================= */

.fs-company-deployment-page {
    padding-bottom: 42px;
}


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

.fs-company-deployment-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

.fs-company-deployment-head .fs-page-title {
    margin: 7px 0 5px;
    font-size: 32px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -0.8px;
}

.fs-company-deployment-head .fs-page-subtitle {
    color: #87919d;
    font-size: 13px;
}

.fs-company-back {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    color: #8e98a4;
    text-decoration: none;

    font-size: 12px;
    font-weight: 600;

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

.fs-company-back:hover {
    color: #ffffff;
    transform: translateX(-2px);
}


/* =========================================================
   KPI
========================================================= */

.fs-company-deployment-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.fs-company-deployment-kpi {
    position: relative;
    overflow: hidden;

    min-height: 112px;
    padding: 18px 20px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    background:
        linear-gradient(
            115deg,
            rgba(11, 16, 22, .98),
            rgba(16, 20, 27, .98)
        );

    border: 1px solid #202832;
    border-radius: 11px;
}

.fs-company-deployment-kpi::after {
    content: "";
    position: absolute;

    width: 150px;
    height: 150px;

    right: -60px;
    bottom: -85px;

    border-radius: 50%;

    background: rgba(255, 35, 58, .09);
    filter: blur(30px);

    pointer-events: none;
}

.fs-company-deployment-kpi.success::after {
    background: rgba(29, 224, 133, .11);
}

.fs-company-deployment-kpi.info::after {
    background: rgba(45, 169, 255, .10);
}

.fs-company-deployment-kpi.warning::after {
    background: rgba(255, 174, 32, .12);
}

.fs-company-deployment-kpi > * {
    position: relative;
    z-index: 1;
}

.fs-company-deployment-kpi span {
    margin-bottom: 5px;

    color: #7e8996;

    font-family: "Share Tech Mono", monospace;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.fs-company-deployment-kpi strong {
    color: #f4f7fa;

    font-size: 28px;
    line-height: 1;
    font-weight: 800;
}

.fs-company-deployment-kpi small {
    display: block;

    margin-top: 9px;

    color: #7f8994;
    font-size: 11px;
}


/* =========================================================
   TWO COLUMN AREA
========================================================= */

.fs-company-deployment-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr);
    gap: 14px;

    margin-bottom: 14px;
}

.fs-company-deployment-layout .fs-panel {
    margin: 0;
}


/* =========================================================
   PANELS
========================================================= */

.fs-company-deployment-page .fs-panel {
    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            rgba(10, 15, 21, .97),
            rgba(8, 13, 18, .98)
        );

    border: 1px solid #202832;
    border-radius: 12px;
}

.fs-company-deployment-page .fs-panel-head {
    min-height: 52px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 18px;

    border-bottom: 1px solid #1c242d;
}

.fs-company-deployment-page .fs-panel-title {
    color: #f0f3f6;
    font-size: 15px;
    font-weight: 750;
}

.fs-company-deployment-page .fs-panel-body {
    padding: 18px;
}


/* =========================================================
   GENERATE FORM
========================================================= */

.fs-deployment-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 14px;
    align-items: end;
}

.fs-deployment-field {
    min-width: 0;
}

.fs-deployment-field label {
    display: block;

    margin-bottom: 8px;

    color: #aeb7c1;

    font-size: 11px;
    font-weight: 650;
}

.fs-deployment-field input {
    width: 100%;
    height: 43px;

    box-sizing: border-box;

    padding: 0 13px;

    background: #090e13;

    border: 1px solid #26303a;
    border-radius: 8px;

    color: #ffffff;

    font-family: "Inter", sans-serif;
    font-size: 13px;
    font-weight: 650;

    outline: none;

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

.fs-deployment-field input:focus {
    border-color: rgba(255, 36, 58, .7);

    box-shadow:
        0 0 0 3px rgba(255, 36, 58, .08);
}

.fs-deployment-field small {
    display: block;

    margin-top: 7px;

    color: #65717d;
    font-size: 10px;
}

.fs-deployment-input-unit {
    position: relative;
}

.fs-deployment-input-unit input {
    padding-right: 62px;
}

.fs-deployment-input-unit span {
    position: absolute;

    right: 12px;
    top: 50%;

    transform: translateY(-50%);

    color: #66717c;

    font-size: 10px;
    font-weight: 600;

    pointer-events: none;
}

.fs-deployment-form .fs-btn {
    height: 43px;

    margin: 0;

    padding: 0 18px;

    white-space: nowrap;
}


/* =========================================================
   COMPANY INFO
========================================================= */

.fs-deployment-company-info {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.fs-deployment-company-info > div {
    min-height: 60px;

    box-sizing: border-box;

    padding: 11px 13px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    background: rgba(7, 12, 17, .62);

    border: 1px solid #1d2630;
    border-radius: 8px;
}

.fs-deployment-company-info span {
    margin-bottom: 5px;

    color: #737f8b;

    font-size: 10px;
    font-weight: 500;
}

.fs-deployment-company-info strong {
    overflow: hidden;

    color: #e7ebef;

    font-size: 12px;
    font-weight: 650;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.fs-text-success {
    color: #31dc89 !important;
}

.fs-text-warning {
    color: #ffb83e !important;
}


/* =========================================================
   EMPTY / LIMIT REACHED
========================================================= */

.fs-company-deployment-page .fs-empty {
    min-height: 110px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 20px;

    box-sizing: border-box;

    color: #7f8995;

    text-align: center;

    font-size: 12px;
    font-weight: 500;
}

.fs-company-deployment-layout
.fs-panel:first-child
.fs-empty {
    position: relative;

    color: #b0b8c1;

    background:
        radial-gradient(
            circle at 50% 100%,
            rgba(255, 40, 55, .06),
            transparent 55%
        );
}


/* =========================================================
   SUCCESS / ERROR RESULT
========================================================= */

.fs-deployment-message {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    margin-bottom: 14px;
    padding: 15px 17px;

    border-radius: 10px;
    border: 1px solid #28313b;
}

.fs-deployment-message > div:first-child {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fs-deployment-message strong {
    color: #f2f5f7;
    font-size: 13px;
}

.fs-deployment-message span {
    color: #8e98a3;
    font-size: 11px;
}

.fs-deployment-message.success {
    background: rgba(25, 185, 109, .07);
    border-color: rgba(31, 214, 128, .25);
}

.fs-deployment-message.error {
    background: rgba(255, 38, 58, .07);
    border-color: rgba(255, 38, 58, .28);
}

.fs-deployment-created-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.fs-deployment-hash {
    max-width: 380px;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    font-family: "Share Tech Mono", monospace;
}


/* =========================================================
   HISTORY
========================================================= */

.fs-deployment-history-panel {
    margin-top: 0 !important;
}

.fs-deployment-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.fs-deployment-table {
    width: 100%;

    border-collapse: collapse;
    table-layout: auto;
}

.fs-deployment-table th {
    padding: 0 13px 11px;

    color: #65717d;

    font-family: "Share Tech Mono", monospace;
    font-size: 9px;
    font-weight: 500;

    letter-spacing: 1px;
    text-align: left;
    text-transform: uppercase;

    white-space: nowrap;
}

.fs-deployment-table td {
    height: 53px;

    padding: 0 13px;

    color: #b9c1c9;

    border-top: 1px solid #1d252d;

    font-size: 11px;

    vertical-align: middle;
}

.fs-deployment-table tbody tr {
    transition:
        background .15s ease,
        box-shadow .15s ease;
}

.fs-deployment-table tbody tr:hover {
    background: rgba(255, 255, 255, .018);
}

.fs-deployment-table td:first-child {
    color: #e9edf0;
    font-weight: 700;
}

.fs-deployment-table td:nth-child(2) {
    color: #e1e5e9;
    font-weight: 600;
}

.fs-deployment-table td:nth-child(4) strong {
    color: #e9edf0;
    font-size: 11px;
}


/* ---------- STATUS BADGES ---------- */

.fs-deployment-table .fs-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 64px;

    box-sizing: border-box;

    padding: 5px 8px;

    border-radius: 5px;

    font-family: "Share Tech Mono", monospace;
    font-size: 9px;
    font-weight: 700;

    letter-spacing: .5px;
}

.fs-deployment-table .fs-badge.success {
    color: #32df8c;

    background: rgba(27, 190, 111, .10);
    border: 1px solid rgba(39, 217, 132, .25);
}

.fs-deployment-table .fs-badge.warning {
    color: #ffb842;

    background: rgba(255, 171, 35, .10);
    border: 1px solid rgba(255, 177, 48, .25);
}

.fs-deployment-table .fs-badge.danger {
    color: #ff5364;

    background: rgba(255, 40, 59, .10);
    border: 1px solid rgba(255, 40, 59, .28);
}


/* ---------- DOWNLOAD ---------- */

.fs-deployment-download {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 70px;
    height: 29px;

    padding: 0 11px;

    box-sizing: border-box;

    color: #ffffff;
    background: rgba(255, 36, 55, .10);

    border: 1px solid rgba(255, 36, 55, .32);
    border-radius: 6px;

    font-size: 10px;
    font-weight: 700;

    text-decoration: none;

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

.fs-deployment-download:hover {
    background: rgba(255, 36, 55, .18);
    border-color: rgba(255, 36, 55, .58);

    box-shadow:
        0 0 16px rgba(255, 36, 55, .08);
}

.fs-deployment-missing {
    color: #606b76;
    font-size: 10px;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1250px) {

    .fs-company-deployment-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .fs-company-deployment-layout {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 900px) {

    .fs-deployment-form {
        grid-template-columns: 1fr;
    }

    .fs-deployment-form .fs-btn {
        width: 100%;
    }

    .fs-deployment-created-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .fs-deployment-message {
        align-items: stretch;
        flex-direction: column;
    }

}


@media (max-width: 650px) {

    .fs-company-deployment-kpis {
        grid-template-columns: 1fr;
    }

    .fs-deployment-company-info {
        grid-template-columns: 1fr;
    }

}

/* =========================================================
   ENDPOINT DETAIL
========================================================= */

.fs-endpoint-detail-page {
    padding-top: 24px;
    padding-bottom: 42px;
}


/* HEADER */

.fs-endpoint-detail-head {
    margin-bottom: 18px;
}

.fs-endpoint-title-row {
    display: flex;
    align-items: center;
    gap: 14px;

    margin-top: 7px;
}

.fs-endpoint-title-row .fs-page-title {
    margin: 0;
    font-size: 34px;
    line-height: 1;
    letter-spacing: -.7px;
}

.fs-endpoint-title-row .fs-badge {
    flex: 0 0 auto;
}


/* KPI */

.fs-endpoint-detail-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;

    margin-bottom: 14px;
}

.fs-endpoint-detail-kpi {
    min-height: 108px;

    padding: 17px 18px;

    box-sizing: border-box;

    border: 1px solid #202832;
    border-radius: 10px;

    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 35, 55, .09),
            transparent 37%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );
}

.fs-endpoint-detail-kpi.success {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(50, 220, 137, .11),
            transparent 37%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );
}

.fs-endpoint-detail-kpi.warning {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 174, 32, .12),
            transparent 37%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );
}

.fs-endpoint-detail-kpi.danger {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 36, 58, .14),
            transparent 37%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );
}

.fs-endpoint-detail-kpi.info {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(50, 169, 255, .11),
            transparent 37%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );
}

.fs-endpoint-detail-kpi span {
    display: block;

    color: #7e8995;

    font-family: "Share Tech Mono", monospace;
    font-size: 9px;
    font-weight: 600;

    letter-spacing: .8px;
    text-transform: uppercase;
}

.fs-endpoint-detail-kpi strong {
    display: block;

    margin-top: 8px;

    color: #f4f7fa;

    font-size: 24px;
    font-weight: 800;
    line-height: 1;
}

.fs-endpoint-detail-kpi small {
    display: block;

    margin-top: 8px;

    color: #7f8994;

    font-size: 10px;
}

.fs-endpoint-kpi-time {
    font-size: 15px !important;
    line-height: 1.25 !important;
}


/* STATUS */

.fs-endpoint-status-message {
    display: flex;
    flex-direction: column;
    gap: 5px;

    margin-bottom: 12px;
    padding: 13px 15px;

    border-radius: 9px;

    border: 1px solid #28313a;

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

.fs-endpoint-status-message strong {
    color: #f0f3f6;
    font-size: 12px;
}

.fs-endpoint-status-message span {
    color: #8b95a0;
    font-size: 10.5px;
}

.fs-endpoint-status-message.info {
    border-color: rgba(61,174,255,.25);
    background: rgba(61,174,255,.055);
}

.fs-endpoint-status-message.warning {
    border-color: rgba(255,174,32,.24);
    background: rgba(255,174,32,.055);
}


/* MAIN GRID */

.fs-endpoint-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(420px, .85fr);
    gap: 14px;

    align-items: stretch;

    margin-bottom: 14px;
}

.fs-endpoint-detail-grid .fs-panel {
    margin: 0;
}


/* INFO */

.fs-endpoint-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
}

.fs-endpoint-info-grid > div {
    min-width: 0;

    padding: 11px 12px;

    border: 1px solid #1e2730;
    border-radius: 8px;

    background: rgba(7,12,17,.62);
}

.fs-endpoint-info-grid span {
    display: block;

    margin-bottom: 5px;

    color: #788490;

    font-size: 10px;
    font-weight: 500;
}

.fs-endpoint-info-grid strong {
    display: block;

    overflow: hidden;

    color: #e8ecf0;

    font-size: 11px;
    font-weight: 650;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.fs-endpoint-info-wide {
    grid-column: span 2;
}


/* PROTECTION */

.fs-endpoint-protection-state {
    margin-bottom: 16px;
    padding: 14px 15px;

    border-radius: 9px;
    border: 1px solid #26303a;

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

.fs-endpoint-protection-state.active {
    border-color: rgba(49,220,137,.22);
    background: rgba(49,220,137,.045);
}

.fs-endpoint-protection-state.maintenance {
    border-color: rgba(255,174,32,.24);
    background: rgba(255,174,32,.05);
}

.fs-endpoint-protection-state span {
    display: block;

    color: #78838e;

    font-size: 10px;
}

.fs-endpoint-protection-state strong {
    display: block;

    margin-top: 5px;

    color: #fff;

    font-size: 14px;
}

.fs-endpoint-protection-state small {
    display: block;

    margin-top: 5px;

    color: #8c96a1;

    font-size: 10px;
}

.fs-endpoint-action-title {
    margin-bottom: 9px;

    color: #9fa8b2;

    font-size: 10px;
    font-weight: 650;
}

.fs-endpoint-action-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
}

.fs-endpoint-action-grid form {
    margin: 0;
}

.fs-endpoint-action-wide {
    grid-column: 1 / -1;
}

.fs-endpoint-action-btn {
    width: 100%;
    min-height: 38px;

    border-radius: 7px;

    border: 1px solid #2b343e;

    background: #0a0f14;

    color: #e9edf1;

    font-size: 10px;
    font-weight: 700;

    cursor: pointer;

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

.fs-endpoint-action-btn.warning:hover {
    border-color: rgba(255,174,32,.45);
    background: rgba(255,174,32,.08);

    box-shadow:
        0 0 15px rgba(255,174,32,.06);
}


/* ISOLATION */

.fs-endpoint-isolation-panel {
    margin-top: 0 !important;
}

.fs-endpoint-isolation-layout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.fs-endpoint-isolation-info {
    display: grid;
    grid-template-columns: repeat(2, minmax(180px,1fr));
    gap: 10px;

    flex: 1;
}

.fs-endpoint-isolation-info > div {
    padding: 11px 12px;

    border: 1px solid #1f2831;
    border-radius: 8px;

    background: rgba(7,12,17,.62);
}

.fs-endpoint-isolation-info span {
    display: block;

    margin-bottom: 5px;

    color: #77828e;
    font-size: 10px;
}

.fs-endpoint-isolation-info strong {
    color: #edf1f4;
    font-size: 12px;
}

.fs-endpoint-isolation-action {
    flex: 0 0 auto;
}


/* MAIN ACTIONS */

.fs-endpoint-main-action {
    min-height: 42px;

    padding: 0 17px;

    border-radius: 8px;

    border: 1px solid transparent;

    font-size: 11px;
    font-weight: 800;

    cursor: pointer;

    transition:
        transform .16s ease,
        box-shadow .16s ease,
        background .16s ease;
}

.fs-endpoint-main-action:hover {
    transform: translateY(-1px);
}

.fs-endpoint-main-action.success {
    color: #07130d;

    background: #36dc8b;

    box-shadow:
        0 0 16px rgba(54,220,139,.12);
}

.fs-endpoint-main-action.danger {
    color: #fff;

    background: #ff2638;

    box-shadow:
        0 0 18px rgba(255,38,56,.14);
}


/* RESPONSIVE */

@media (max-width: 1200px) {

    .fs-endpoint-detail-kpis {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .fs-endpoint-detail-grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 700px) {

    .fs-endpoint-detail-kpis,
    .fs-endpoint-info-grid {
        grid-template-columns: 1fr;
    }

    .fs-endpoint-info-wide {
        grid-column: auto;
    }

    .fs-endpoint-action-grid {
        grid-template-columns: 1fr;
    }

    .fs-endpoint-action-wide {
        grid-column: auto;
    }

    .fs-endpoint-isolation-layout {
        align-items: stretch;
        flex-direction: column;
    }

    .fs-endpoint-isolation-info {
        grid-template-columns: 1fr;
    }

    .fs-endpoint-isolation-action,
    .fs-endpoint-isolation-action form,
    .fs-endpoint-main-action {
        width: 100%;
    }

}

/* =========================================================
   COMPANY ALERTS
========================================================= */

.fs-company-alerts-page {
    padding-top: 24px;
    padding-bottom: 42px;
}


/* HEADER */

.fs-company-alerts-page .fs-page-head {
    margin-bottom: 18px;
}

.fs-company-alerts-page .fs-page-title {
    margin: 6px 0 5px;
    font-size: 32px;
    line-height: 1;
    font-weight: 800;
}

.fs-company-alerts-page .fs-page-subtitle {
    color: #89949f;
    font-size: 12px;
}


/* KPI */

.fs-company-alert-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.fs-company-alert-kpi {
    position: relative;
    overflow: hidden;

    min-height: 105px;
    padding: 17px 18px;

    border: 1px solid #202832;
    border-radius: 10px;

    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,35,55,.08),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );
}

.fs-company-alert-kpi.danger {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,36,58,.14),
            transparent 38%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-alert-kpi.warning {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,174,32,.13),
            transparent 38%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-alert-kpi.info {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(53,174,255,.12),
            transparent 38%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-alert-kpi.success {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(49,220,137,.11),
            transparent 38%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-company-alert-kpi span {
    display: block;

    color: #798591;

    font-family: "Share Tech Mono", monospace;
    font-size: 9px;
    font-weight: 600;

    letter-spacing: .8px;
    text-transform: uppercase;
}

.fs-company-alert-kpi strong {
    display: block;

    margin-top: 7px;

    color: #f4f7fa;

    font-size: 27px;
    line-height: 1;
    font-weight: 800;
}

.fs-company-alert-kpi small {
    display: block;

    margin-top: 8px;

    color: #7f8994;

    font-size: 10px;
}


/* PANEL */

.fs-company-alerts-panel {
    overflow: hidden;
}

.fs-company-alerts-panel .fs-panel-head {
    min-height: 52px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 16px;

    border-bottom: 1px solid #1d252d;
}

.fs-company-alerts-panel .fs-panel-title {
    display: flex;
    align-items: center;
    gap: 8px;

    color: #eef2f5;

    font-size: 14px;
    font-weight: 750;
}


/* TOOLBAR */

.fs-company-alert-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;

    padding: 12px 16px;

    border-bottom: 1px solid #1c242c;

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

.fs-company-alert-search {
    flex: 1;
}

.fs-company-alert-search input {
    width: 100%;
    height: 40px;

    box-sizing: border-box;

    padding: 0 13px;

    border: 1px solid #26303a;
    border-radius: 8px;

    outline: none;

    background: #080d12;
    color: #ffffff;

    font-size: 11px;

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

.fs-company-alert-search input::placeholder {
    color: #65717d;
}

.fs-company-alert-search input:focus {
    border-color: rgba(255,35,55,.5);

    box-shadow:
        0 0 0 3px rgba(255,35,55,.05);
}


/* FILTERS */

.fs-company-alert-filters {
    display: flex;
    align-items: center;
    gap: 6px;
}

.fs-company-alert-filters button {
    height: 32px;

    padding: 0 10px;

    border: 1px solid #252e37;
    border-radius: 7px;

    background: #0a0f14;

    color: #89949f;

    font-size: 9.5px;
    font-weight: 700;

    cursor: pointer;

    transition:
        color .16s ease,
        border-color .16s ease,
        background .16s ease;
}

.fs-company-alert-filters button:hover {
    color: #ffffff;
    border-color: #394550;
}

.fs-company-alert-filters button.active {
    color: #ffffff;

    border-color: rgba(255,35,55,.45);

    background: rgba(255,35,55,.10);

    box-shadow:
        0 0 12px rgba(255,35,55,.05);
}


/* TABLE */

.fs-company-alerts-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.fs-company-alerts-table {
    width: 100%;

    border-collapse: collapse;

    table-layout: auto;
}

.fs-company-alerts-table th {
    height: 42px;

    padding: 0 13px;

    color: #65717d;

    font-family: "Share Tech Mono", monospace;
    font-size: 9px;
    font-weight: 500;

    letter-spacing: .8px;
    text-align: left;
    text-transform: uppercase;

    white-space: nowrap;
}

.fs-company-alerts-table td {
    min-height: 52px;

    padding: 11px 13px;

    border-top: 1px solid #1d252d;

    color: #aeb7c0;

    font-size: 10.5px;

    vertical-align: middle;
}

.fs-company-alerts-table tbody tr {
    position: relative;

    transition:
        background .15s ease;
}

.fs-company-alerts-table tbody tr:hover {
    background: rgba(255,255,255,.017);
}

.fs-company-alerts-table tbody tr[hidden] {
    display: none;
}


/* ALERT NAME */

.fs-company-alert-name {
    color: #eef2f5 !important;

    font-size: 11px;
    font-weight: 700;

    text-decoration: none;
}

.fs-company-alert-name:hover {
    color: #ffffff !important;
}


/* BADGES */

.fs-company-alerts-table .fs-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 76px;

    box-sizing: border-box;

    padding: 5px 8px;

    border-radius: 6px;

    font-family: "Share Tech Mono", monospace;
    font-size: 9px;
    font-weight: 700;

    letter-spacing: .3px;
}

.fs-company-alerts-table .fs-badge.danger {
    color: #ff5364;

    border: 1px solid rgba(255,37,56,.30);
    background: rgba(255,37,56,.10);
}

.fs-company-alerts-table .fs-badge.warning {
    color: #ffb842;

    border: 1px solid rgba(255,174,32,.28);
    background: rgba(255,174,32,.09);
}

.fs-company-alerts-table .fs-badge.info {
    color: #50bfff;

    border: 1px solid rgba(53,174,255,.28);
    background: rgba(53,174,255,.08);
}

.fs-company-alerts-table .fs-badge.success {
    color: #3fe293;

    border: 1px solid rgba(49,220,137,.25);
    background: rgba(49,220,137,.08);
}


/* STATUS */

.fs-company-alert-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 63px;

    box-sizing: border-box;

    padding: 5px 8px;

    border-radius: 6px;

    color: #72bcff;

    border: 1px solid rgba(72,167,255,.22);

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

    font-size: 9px;
    font-weight: 700;
}


/* EMPTY */

.fs-company-alerts-page .fs-empty {
    min-height: 130px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #77828e;

    font-size: 11px;

    text-align: center;
}


/* RESPONSIVE */

@media (max-width: 1250px) {

    .fs-company-alert-kpis {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }

    .fs-company-alert-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .fs-company-alert-filters {
        flex-wrap: wrap;
    }
}

@media (max-width: 700px) {

    .fs-company-alert-kpis {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

/* =========================================================
   ALERT DETAIL — INVESTIGATION
========================================================= */

.fs-alert-detail-page {
    padding-top: 24px;
    padding-bottom: 42px;
}


/* HEADER */

.fs-alert-detail-head {
    margin-bottom: 18px;
}

.fs-alert-detail-title-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 25px;

    margin-top: 9px;
}

.fs-alert-detail-title-row .fs-page-title {
    max-width: 1000px;

    margin: 5px 0;

    font-size: 31px;
    line-height: 1.1;
    font-weight: 800;

    letter-spacing: -.6px;
}


/* SEVERITY */

.fs-alert-detail-severity {
    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 36px;

    padding: 0 12px;

    border-radius: 7px;

    font-family: "Share Tech Mono", monospace;
    font-size: 10px;
    font-weight: 700;
}

.fs-alert-detail-severity.danger {
    color: #ff5868;

    border: 1px solid rgba(255,36,58,.32);
    background: rgba(255,36,58,.10);
}

.fs-alert-detail-severity.warning {
    color: #ffb742;

    border: 1px solid rgba(255,174,32,.30);
    background: rgba(255,174,32,.09);
}

.fs-alert-detail-severity.info {
    color: #54bfff;

    border: 1px solid rgba(50,174,255,.28);
    background: rgba(50,174,255,.08);
}

.fs-alert-detail-severity.success {
    color: #40df91;

    border: 1px solid rgba(49,220,137,.25);
    background: rgba(49,220,137,.08);
}


/* KPI */

.fs-alert-detail-kpis {
    display: grid;

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

    gap: 12px;

    margin-bottom: 14px;
}

.fs-alert-detail-kpi {
    min-height: 105px;

    padding: 17px 18px;

    box-sizing: border-box;

    border: 1px solid #202832;
    border-radius: 10px;

    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,35,55,.08),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            #0b0f14,
            #080b10
        );
}

.fs-alert-detail-kpi.danger {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,36,58,.14),
            transparent 38%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-alert-detail-kpi.warning {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,174,32,.12),
            transparent 38%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-alert-detail-kpi.info {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(50,174,255,.11),
            transparent 38%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-alert-detail-kpi.success {
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(49,220,137,.11),
            transparent 38%
        ),
        linear-gradient(145deg,#0b0f14,#080b10);
}

.fs-alert-detail-kpi span {
    display: block;

    color: #798591;

    font-family: "Share Tech Mono", monospace;
    font-size: 9px;

    letter-spacing: .7px;
    text-transform: uppercase;
}

.fs-alert-detail-kpi strong {
    display: block;

    margin-top: 7px;

    overflow: hidden;

    color: #f1f4f7;

    font-size: 19px;
    font-weight: 800;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.fs-alert-detail-kpi small {
    display: block;

    margin-top: 7px;

    color: #7c8792;

    font-size: 10px;
}

.fs-alert-detail-time {
    font-size: 14px !important;
}


/* MAIN */

.fs-alert-detail-main-grid {
    display: grid;

    grid-template-columns:
        minmax(0,1.2fr)
        minmax(380px,.8fr);

    gap: 14px;

    margin-bottom: 14px;
}

.fs-alert-detail-main-grid .fs-panel {
    margin: 0;
}


/* EVENT INFO */

.fs-alert-info-grid {
    display: grid;

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

    gap: 10px;
}

.fs-alert-info-grid > div {
    min-width: 0;

    padding: 11px 12px;

    border: 1px solid #1e2730;
    border-radius: 8px;

    background: rgba(7,12,17,.62);
}

.fs-alert-info-grid span {
    display: block;

    margin-bottom: 5px;

    color: #78848f;
    font-size: 10px;
}

.fs-alert-info-grid strong {
    display: block;

    overflow: hidden;

    color: #e9edf0;

    font-size: 11px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* SOC */

.fs-alert-soc-state {
    padding: 15px;

    border: 1px solid rgba(50,174,255,.20);
    border-radius: 9px;

    background: rgba(50,174,255,.045);
}

.fs-alert-soc-state span {
    display: block;

    color: #788590;

    font-size: 10px;
}

.fs-alert-soc-state strong {
    display: block;

    margin-top: 5px;

    color: #eaf1f6;

    font-size: 14px;
}

.fs-alert-soc-state small {
    display: block;

    margin-top: 6px;

    color: #8b96a0;

    font-size: 10px;
}

.fs-alert-soc-actions {
    display: flex;
    gap: 9px;

    margin-top: 14px;
}

.fs-alert-soc-actions form {
    margin: 0;
}

.fs-alert-action-btn {
    min-height: 38px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    padding: 0 14px;

    border: 1px solid #2b353f;
    border-radius: 7px;

    background: #0a0f14;

    color: #e9edf1;

    font-size: 10px;
    font-weight: 700;

    text-decoration: none;

    cursor: pointer;
}

.fs-alert-action-btn.primary {
    color: #fff;

    border-color: rgba(255,36,58,.38);

    background: rgba(255,36,58,.12);
}

.fs-alert-action-btn:hover {
    border-color: rgba(255,36,58,.55);
}


/* CLASSIFICATION */

.fs-alert-classification-panel {
    margin-bottom: 14px;
}

.fs-alert-classification-grid {
    display: grid;

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

    gap: 10px;
}

.fs-alert-classification-grid > div {
    min-width: 0;

    padding: 11px 12px;

    border: 1px solid #1e2730;
    border-radius: 8px;

    background: rgba(7,12,17,.62);
}

.fs-alert-classification-grid span {
    display: block;

    margin-bottom: 5px;

    color: #78848f;

    font-size: 10px;
}

.fs-alert-classification-grid strong {
    color: #e6ebef;

    font-size: 11px;
    line-height: 1.45;
}

.fs-alert-classification-wide {
    grid-column: 1 / -1;
}


/* ORIGINAL DESCRIPTION */

.fs-alert-description-panel {
    margin-bottom: 14px;
}

.fs-alert-original-description {
    padding: 13px 14px;

    border: 1px solid #1e2730;
    border-radius: 8px;

    background: rgba(7,12,17,.62);

    color: #cbd2d9;

    font-size: 11px;
    line-height: 1.6;
}


/* LOG / JSON */

.fs-alert-code-panel {
    margin-bottom: 14px;
}

.fs-alert-code-panel summary {
    cursor: pointer;

    list-style: none;
}

.fs-alert-code-panel summary::-webkit-details-marker {
    display: none;
}

.fs-alert-code-panel summary > span {
    color: #697580;

    font-size: 9px;
}

.fs-alert-code-panel pre {
    margin: 0;

    max-height: 520px;

    overflow: auto;

    padding: 14px;

    border: 1px solid #1d252d;
    border-radius: 8px;

    background: #060a0e;

    color: #aab4bd;

    font-family: "Share Tech Mono", monospace;
    font-size: 10.5px;

    line-height: 1.55;

    white-space: pre-wrap;
    word-break: break-word;
}


/* RESPONSIVE */

@media (max-width: 1200px) {

    .fs-alert-detail-kpis {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .fs-alert-detail-main-grid {
        grid-template-columns: 1fr;
    }

    .fs-alert-classification-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 700px) {

    .fs-alert-detail-title-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .fs-alert-detail-kpis,
    .fs-alert-info-grid,
    .fs-alert-classification-grid {
        grid-template-columns: 1fr;
    }

    .fs-alert-classification-wide {
        grid-column: auto;
    }

    .fs-alert-soc-actions {
        flex-direction: column;
    }

    .fs-alert-action-btn,
    .fs-alert-soc-actions form,
    .fs-alert-soc-actions button {
        width: 100%;
    }
}

/* =========================================================
   CASE MANAGEMENT
========================================================= */

.fs-case-management-block {
    padding: 14px 0;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.fs-case-management-block:first-child {
    padding-top: 0;
}

.fs-case-management-block:last-child {
    border-bottom: 0;
}

.fs-case-management-label {
    margin-bottom: 10px;

    color: #7d8995;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .5px;
    text-transform: uppercase;
}


/* ASSIGNED USER */

.fs-case-assigned-user {
    display: flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 12px;
    padding: 10px 11px;

    border: 1px solid #202932;
    border-radius: 8px;

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

.fs-case-assigned-avatar {
    width: 34px;
    height: 34px;

    display: grid;
    place-items: center;

    flex: 0 0 auto;

    border: 1px solid rgba(255,38,56,.4);
    border-radius: 50%;

    color: #fff;

    font-size: 12px;
    font-weight: 800;
}

.fs-case-assigned-user strong {
    display: block;

    color: #eef2f5;

    font-size: 11px;
}

.fs-case-assigned-user span {
    display: block;

    margin-top: 3px;

    color: #74808c;

    font-size: 9.5px;
}

.fs-case-unassigned {
    margin-bottom: 12px;
    padding: 11px;

    border: 1px dashed #27313a;
    border-radius: 8px;

    color: #737e89;

    font-size: 10px;
}


/* ACTION BUTTON */

.fs-case-action {
    min-height: 38px;

    padding: 0 14px;

    border: 1px solid #303a44;
    border-radius: 7px;

    background: #0a0f14;

    color: #edf1f4;

    font-size: 10px;
    font-weight: 700;

    cursor: pointer;

    transition:
        background .16s ease,
        border-color .16s ease,
        transform .16s ease;
}

.fs-case-action:hover {
    transform: translateY(-1px);
    border-color: rgba(255,38,56,.5);
}

.fs-case-action.primary {
    border-color: rgba(255,38,56,.45);

    background:
        rgba(255,38,56,.11);

    color: #fff;
}


/* STATUS FORM */

.fs-case-status-form {
    display: grid;
    gap: 10px;
}

.fs-case-select {
    width: 100%;
    height: 41px;

    box-sizing: border-box;

    padding: 0 11px;

    outline: none;

    border: 1px solid #27313b;
    border-radius: 8px;

    background: #080d12;

    color: #edf1f4;

    font-size: 11px;
}

.fs-case-select:focus {
    border-color:
        rgba(255,38,56,.55);
}


/* RESOLUTION */

.fs-case-resolution-field {
    display: none;
}

.fs-case-resolution-field.required {
    display: block;
}

.fs-case-resolution-field label {
    display: block;

    margin-bottom: 6px;

    color: #9ca6b0;

    font-size: 10px;
    font-weight: 650;
}

.fs-case-resolution-field textarea,
.fs-case-note-form textarea {
    width: 100%;

    box-sizing: border-box;

    resize: vertical;

    padding: 11px 12px;

    outline: none;

    border: 1px solid #27313b;
    border-radius: 8px;

    background: #080d12;

    color: #edf1f4;

    font-family: inherit;
    font-size: 11px;

    line-height: 1.55;
}

.fs-case-resolution-field textarea:focus,
.fs-case-note-form textarea:focus {
    border-color:
        rgba(255,38,56,.55);

    box-shadow:
        0 0 0 3px
        rgba(255,38,56,.05);
}

.fs-case-resolution-field small {
    display: block;

    margin-top: 5px;

    color: #68747f;

    font-size: 9px;
}

.fs-case-resolution-box {
    margin-top: 14px;
    padding: 13px;

    border: 1px solid
        rgba(51,220,139,.18);

    border-radius: 8px;

    background:
        rgba(51,220,139,.04);
}

.fs-case-resolution-box span {
    display: block;

    margin-bottom: 6px;

    color: #719080;

    font-size: 9px;

    text-transform: uppercase;
}

.fs-case-resolution-box strong {
    color: #dfe7e2;

    font-size: 10.5px;
    font-weight: 500;

    line-height: 1.55;
}


/* CLOSED */

.fs-case-closed-state {
    padding: 13px;

    border: 1px solid
        rgba(51,220,139,.20);

    border-radius: 8px;

    background:
        rgba(51,220,139,.045);
}

.fs-case-closed-state strong {
    display: block;

    color: #3cde8f;

    font-size: 11px;
}

.fs-case-closed-state span {
    display: block;

    margin-top: 5px;

    color: #7e8d84;

    font-size: 10px;
}


/* NOTES */

.fs-case-note-form {
    margin-bottom: 17px;
    padding-bottom: 17px;

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

.fs-case-note-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;

    margin-top: 9px;
}

.fs-case-note-actions span {
    color: #697580;

    font-size: 9.5px;
}

/* =========================================================
   CASE TIMELINE
========================================================= */

.fs-case-timeline {
    position: relative;
    display: flex;
    flex-direction: column;
}

.fs-case-timeline-item {
    position: relative;

    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);

    min-height: 84px;
}

.fs-case-timeline-marker {
    position: relative;

    display: flex;
    justify-content: center;
}

.fs-case-timeline-marker::after {
    content: "";

    position: absolute;

    top: 25px;
    bottom: 0;

    width: 1px;

    background:
        linear-gradient(
            to bottom,
            rgba(255, 40, 60, .35),
            rgba(255, 40, 60, .05)
        );
}

.fs-case-timeline-item:last-child
.fs-case-timeline-marker::after {
    display: none;
}

.fs-case-timeline-marker span {
    position: relative;
    z-index: 2;

    width: 10px;
    height: 10px;

    margin-top: 8px;

    border: 2px solid #ff3048;
    border-radius: 50%;

    background: #0b1016;

    box-shadow:
        0 0 13px
        rgba(255, 48, 72, .24);
}

.fs-case-timeline-content {
    margin-left: 5px;
    margin-bottom: 14px;

    padding: 12px 14px;

    border: 1px solid #1f2831;
    border-radius: 9px;

    background:
        rgba(8, 13, 18, .72);
}

.fs-case-timeline-top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 14px;
}

.fs-case-timeline-top strong {
    color: #eef2f5;

    font-size: 11px;
    font-weight: 700;
}

.fs-case-timeline-top time {
    color: #68747f;

    font-family:
        "Share Tech Mono",
        monospace;

    font-size: 9px;

    white-space: nowrap;
}

.fs-case-timeline-description {
    margin-top: 6px;

    color: #aab3bc;

    font-size: 10.5px;

    line-height: 1.45;
}

.fs-case-timeline-meta {
    display: flex;
    flex-wrap: wrap;

    gap: 12px;

    margin-top: 8px;
}

.fs-case-timeline-meta span {
    color: #64717c;

    font-size: 9px;
}

/* =========================================================
   CASE ENDPOINT ACTIONS
========================================================= */

.fs-case-endpoint-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.fs-case-endpoint-actions form {
    margin: 0;
}

.fs-case-maintenance-label {
    margin-top: 14px;
}

.fs-case-action.danger {
    color: #fff;
    border-color: rgba(255, 45, 65, .45);
    background: rgba(255, 45, 65, .12);
}

.fs-case-action.danger:hover {
    border-color: rgba(255, 45, 65, .75);
    background: rgba(255, 45, 65, .18);
}

.fs-case-action.warning {
    color: #ffc35a;
    border-color: rgba(255, 174, 32, .30);
    background: rgba(255, 174, 32, .07);
}

.fs-case-action.warning:hover {
    border-color: rgba(255, 174, 32, .55);
    background: rgba(255, 174, 32, .12);
}

.fs-case-action.success {
    color: #3fe293;
    border-color: rgba(49, 220, 137, .28);
    background: rgba(49, 220, 137, .07);
}

.fs-case-action.success:hover {
    border-color: rgba(49, 220, 137, .55);
    background: rgba(49, 220, 137, .12);
}

/* =========================================================
   CASE ANALYST ASSIGNMENT
========================================================= */

.fs-case-assign-specific {
    margin-top: 14px;
    padding-top: 14px;

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

.fs-case-assign-form {
    display: grid;

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

    gap: 8px;

    align-items: center;
}

.fs-case-assign-form .fs-case-select {
    min-width: 0;
}

.fs-case-assign-form .fs-case-action {
    height: 41px;

    white-space: nowrap;
}

@media (max-width: 700px) {

    .fs-case-assign-form {
        grid-template-columns: 1fr;
    }

    .fs-case-assign-form
    .fs-case-action {
        width: 100%;
    }
}

.fs-user-role-form {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.fs-user-role-form .fs-case-select {
    min-width: 190px;
}

/* =========================================================
   USER ADMIN TIMELINE
========================================================= */

.fs-user-timeline {
    display: flex;
    flex-direction: column;
}

.fs-user-timeline-item {
    display: grid;
    grid-template-columns: 30px minmax(0,1fr);
    min-height: 82px;
}

.fs-user-timeline-marker {
    position: relative;
    display: flex;
    justify-content: center;
}

.fs-user-timeline-marker::after {
    content: "";
    position: absolute;
    top: 25px;
    bottom: 0;
    width: 1px;

    background:
        linear-gradient(
            to bottom,
            rgba(255,40,60,.32),
            rgba(255,40,60,.05)
        );
}

.fs-user-timeline-item:last-child
.fs-user-timeline-marker::after {
    display: none;
}

.fs-user-timeline-marker span {
    position: relative;
    z-index: 2;

    width: 9px;
    height: 9px;

    margin-top: 8px;

    border: 2px solid #ff3048;
    border-radius: 50%;

    background: #0b1016;

    box-shadow:
        0 0 12px
        rgba(255,48,72,.20);
}

.fs-user-timeline-content {
    margin-left: 5px;
    margin-bottom: 14px;

    padding: 12px 14px;

    border: 1px solid #1f2831;
    border-radius: 9px;

    background: rgba(8,13,18,.72);
}

.fs-user-timeline-top {
    display: flex;
    justify-content: space-between;
    align-items: center;

    gap: 12px;
}

.fs-user-timeline-top strong {
    color: #eef2f5;
    font-size: 11px;
}

.fs-user-timeline-top time {
    color: #68747f;
    font-size: 9px;

    font-family:
        "Share Tech Mono",
        monospace;
}

.fs-user-timeline-description {
    margin-top: 6px;

    color: #aab3bc;

    font-size: 10.5px;
    line-height: 1.45;
}

.fs-user-timeline-meta {
    display: flex;
    flex-wrap: wrap;

    gap: 12px;

    margin-top: 8px;
}

.fs-user-timeline-meta span {
    color: #64717c;
    font-size: 9px;
}

/* =========================================================
   COMPANY CREATE MODAL
========================================================= */

.fs-company-create-overlay {
    position: fixed;
    inset: 0;

    z-index: 9999;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 24px;

    background:
        rgba(0, 0, 0, .72);

    backdrop-filter:
        blur(5px);
}

.fs-company-create-overlay[hidden] {
    display: none;
}

.fs-company-create-modal {
    width:
        min(760px, calc(100vw - 48px));

    max-height:
        calc(100vh - 48px);

    overflow-y: auto;

    padding: 24px;

    border:
        1px solid rgba(255, 30, 45, .35);

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            #0b0f14,
            #07090d
        );

    box-shadow:
        0 30px 100px rgba(0,0,0,.65),
        0 0 50px rgba(255,30,45,.08);
}

.fs-company-create-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;

    padding-bottom: 18px;
    margin-bottom: 18px;

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

.fs-company-create-kicker {
    margin-bottom: 6px;

    color: var(--fs-red);

    font-family: var(--fs-mono);
    font-size: 10px;
    font-weight: 700;

    letter-spacing: 2px;
}

.fs-company-create-head h2 {
    margin: 0 0 6px;

    color: #fff;

    font-size: 22px;
    font-weight: 800;
}

.fs-company-create-head p {
    margin: 0;

    max-width: 560px;

    color: var(--fs-muted);

    font-size: 12px;
    line-height: 1.55;
}

.fs-company-create-close {
    width: 34px;
    height: 34px;

    flex: 0 0 34px;

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

    border-radius: 8px;

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

    color: #89939e;

    cursor: pointer;

    font-size: 20px;
}

.fs-company-create-close:hover {
    border-color:
        rgba(255,30,45,.55);

    color: #fff;
}

.fs-company-create-form {
    display: grid;

    grid-template-columns:
        minmax(0, 2fr)
        minmax(190px, .8fr);

    gap: 16px;
}

.fs-company-create-field
.fs-form-label {
    margin-top: 0;
}

.fs-company-license-info {
    grid-column: 1 / -1;

    display: flex;
    align-items: center;
    gap: 12px;

    padding: 13px 14px;

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

    border-radius: 9px;

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

.fs-company-license-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    border:
        1px solid rgba(255, 30, 45, .52);

    border-radius: 9px;

    background:
        rgba(255, 30, 45, .11);

    color: #ff2638;

    box-shadow:
        inset 0 0 16px rgba(255, 30, 45, .05),
        0 0 18px rgba(255, 30, 45, .06);
}

.fs-company-license-icon svg {
    width: 21px;
    height: 21px;

    display: block;
}

.fs-company-license-info strong {
    display: block;

    margin-bottom: 3px;

    color: #fff;

    font-size: 12px;
}

.fs-company-license-info span {
    display: block;

    color: var(--fs-muted);

    font-size: 11px;
    line-height: 1.5;
}

.fs-company-create-actions {
    grid-column: 1 / -1;

    display: flex;
    justify-content: flex-end;
    gap: 9px;

    margin-top: 4px;
}

.fs-company-create-message {
    margin-bottom: 16px;
    padding: 11px 13px;

    border-radius: 8px;

    font-size: 12px;
}

.fs-company-create-message.error {
    border:
        1px solid rgba(255,91,103,.30);

    background:
        rgba(255,91,103,.08);

    color: #ffabb2;
}

@media (max-width: 700px) {

    .fs-company-create-modal {
        width:
            calc(100vw - 24px);

        padding: 18px;
    }

    .fs-company-create-form {
        grid-template-columns: 1fr;
    }

    .fs-company-create-actions {
        flex-direction: column-reverse;
    }

    .fs-company-create-actions .fs-btn {
        width: 100%;
    }
}

/* =========================================================
   COMPANY DETAIL ACTIONS
========================================================= */

.fs-company-detail-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 18px;
}

.fs-company-detail-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.fs-company-detail-actions form {
    margin: 0;
}

.fs-company-back-primary {
    display: inline-flex;
    align-items: center;

    min-height: 36px;

    margin-bottom: 12px;
    padding: 8px 13px;

    border:
        1px solid rgba(255,30,45,.75);

    border-radius: 8px;

    background:
        rgba(255,30,45,.13);

    color: #ff3949;

    font-size: 12px;
    font-weight: 800;

    text-decoration: none;

    transition: .18s ease;
}

.fs-company-back-primary:hover {
    background: var(--fs-red);
    color: #09090a;

    box-shadow:
        0 0 22px rgba(255,30,45,.16);
}


/* MODALS */

.fs-company-action-overlay {
    position: fixed;
    inset: 0;

    z-index: 10000;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 24px;

    background:
        rgba(0,0,0,.76);

    backdrop-filter:
        blur(6px);
}

.fs-company-action-overlay[hidden] {
    display: none;
}

.fs-company-action-modal {
    width:
        min(620px, calc(100vw - 40px));

    padding: 24px;

    border:
        1px solid rgba(255,30,45,.32);

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            #0b0f14,
            #07090d
        );

    box-shadow:
        0 30px 100px rgba(0,0,0,.7),
        0 0 45px rgba(255,30,45,.07);
}

.fs-company-action-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;

    padding-bottom: 17px;
    margin-bottom: 18px;

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

.fs-company-action-head span,
.fs-company-delete-copy > span {
    display: block;

    margin-bottom: 6px;

    color: var(--fs-red);

    font-family: var(--fs-mono);
    font-size: 10px;
    font-weight: 800;

    letter-spacing: 1.8px;
}

.fs-company-action-head h2,
.fs-company-delete-copy h2 {
    margin: 0 0 6px;

    font-size: 22px;
}

.fs-company-action-head p,
.fs-company-delete-copy p {
    margin: 0;

    color: var(--fs-muted);

    font-size: 12px;
    line-height: 1.6;
}

.fs-company-action-close {
    width: 34px;
    height: 34px;

    flex: 0 0 34px;

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

    border-radius: 8px;

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

    color: #8d97a2;

    cursor: pointer;

    font-size: 20px;
}

.fs-company-action-close:hover {
    border-color:
        rgba(255,30,45,.5);

    color: #fff;
}

.fs-company-action-note,
.fs-company-delete-confirm {
    margin-top: 16px;
    padding: 12px 13px;

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

    border-radius: 9px;

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

    color: var(--fs-muted);

    font-size: 11px;
    line-height: 1.6;
}

.fs-company-action-buttons {
    display: flex;
    justify-content: flex-end;
    gap: 9px;

    margin-top: 20px;
}


/* DELETE */

.fs-company-action-modal.danger {
    border-color:
        rgba(255,91,103,.42);
}

.fs-company-delete-symbol {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 54px;
    height: 54px;

    margin-bottom: 17px;

    border:
        1px solid rgba(255,91,103,.46);

    border-radius: 50%;

    background:
        rgba(255,91,103,.10);

    color: #ff5b67;

    font-size: 25px;
    font-weight: 900;
}

.fs-company-delete-confirm label {
    display: block;
    margin-bottom: 8px;
}

.fs-btn:disabled {
    opacity: .35;
    cursor: not-allowed;
    transform: none;
}


/* MOBILE */

@media (max-width: 760px) {

    .fs-company-detail-head {
        flex-direction: column;
    }

    .fs-company-detail-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .fs-company-action-buttons {
        flex-direction: column-reverse;
    }

    .fs-company-action-buttons .fs-btn {
        width: 100%;
    }
}

.fs-company-delete-success-overlay {
    position: fixed;
    inset: 0;

    z-index: 12000;

    display: flex;
    align-items: center;
    justify-content: center;

    background:
        rgba(0,0,0,.78);

    backdrop-filter:
        blur(6px);
}

.fs-company-delete-success {
    width: min(420px, calc(100vw - 40px));

    padding: 32px;

    text-align: center;

    border:
        1px solid rgba(69,213,139,.30);

    border-radius: 15px;

    background:
        linear-gradient(
            145deg,
            #0b1014,
            #070a0d
        );

    box-shadow:
        0 30px 100px rgba(0,0,0,.7);
}

.fs-company-delete-success-check {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 72px;
    height: 72px;

    margin:
        0 auto 20px;

    border-radius: 50%;

    background:
        #2fbd78;

    color: #fff;

    font-size: 39px;
    font-weight: 900;

    box-shadow:
        0 0 30px rgba(47,189,120,.20);
}

.fs-company-delete-success h2 {
    margin: 0 0 8px;

    color: #fff;
    font-size: 22px;
}

.fs-company-delete-success p {
    margin: 0;

    color: var(--fs-muted);

    font-size: 12px;
    line-height: 1.6;
}

.fs-company-endpoint-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.fs-endpoint-license-form {
    margin: 0;
}

.fs-endpoint-license-form .fs-btn {
    white-space: nowrap;
}

/* =========================================================
   COMPANY ENDPOINTS PAGE FIX
========================================================= */

.fs-company-endpoints-page {
    padding:
        26px 28px 40px;
}


/* HEADER */

.fs-company-endpoints-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    margin-bottom: 20px;
}

.fs-company-endpoints-head .fs-page-title {
    margin:
        10px 0 6px;

    font-size: 34px;
    line-height: 1.05;
}

.fs-company-endpoints-head
.fs-page-subtitle {
    color: var(--fs-muted);

    font-size: 12px;
}

.fs-company-endpoints-head
.fs-company-back {
    display: inline-flex;
    align-items: center;

    padding: 8px 12px;

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

    border-radius: 8px;

    background:
        rgba(255, 30, 45, .08);

    color: #ff3344;

    font-size: 11px;
    font-weight: 700;

    text-decoration: none;
}

.fs-company-endpoints-head
.fs-company-back:hover {
    background:
        rgba(255, 30, 45, .15);

    border-color:
        rgba(255, 30, 45, .75);

    color: #fff;
}


/* KPI */

.fs-company-endpoint-kpis {
    display: grid;

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

    gap: 12px;

    margin-bottom: 18px;
}

.fs-company-endpoint-kpi {
    min-width: 0;

    padding: 16px;

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

    border-radius: 10px;

    background:
        rgba(10,14,19,.88);
}

.fs-company-endpoint-kpi span {
    display: block;

    margin-bottom: 8px;

    color: #7f8994;

    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .8px;
}

.fs-company-endpoint-kpi strong {
    display: block;

    color: #fff;

    font-size: 26px;
    line-height: 1;
}

.fs-company-endpoint-kpi small {
    display: block;

    margin-top: 7px;

    color: var(--fs-muted);

    font-size: 10px;
}


/* PANEL */

.fs-company-endpoints-panel {
    overflow: hidden;
}

.fs-company-endpoints-panel
.fs-panel-head {
    min-height: 54px;
}


/* TOOLBAR */

.fs-endpoint-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 14px;

    padding: 14px 16px;

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

.fs-endpoint-search {
    position: relative;

    flex: 1;

    max-width: 620px;
}

.fs-endpoint-search svg {
    position: absolute;

    left: 13px;
    top: 50%;

    width: 18px !important;
    height: 18px !important;

    transform:
        translateY(-50%);

    pointer-events: none;

    color: #66717d;
}

.fs-endpoint-search input {
    width: 100%;
    height: 40px;

    padding:
        0 14px 0 42px;

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

    border-radius: 8px;

    outline: none;

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

    color: #fff;

    font-size: 12px;
}

.fs-endpoint-search input:focus {
    border-color:
        rgba(255,30,45,.45);
}


/* FILTERS */

.fs-endpoint-filters {
    display: flex;
    gap: 7px;

    flex-wrap: wrap;
}

.fs-endpoint-filters button {
    height: 36px;

    padding:
        0 12px;

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

    border-radius: 7px;

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

    color: #8e98a3;

    cursor: pointer;

    font-size: 11px;
    font-weight: 700;
}

.fs-endpoint-filters button:hover,
.fs-endpoint-filters button.active {
    border-color:
        rgba(255,30,45,.45);

    background:
        rgba(255,30,45,.10);

    color: #fff;
}


/* ENDPOINT GRID */

.fs-company-endpoint-grid {
    display: grid;

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

    gap: 14px;
}


/* CARD */

.fs-company-endpoint-card {
    min-width: 0;

    padding: 16px;

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

    border-radius: 10px;

    background:
        linear-gradient(
            145deg,
            rgba(12,16,22,.94),
            rgba(8,11,15,.94)
        );
}

.fs-company-endpoint-card-head {
    display: flex;
    align-items: center;

    gap: 12px;

    margin-bottom: 14px;
}


/* IMPORTANTISSIMO:
   evita SVG giganteschi */

.fs-company-endpoint-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    flex:
        0 0 42px;

    border:
        1px solid rgba(255,30,45,.22);

    border-radius: 9px;

    background:
        rgba(255,30,45,.06);

    color: #ff3042;
}

.fs-company-endpoint-icon svg {
    width: 21px !important;
    height: 21px !important;

    max-width: 21px !important;
    max-height: 21px !important;

    display: block;
}


/* Evita qualsiasi regola globale SVG
   che possa espandere le icone */

.fs-company-endpoints-page svg {
    max-width: 24px;
    max-height: 24px;
}


/* IDENTITA */

.fs-company-endpoint-identity {
    min-width: 0;

    flex: 1;
}

.fs-company-endpoint-identity a {
    display: block;

    overflow: hidden;

    color: #fff;

    font-size: 14px;
    font-weight: 800;

    text-decoration: none;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.fs-company-endpoint-identity span {
    display: block;

    margin-top: 3px;

    overflow: hidden;

    color: var(--fs-muted);

    font-size: 10px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* STATS */

.fs-company-endpoint-card-stats {
    display: grid;

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

    gap: 8px;

    margin-bottom: 12px;
}

.fs-company-endpoint-card-stats > div,
.fs-company-endpoint-card-meta > div {
    min-width: 0;

    padding: 10px;

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

    border-radius: 7px;

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

.fs-company-endpoint-card-stats span,
.fs-company-endpoint-card-meta span {
    display: block;

    margin-bottom: 4px;

    color: #68727d;

    font-size: 9px;

    text-transform: uppercase;

    letter-spacing: .7px;
}

.fs-company-endpoint-card-stats strong,
.fs-company-endpoint-card-meta strong {
    display: block;

    overflow: hidden;

    color: #fff;

    font-size: 11px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* META */

.fs-company-endpoint-card-meta {
    display: grid;

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

    gap: 8px;

    margin-bottom: 13px;
}


/* FOOTER */

.fs-company-endpoint-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    padding-top: 12px;

    border-top:
        1px solid rgba(255,255,255,.055);
}

.fs-company-endpoint-open {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    color: #ff3344;

    font-size: 11px;
    font-weight: 800;

    text-decoration: none;
}

.fs-company-endpoint-open:hover {
    color: #fff;
}


/* RESPONSIVE */

@media (max-width: 1200px) {

    .fs-company-endpoint-kpis {
        grid-template-columns:
            repeat(2, minmax(0,1fr));
    }

    .fs-company-endpoint-grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 760px) {

    .fs-company-endpoints-page {
        padding:
            20px 14px 30px;
    }

    .fs-endpoint-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .fs-endpoint-search {
        max-width: none;
    }

    .fs-company-endpoint-kpis {
        grid-template-columns: 1fr;
    }

    .fs-company-endpoint-card-stats {
        grid-template-columns:
            repeat(2, minmax(0,1fr));
    }

    .fs-company-endpoint-card-meta {
        grid-template-columns: 1fr;
    }

    .fs-company-endpoint-card-footer {
        align-items: stretch;
        flex-direction: column;
    }
}

/* =========================================================
   ENDPOINT PAGINATION
========================================================= */

.fs-endpoint-pagination {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 7px;

    margin-top: 18px;
    padding-top: 16px;

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

.fs-endpoint-pagination[hidden] {
    display: none;
}

.fs-endpoint-page-numbers {
    display: flex;
    align-items: center;
    gap: 6px;
}

.fs-endpoint-page-arrow,
.fs-endpoint-page-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 34px;
    height: 34px;

    padding: 0 9px;

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

    border-radius: 7px;

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

    color: #8d98a4;

    cursor: pointer;

    font-size: 11px;
    font-weight: 800;

    transition: .16s ease;
}

.fs-endpoint-page-arrow {
    font-size: 20px;
}

.fs-endpoint-page-arrow:hover,
.fs-endpoint-page-number:hover {
    border-color:
        rgba(255,30,45,.45);

    color: #fff;

    background:
        rgba(255,30,45,.07);
}

.fs-endpoint-page-number.active {
    border-color:
        rgba(255,30,45,.75);

    background:
        var(--fs-red);

    color: #07090c;

    box-shadow:
        0 0 18px rgba(255,30,45,.12);
}

.fs-endpoint-page-arrow:disabled {
    opacity: .30;
    cursor: not-allowed;
}

/* =========================================================
   ENDPOINT SOC LIST
========================================================= */

.fs-endpoint-list-wrap {
    width: 100%;

    overflow-x: auto;

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

    border-radius: 9px;
}

.fs-endpoint-list {
    width: 100%;

    border-collapse: collapse;

    table-layout: auto;
}

.fs-endpoint-list thead th {
    padding: 11px 12px;

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

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

    color: #68737f;

    font-family:
        var(--fs-mono);

    font-size: 9px;

    font-weight: 700;

    letter-spacing: .8px;

    text-align: left;

    text-transform: uppercase;

    white-space: nowrap;
}

.fs-endpoint-list-row {
    cursor: pointer;

    transition:
        background .15s ease,
        box-shadow .15s ease;
}

.fs-endpoint-list-row td {
    padding:
        10px 12px;

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

    color: #c3cad2;

    font-size: 11px;

    white-space: nowrap;
}

.fs-endpoint-list-row:hover {
    background:
        rgba(255,30,45,.035);
}


/* RIGA SELEZIONATA */

.fs-endpoint-list-row.selected {
    background:
        linear-gradient(
            90deg,
            rgba(255,30,45,.15),
            rgba(255,30,45,.04)
        );

    box-shadow:
        inset 3px 0 0
        var(--fs-red);
}

.fs-endpoint-list-row.selected td {
    border-bottom-color:
        rgba(255,30,45,.20);
}


/* IDENTITY */

.fs-endpoint-list-identity {
    display: flex;

    align-items: center;

    gap: 9px;

    min-width: 190px;
}

.fs-endpoint-list-icon {
    display: flex;

    align-items: center;

    justify-content: center;

    width: 30px;
    height: 30px;

    flex:
        0 0 30px;

    border:
        1px solid rgba(255,30,45,.27);

    border-radius: 7px;

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

    color:
        #ff3042;
}

.fs-endpoint-list-icon svg {
    width: 16px !important;
    height: 16px !important;
}

.fs-endpoint-list-identity strong {
    display: block;

    color: #fff;

    font-size: 11px;

    font-weight: 800;
}

.fs-endpoint-list-identity span {
    display: block;

    margin-top: 2px;

    color: #6f7984;

    font-size: 9px;
}


/* =========================================================
   INLINE DETAIL
========================================================= */

.fs-endpoint-inline-detail[hidden] {
    display: none;
}

.fs-endpoint-inline-detail td {
    padding: 0 !important;

    border-bottom:
        1px solid rgba(255,30,45,.20);
}

.fs-endpoint-detail-inline {
    display: grid;

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

    gap: 0;

    padding:
        22px 24px;

    background:
        linear-gradient(
            180deg,
            rgba(13,17,22,.98),
            rgba(8,11,15,.98)
        );

    box-shadow:
        inset 3px 0 0
        rgba(255,30,45,.80);
}

.fs-endpoint-detail-column {
    min-width: 0;

    padding:
        0 22px;

    border-right:
        1px solid rgba(255,255,255,.065);
}

.fs-endpoint-detail-column:first-child {
    padding-left: 0;
}

.fs-endpoint-detail-column:last-child {
    padding-right: 0;

    border-right: 0;
}

.fs-endpoint-detail-column h3 {
    margin:
        0 0 15px;

    color: #fff;

    font-size: 13px;

    font-weight: 800;
}

.fs-endpoint-detail-column dl {
    margin: 0;
}

.fs-endpoint-detail-column dl div {
    display: grid;

    grid-template-columns:
        125px minmax(0,1fr);

    gap: 10px;

    margin-bottom: 9px;
}

.fs-endpoint-detail-column dt {
    color:
        #69747f;

    font-size: 10px;
}

.fs-endpoint-detail-column dd {
    margin: 0;

    overflow-wrap:
        anywhere;

    color: #d3d9df;

    font-size: 10px;

    font-weight: 600;
}

.fs-data-pending {
    color:
        #936e32 !important;

    font-style: italic;
}


/* LICENSE BUTTON */

.fs-endpoint-list
.fs-endpoint-license-form
.fs-btn {
    min-height: 28px;

    padding:
        5px 9px;

    font-size: 9px;
}


/* RESPONSIVE */

@media (max-width: 1250px) {

    .fs-endpoint-detail-inline {
        grid-template-columns:
            repeat(2, minmax(0,1fr));
    }

    .fs-endpoint-detail-column {
        padding: 15px;
    }

}

@media (max-width: 760px) {

    .fs-endpoint-detail-inline {
        grid-template-columns:
            1fr;
    }

    .fs-endpoint-detail-column {
        border-right: 0;

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

}

.fs-endpoint-disk-block {
    align-items: flex-start;
}

.fs-endpoint-disk-row {
    display: flex;
    flex-direction: column;
    gap: 2px;

    margin-bottom: 8px;
}

.fs-endpoint-disk-row:last-child {
    margin-bottom: 0;
}

.fs-endpoint-disk-row strong {
    color: #fff;
    font-size: 10px;
}

.fs-endpoint-disk-row span {
    color: #8a949f;
    font-size: 9px;
    line-height: 1.4;
}

/* =========================================================
   COMPANY DEPLOYMENT - UI REFINEMENT
========================================================= */


/* BACK BUTTON */

.fs-deployment-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    min-height: 34px;
    padding: 0 13px;

    margin-bottom: 12px;

    border: 1px solid rgba(255, 35, 58, 0.42);
    border-radius: 7px;

    background:
        rgba(255, 35, 58, 0.07);

    color: #ff334d;
    text-decoration: none;

    font-size: 12px;
    font-weight: 700;

    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        transform 0.15s ease;
}

.fs-deployment-back-btn:hover {
    background:
        rgba(255, 35, 58, 0.14);

    border-color:
        rgba(255, 35, 58, 0.72);

    transform: translateX(-2px);
}

.fs-deployment-back-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 16px;
    line-height: 1;
}


/* =========================================================
   GENERATOR ROW
========================================================= */

.fs-deployment-generator {
    display: grid;

    grid-template-columns:
        minmax(220px, 1fr)
        minmax(220px, 1fr)
        minmax(260px, 1fr);

    gap: 14px;

    align-items: stretch;
}


/* Ogni colonna */

.fs-deployment-generator
.fs-deployment-field {
    display: flex;
    flex-direction: column;

    min-width: 0;
}


/* Label */

.fs-deployment-generator
.fs-deployment-field > label {
    display: block;

    margin-bottom: 8px;

    color: #8d96a5;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 0.02em;
}


/* Testo inferiore */

.fs-deployment-generator
.fs-deployment-field > small {
    display: block;

    margin-top: 7px;

    color: #606a78;

    font-size: 10px;
    line-height: 1.4;
}


/* =========================================================
   AVAILABLE INSTALLATIONS
========================================================= */

.fs-deployment-readonly-box {
    display: flex;
    align-items: center;
    gap: 9px;

    width: 100%;
    min-height: 46px;

    padding: 0 14px;

    box-sizing: border-box;

    border: 1px solid #202833;
    border-radius: 7px;

    background:
        rgba(12, 17, 23, 0.92);
}

.fs-deployment-readonly-box strong {
    color: #f2f5f8;

    font-size: 16px;
    font-weight: 800;
}

.fs-deployment-readonly-box span {
    color: #687382;

    font-size: 11px;
    font-weight: 600;
}


/* =========================================================
   DAYS INPUT
========================================================= */

.fs-deployment-days-control {
    position: relative;

    width: 100%;
}

.fs-deployment-days-control input {
    width: 100%;
    height: 46px;

    box-sizing: border-box;

    padding:
        0
        78px
        0
        14px;

    border: 1px solid #202833;
    border-radius: 7px;

    background:
        rgba(12, 17, 23, 0.92);

    color: #f2f5f8;

    font-size: 13px;
    font-weight: 700;

    outline: none;
}

.fs-deployment-days-control input:focus {
    border-color:
        rgba(255, 35, 58, 0.65);

    box-shadow:
        0 0 0 2px
        rgba(255, 35, 58, 0.08);
}

.fs-deployment-days-label {
    position: absolute;

    right: 14px;
    top: 50%;

    transform: translateY(-50%);

    color: #7d8795;

    font-size: 11px;
    font-weight: 700;

    pointer-events: none;
}


/* =========================================================
   GENERATE BUTTON
========================================================= */

.fs-deployment-action-field
.fs-deployment-generate-btn {
    width: 100%;
    min-height: 46px;

    margin: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    white-space: nowrap;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1100px) {

    .fs-deployment-generator {
        grid-template-columns: 1fr 1fr;
    }

    .fs-deployment-action-field {
        grid-column: 1 / -1;
    }
}

@media (max-width: 720px) {

    .fs-deployment-generator {
        grid-template-columns: 1fr;
    }

    .fs-deployment-action-field {
        grid-column: auto;
    }
}

/* =========================================================
   DEPLOYMENT - TESTI SECONDARI PIU LEGGIBILI
========================================================= */

.fs-deployment-generator
.fs-deployment-field > small {
    font-size: 12px;
    line-height: 1.5;
    font-weight: 500;
    color: #7f8997;
    margin-top: 9px;
}

/* =========================================================
   ALERT SEARCH
========================================================= */

.fs-alert-search-field {
    min-width: 300px;
    flex: 1;
}

.fs-alert-search-field > label,
.fs-alert-search-field label {
    display: block;
}

.fs-alert-search-box {
    position: relative;

    margin-top: 5px;
}

.fs-alert-search-box svg {
    position: absolute;

    left: 12px;
    top: 50%;

    width: 16px !important;
    height: 16px !important;

    transform: translateY(-50%);

    color: #65707c;

    pointer-events: none;
}

.fs-alert-search-box input {
    width: 100%;
    height: 39px;

    box-sizing: border-box;

    padding:
        0
        13px
        0
        38px;

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

    border-radius: 7px;

    outline: none;

    background:
        rgba(8,12,17,.92);

    color: #fff;

    font-size: 12px;
}

.fs-alert-search-box input:focus {
    border-color:
        rgba(255,32,52,.58);

    box-shadow:
        0 0 0 2px
        rgba(255,32,52,.06);
}


/* DESCRIPTION */

.fs-alert-description {
    max-width: 650px;

    line-height: 1.45;
}


/* OPEN */

.fs-alert-open-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 6px;

    min-height: 29px;

    padding:
        0
        11px;

    border:
        1px solid rgba(255,32,52,.48);

    border-radius: 6px;

    background:
        rgba(255,32,52,.08);

    color: #ff3448;

    font-size: 10px;
    font-weight: 800;

    text-decoration: none;

    white-space: nowrap;
}

.fs-alert-open-btn:hover {
    background:
        #ff243b;

    border-color:
        #ff243b;

    color: #08090b;
}


/* =========================================================
   ALERT PAGINATION
========================================================= */

.fs-alert-pagination {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 7px;

    padding:
        17px
        15px;

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

.fs-alert-pagination[hidden] {
    display: none;
}

.fs-alert-page-numbers {
    display: flex;
    align-items: center;

    gap: 6px;
}

.fs-alert-page-arrow,
.fs-alert-page-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 34px;
    height: 34px;

    padding:
        0
        9px;

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

    border-radius: 7px;

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

    color: #89939f;

    cursor: pointer;

    font-size: 11px;
    font-weight: 800;
}

.fs-alert-page-arrow {
    font-size: 19px;
}

.fs-alert-page-arrow:hover,
.fs-alert-page-number:hover {
    border-color:
        rgba(255,32,52,.48);

    color: #fff;

    background:
        rgba(255,32,52,.08);
}

.fs-alert-page-number.active {
    border-color:
        #ff243b;

    background:
        #ff243b;

    color: #08090b;
}

.fs-alert-page-arrow:disabled {
    opacity: .3;

    cursor: not-allowed;
}

.fs-alert-page-ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 26px;
    height: 34px;

    color: #626d79;

    font-weight: 800;
}

/* =========================================================
   ALERT FILTER BAR - ALIGNMENT FIX
========================================================= */

.fs-actions {
    display: grid;
    grid-template-columns:
        230px
        160px
        minmax(320px, 1fr)
        110px;

    gap: 12px;

    align-items: end;
}


/* LABEL */

.fs-actions > label,
.fs-alert-search-field {
    display: flex;
    flex-direction: column;
    gap: 6px;

    margin: 0;
}

.fs-actions > label {
    color: #d6dce3;

    font-size: 12px;
    font-weight: 600;
}


/* SELECT */

.fs-actions .fs-input {
    width: 100%;
    height: 44px;

    box-sizing: border-box;

    padding:
        0
        34px
        0
        14px;

    margin: 0;

    border-radius: 8px;

    font-size: 12px;

    line-height: 44px;
}


/* Freccia select più verso sinistra */

.fs-actions select.fs-input {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-image:
        linear-gradient(
            45deg,
            transparent 50%,
            #7d8792 50%
        ),
        linear-gradient(
            135deg,
            #7d8792 50%,
            transparent 50%
        );

    background-position:
        calc(100% - 18px) 19px,
        calc(100% - 13px) 19px;

    background-size:
        5px 5px,
        5px 5px;

    background-repeat:
        no-repeat;

    padding-right: 38px;
}


/* SEARCH */

.fs-alert-search-field {
    min-width: 0;
}

.fs-alert-search-field > label {
    color: #d6dce3;

    font-size: 12px;
    font-weight: 600;
}

.fs-alert-search-box {
    position: relative;

    width: 100%;

    margin: 0;
}

.fs-alert-search-box input {
    width: 100%;
    height: 44px;

    box-sizing: border-box;

    padding:
        0
        14px
        0
        40px;

    margin: 0;

    border-radius: 8px;

    font-size: 12px;
}

.fs-alert-search-box svg {
    left: 13px;

    width: 16px !important;
    height: 16px !important;
}


/* BUTTON */

.fs-actions > .fs-btn {
    width: 110px;
    height: 44px;

    min-height: 44px;

    box-sizing: border-box;

    margin: 0;
    padding: 0 16px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;

    font-size: 11px;
    font-weight: 800;

    white-space: nowrap;
}


/* RESPONSIVE */

@media (max-width: 1100px) {

    .fs-actions {
        grid-template-columns:
            1fr
            1fr;
    }

    .fs-alert-search-field {
        grid-column: 1 / -1;
    }

    .fs-actions > .fs-btn {
        width: 100%;
    }
}

@media (max-width: 700px) {

    .fs-actions {
        grid-template-columns: 1fr;
    }

    .fs-alert-search-field {
        grid-column: auto;
    }
}

/* =========================================================
   ALERT DETAIL - CLEAN LAYOUT
========================================================= */

.fs-alert-detail-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 24px;

    margin-bottom: 20px;
}

.fs-alert-detail-head-main {
    min-width: 0;
    flex: 1;
}


/* BACK */

.fs-alert-detail-back {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    min-height: 32px;

    padding: 0 11px;

    margin-bottom: 15px;

    border:
        1px solid rgba(255, 35, 55, .38);

    border-radius: 7px;

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

    color: #ff3549;

    font-size: 11px;
    font-weight: 750;

    text-decoration: none;

    transition: .15s ease;
}

.fs-alert-detail-back:hover {
    background:
        rgba(255, 35, 55, .14);

    border-color:
        rgba(255, 35, 55, .7);

    color: #fff;

    transform:
        translateX(-2px);
}

.fs-alert-detail-back span {
    font-size: 16px;
}


/* TITLE */

.fs-alert-detail-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 18px;
}

.fs-alert-detail-title-row
.fs-page-title {
    margin-top: 7px;
    margin-bottom: 7px;
}

.fs-alert-detail-dot {
    padding: 0 6px;

    color: #59636f;
}


/* TOP ACTIONS */

.fs-alert-detail-actions {
    display: flex;
    align-items: center;

    gap: 9px;

    padding-bottom: 2px;
}

.fs-alert-detail-case-form {
    margin: 0;
}

.fs-alert-detail-actions
.fs-btn {
    min-height: 38px;

    padding:
        0 15px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    white-space: nowrap;
}

.fs-alert-detail-endpoint-btn {
    border-color:
        rgba(255, 35, 55, .42) !important;

    background:
        rgba(255, 35, 55, .07) !important;

    color:
        #ff3549 !important;
}


/* =========================================================
   CLASSIFICATION
========================================================= */

.fs-alert-classification-grid {
    display: grid;

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

    gap: 10px;
}

.fs-alert-classification-item {
    min-width: 0;

    padding: 13px 14px;

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

    border-radius: 7px;

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

.fs-alert-classification-item span {
    display: block;

    margin-bottom: 6px;

    color: #687380;

    font-size: 9px;

    text-transform: uppercase;

    letter-spacing: .7px;
}

.fs-alert-classification-item strong {
    display: block;

    overflow-wrap: anywhere;

    color: #eef2f6;

    font-size: 11px;

    line-height: 1.5;
}


/* MITRE */

.fs-alert-mitre {
    margin-top: 12px;

    padding: 14px;

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

    border-radius: 7px;

    background:
        rgba(5,8,12,.50);
}

.fs-alert-mitre-title {
    margin-bottom: 9px;

    color: #77828e;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .8px;

    text-transform: uppercase;
}

.fs-alert-mitre pre {
    margin: 0;

    white-space: pre-wrap;
    word-break: break-word;

    color: #c7ced6;

    font-family: var(--fs-mono);

    font-size: 10px;
    line-height: 1.55;
}


/* =========================================================
   FULL LOG
========================================================= */

.fs-alert-panel-description {
    margin-top: 4px;

    color: #68727e;

    font-size: 10px;
}

.fs-alert-full-log-panel
.fs-panel-head {
    align-items: center;
}

.fs-alert-full-log {
    margin: 0;

    max-height: 480px;

    overflow: auto;

    padding: 16px;

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

    border-radius: 8px;

    background:
        #070a0e;

    color: #cbd3dc;

    white-space: pre-wrap;
    word-break: break-word;

    font-family:
        var(--fs-mono);

    font-size: 11px;

    line-height: 1.65;

    tab-size: 4;
}


/* COPY */

.fs-alert-copy-btn {
    min-height: 31px;

    padding: 0 11px;

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

    border-radius: 6px;

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

    color: #9ba5b0;

    cursor: pointer;

    font-size: 10px;
    font-weight: 700;
}

.fs-alert-copy-btn:hover {
    border-color:
        rgba(255,35,55,.42);

    color: #fff;
}

.fs-alert-copy-btn.success {
    border-color:
        rgba(36,210,128,.38);

    background:
        rgba(36,210,128,.08);

    color: #2ce08b;
}


/* =========================================================
   JSON
========================================================= */

.fs-alert-json-view {
    margin: 0;

    max-height: 420px;

    overflow: auto;

    padding: 15px;

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

    border-radius: 7px;

    background: #070a0e;

    white-space: pre-wrap;
    word-break: break-word;

    color: #aeb8c2;

    font-family:
        var(--fs-mono);

    font-size: 10px;
    line-height: 1.6;
}

.fs-alert-json-view.raw {
    max-height: 600px;
}


/* RESPONSIVE */

@media (max-width: 900px) {

    .fs-alert-detail-head {
        flex-direction: column;
        align-items: stretch;
    }

    .fs-alert-detail-actions {
        justify-content: flex-start;
    }

    .fs-alert-classification-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   ALERT DETAIL - ANALISI OPERATIVA
========================================================= */

.fs-alert-analysis-panel {
    overflow: hidden;
}

.fs-alert-analysis-panel .fs-panel-body {
    display: flex;
    flex-direction: column;
    gap: 16px;
}


/* =========================================================
   LABEL SEZIONI
========================================================= */

.fs-alert-analysis-label {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    margin-bottom: 8px;

    color: #7e8996;

    font-family: var(--fs-mono);
    font-size: 10px;
    font-weight: 800;

    letter-spacing: 1px;
    text-transform: uppercase;
}

.fs-alert-analysis-label::before {
    content: "";

    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: #ff283f;

    box-shadow:
        0 0 9px rgba(255, 40, 63, .7);
}


/* =========================================================
   COSA È SUCCESSO
========================================================= */

.fs-alert-analysis-summary {
    padding: 18px 20px;

    border:
        1px solid rgba(255, 40, 63, .24);

    border-radius: 9px;

    background:
        linear-gradient(
            135deg,
            rgba(255, 40, 63, .09),
            rgba(255, 40, 63, .025)
        );

    box-shadow:
        inset 3px 0 0 #ff283f;
}

.fs-alert-analysis-summary strong {
    display: block;

    max-width: 1200px;

    color: #f5f7fa;

    font-size: 16px;
    font-weight: 750;

    line-height: 1.55;
}


/* =========================================================
   DATI PRINCIPALI
========================================================= */

.fs-alert-analysis-grid {
    display: grid;

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

    gap: 10px;
}

.fs-alert-analysis-grid > div {
    min-width: 0;

    padding: 13px 14px;

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

    border-radius: 8px;

    background:
        linear-gradient(
            180deg,
            rgba(14, 19, 25, .92),
            rgba(8, 12, 17, .92)
        );

    transition:
        border-color .15s ease,
        background .15s ease;
}

.fs-alert-analysis-grid > div:hover {
    border-color:
        rgba(255, 40, 63, .22);

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

.fs-alert-analysis-grid span {
    display: block;

    margin-bottom: 6px;

    color: #66717e;

    font-family: var(--fs-mono);
    font-size: 9px;
    font-weight: 700;

    letter-spacing: .65px;

    text-transform: uppercase;
}

.fs-alert-analysis-grid strong {
    display: block;

    overflow-wrap: anywhere;

    color: #e9edf2;

    font-size: 12px;
    font-weight: 750;

    line-height: 1.45;
}


/* Evidenziamo i campi più importanti */

.fs-alert-analysis-grid > div:nth-child(2) strong,
.fs-alert-analysis-grid > div:nth-child(4) strong,
.fs-alert-analysis-grid > div:nth-child(6) strong {
    color: #ffffff;
}


/* =========================================================
   PERCHÉ FOXSHIELD LO SEGNALA
========================================================= */

.fs-alert-analysis-reason {
    padding: 17px 19px;

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

    border-radius: 9px;

    background:
        linear-gradient(
            135deg,
            rgba(120, 14, 27, .16),
            rgba(30, 8, 12, .08)
        );
}

.fs-alert-analysis-reason .fs-alert-analysis-label {
    color: #ff6678;
}

.fs-alert-analysis-reason p {
    margin: 2px 0 0;

    max-width: 1300px;

    color: #dfe4ea;

    font-size: 12px;
    font-weight: 600;

    line-height: 1.65;
}


/* =========================================================
   COSA CONTROLLARE ADESSO
========================================================= */

.fs-alert-analysis-actions {
    padding: 17px 19px;

    border:
        1px solid rgba(255, 180, 60, .16);

    border-radius: 9px;

    background:
        linear-gradient(
            135deg,
            rgba(145, 92, 15, .10),
            rgba(25, 18, 8, .05)
        );
}

.fs-alert-analysis-actions .fs-alert-analysis-label {
    color: #eab45c;
}

.fs-alert-analysis-actions .fs-alert-analysis-label::before {
    background: #eab45c;

    box-shadow:
        0 0 9px rgba(234, 180, 92, .55);
}

.fs-alert-analysis-actions ol {
    display: grid;

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

    gap: 9px 20px;

    margin:
        4px
        0
        0;

    padding:
        0;

    list-style: none;

    counter-reset:
        fs-alert-check;
}

.fs-alert-analysis-actions li {
    position: relative;

    min-height: 38px;

    padding:
        10px
        12px
        10px
        42px;

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

    border-radius: 7px;

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

    color: #cbd2da;

    font-size: 11px;
    font-weight: 550;

    line-height: 1.5;

    counter-increment:
        fs-alert-check;
}

.fs-alert-analysis-actions li::before {
    content:
        counter(fs-alert-check);

    position: absolute;

    left: 11px;
    top: 50%;

    width: 21px;
    height: 21px;

    transform:
        translateY(-50%);

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid rgba(234, 180, 92, .38);

    border-radius: 6px;

    background:
        rgba(234, 180, 92, .08);

    color: #eab45c;

    font-family:
        var(--fs-mono);

    font-size: 9px;
    font-weight: 800;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1250px) {

    .fs-alert-analysis-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 850px) {

    .fs-alert-analysis-grid {
        grid-template-columns: 1fr;
    }

    .fs-alert-analysis-actions ol {
        grid-template-columns: 1fr;
    }

    .fs-alert-analysis-summary strong {
        font-size: 14px;
    }

}

/* =========================================================
   CASES / INCIDENTI - TABLE FIX
========================================================= */

.fs-cases-table {
    width: 100%;
    table-layout: fixed;
}


/* Larghezze colonne */

.fs-cases-table th:nth-child(1),
.fs-cases-table td:nth-child(1) {
    width: 48px;
}

.fs-cases-table th:nth-child(2),
.fs-cases-table td:nth-child(2) {
    width: 110px;
}

.fs-cases-table th:nth-child(3),
.fs-cases-table td:nth-child(3) {
    width: 36%;
}

.fs-cases-table th:nth-child(4),
.fs-cases-table td:nth-child(4) {
    width: 150px;
}

.fs-cases-table th:nth-child(5),
.fs-cases-table td:nth-child(5) {
    width: 150px;
}

.fs-cases-table th:nth-child(6),
.fs-cases-table td:nth-child(6) {
    width: 110px;
}

.fs-cases-table th:nth-child(7),
.fs-cases-table td:nth-child(7) {
    width: 70px;
}

.fs-cases-table th:nth-child(8),
.fs-cases-table td:nth-child(8) {
    width: 130px;
}

.fs-cases-table th:nth-child(9),
.fs-cases-table td:nth-child(9) {
    width: 145px;
}

.fs-cases-table th:nth-child(10),
.fs-cases-table td:nth-child(10) {
    width: 85px;
}


/* =========================================================
   INCIDENT TITLE
========================================================= */

.fs-case-title-cell {
    min-width: 0;
}

.fs-case-title {
    display: -webkit-box;

    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    line-clamp: 2;

    color: #f2f5f8;

    font-size: 12px;
    font-weight: 750;

    line-height: 1.45;

    overflow-wrap: anywhere;
}

.fs-case-title:hover {
    color: #ffffff;
}


/* NOTE SOC */

.fs-case-notes-count {
    margin-top: 5px;

    color: #66717e;

    font-size: 10px;
    line-height: 1.3;
}


/* Celle che non devono spezzarsi */

.fs-cases-table td:nth-child(1),
.fs-cases-table td:nth-child(2),
.fs-cases-table td:nth-child(6),
.fs-cases-table td:nth-child(7),
.fs-cases-table td:nth-child(8),
.fs-cases-table td:nth-child(9),
.fs-cases-table td:nth-child(10) {
    white-space: nowrap;
}


/* Azienda / endpoint */

.fs-cases-table td:nth-child(4),
.fs-cases-table td:nth-child(5) {
    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1350px) {

    .fs-cases-table th:nth-child(3),
    .fs-cases-table td:nth-child(3) {
        width: 30%;
    }

}

/* =========================================================
   CASE - FALSE POSITIVE
========================================================= */

.fs-case-resolution-box.false-positive {
    border-color: rgba(63, 177, 255, .25);

    background:
        linear-gradient(
            135deg,
            rgba(63, 177, 255, .08),
            rgba(63, 177, 255, .02)
        );
}

.fs-case-resolution-box.false-positive > span {
    color: #62bfff;
}

.fs-case-resolution-box.false-positive > strong {
    color: #dfefff;
}

.fs-ac-panel-actions {
    display:flex;
    align-items:center;
    gap:10px;
}

/* =========================================================
   FOXSHIELD AUTH CENTER
   Login / MFA / MFA Setup / Password
========================================================= */

.fs-auth-body {
    min-height: 100vh;
    overflow-x: hidden;
    background:
        linear-gradient(
            rgba(255,30,45,.025) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,30,45,.025) 1px,
            transparent 1px
        ),
        #050709;

    background-size: 42px 42px;
}

.fs-auth-body::before {
    background:
        radial-gradient(
            850px 600px at 7% 100%,
            rgba(255,30,45,.11),
            transparent 70%
        ),
        radial-gradient(
            900px 650px at 92% 0%,
            rgba(120,8,18,.30),
            transparent 68%
        );
}

.fs-auth-page {
    position: relative;
    z-index: 1;

    min-height: 100vh;

    display: flex;
    align-items: stretch;

    overflow: hidden;
}


/* =========================
   AMBIENT LIGHT
========================= */

.fs-auth-ambient {
    position: fixed;

    pointer-events: none;

    border-radius: 50%;

    filter: blur(80px);

    opacity: .4;
}

.fs-auth-ambient-one {
    width: 480px;
    height: 480px;

    left: -220px;
    bottom: -240px;

    background:
        rgba(255,30,45,.18);
}

.fs-auth-ambient-two {
    width: 380px;
    height: 380px;

    right: -180px;
    top: -180px;

    background:
        rgba(150,15,25,.14);
}


/* =========================
   SHELL
========================= */

.fs-auth-shell {
    width: 100%;
    min-height: 100vh;

    display: grid;

    grid-template-columns:
        minmax(420px, 1.05fr)
        minmax(440px, .95fr);
}


/* =========================
   VISUAL LEFT
========================= */

.fs-auth-visual {
    position: relative;

    display: flex;

    overflow: hidden;

    border-right:
        1px solid rgba(255,30,45,.17);

    background:
        radial-gradient(
            circle at 22% 75%,
            rgba(255,30,45,.10),
            transparent 32%
        ),
        radial-gradient(
            circle at 75% 18%,
            rgba(255,30,45,.045),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            rgba(8,11,15,.98),
            rgba(5,7,9,.99)
        );
}

.fs-auth-visual::before {
    content: "";

    position: absolute;
    inset: 0;

    background:
        repeating-linear-gradient(
            0deg,
            transparent 0,
            transparent 39px,
            rgba(255,255,255,.018) 40px
        ),
        repeating-linear-gradient(
            90deg,
            transparent 0,
            transparent 39px,
            rgba(255,255,255,.014) 40px
        );

    pointer-events: none;
}

.fs-auth-visual::after {
    content: "";

    position: absolute;

    right: -1px;
    top: 7%;
    bottom: 7%;

    width: 1px;

    background:
        linear-gradient(
            transparent,
            rgba(255,30,45,.95),
            transparent
        );

    box-shadow:
        0 0 14px rgba(255,30,45,.5);

    animation:
        fsAuthEdgeGlow 4s ease-in-out infinite;
}

@keyframes fsAuthEdgeGlow {

    0%,
    100% {
        opacity: .25;
    }

    50% {
        opacity: .9;
    }

}

.fs-auth-visual-inner {
    position: relative;
    z-index: 1;

    width: 100%;

    display: flex;
    flex-direction: column;

    padding:
        clamp(34px, 5vw, 72px);
}


/* =========================
   BRAND
========================= */

.fs-auth-brand {
    display: flex;
    align-items: center;

    gap: 22px;
}

.fs-auth-logo-wrap {
    position: relative;

    width: 118px;
    height: 118px;

    display: grid;
    place-items: center;

    flex: 0 0 118px;
}

.fs-auth-logo-ring {
    inset: 5px;

    border:
        1px solid rgba(255,30,45,.32);

    box-shadow:
        inset 0 0 26px rgba(255,30,45,.06),
        0 0 38px rgba(255,30,45,.14);
}

@keyframes fsAuthLogoRing {

    50% {
        transform: scale(1.08);

        border-color:
            rgba(255,30,45,.45);

        box-shadow:
            0 0 34px rgba(255,30,45,.15);
    }

}

.fs-auth-logo {
    position: relative;

    width: 106px;
    height: 106px;

    object-fit: contain;

    filter:
        drop-shadow(
            0 0 18px
            rgba(255,30,45,.70)
        );
}

.fs-auth-brand-name {
    color: #fff;

    font-family:
        var(--fs-font);

    font-size:
        clamp(30px, 2.6vw, 40px);

    font-weight: 900;

    line-height: 1;

    letter-spacing: .6px;
}

.fs-auth-brand-name span {
    color: var(--fs-red);
}

.fs-auth-brand-tag {
    margin-top: 9px;

    color: #8c96a1;

    font:
        11px var(--fs-mono);

    letter-spacing: 2px;
}

.fs-auth-visual-inner {
    padding:
        46px clamp(42px, 5vw, 76px)
        clamp(34px, 5vw, 72px);
}


/* =========================
   HERO
========================= */

.fs-auth-hero {
    margin-top: auto;

    padding:
        70px 0 52px;

    max-width: 620px;
}

.fs-auth-kicker {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    margin-bottom: 22px;

    color:
        #a7afb8;

    font:
        10px var(--fs-mono);

    letter-spacing: 1.9px;
}

.fs-auth-live-dot {
    width: 8px;
    height: 8px;

    border-radius: 50%;

    background:
        var(--fs-red);

    box-shadow:
        0 0 11px rgba(255,30,45,.9);

    animation:
        fsAuthPulse 1.8s ease-in-out infinite;
}

@keyframes fsAuthPulse {

    50% {
        opacity: .35;

        transform:
            scale(.7);

        box-shadow:
            0 0 3px rgba(255,30,45,.35);
    }

}

.fs-auth-hero h1 {
    margin: 0;

    color: #fff;

    font-size:
        clamp(48px, 6vw, 82px);

    font-weight: 900;

    line-height: .94;

    letter-spacing: -3px;
}

.fs-auth-hero h1 span {
    color:
        var(--fs-red);

    text-shadow:
        0 0 28px rgba(255,30,45,.22);
}

.fs-auth-hero p {
    max-width: 530px;

    margin:
        28px 0 0;

    color:
        #9ca5af;

    font-size:
        14px;

    line-height: 1.8;
}


/* =========================
   SECURITY LIST
========================= */

.fs-auth-security-list {
    display: grid;

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

    gap: 10px;

    margin-bottom: 45px;
}

.fs-auth-security-item {
    min-width: 0;

    display: flex;
    align-items: center;

    gap: 10px;

    padding:
        12px;

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

    border-radius: 9px;

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

.fs-auth-security-icon {
    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    display: grid;
    place-items: center;

    border:
        1px solid rgba(255,30,45,.22);

    border-radius: 8px;

    background:
        rgba(255,30,45,.055);

    color:
        var(--fs-red-bright);
}

.fs-auth-security-icon svg {
    width: 17px;
    height: 17px;
}

.fs-auth-security-item strong {
    display: block;

    color:
        #e8ecf0;

    font-size:
        10px;

    font-weight:
        800;
}

.fs-auth-security-item span {
    display: block;

    margin-top: 3px;

    color:
        #68727e;

    font-size:
        9px;

    line-height: 1.35;
}


/* =========================
   LEFT FOOTER
========================= */

.fs-auth-visual-footer {
    display: flex;
    align-items: center;

    gap: 11px;

    color:
        #58626d;

    font:
        9px var(--fs-mono);

    letter-spacing:
        1.4px;
}

.fs-auth-footer-divider {
    width: 26px;
    height: 1px;

    background:
        rgba(255,30,45,.35);
}


/* =========================
   RIGHT
========================= */

.fs-auth-main {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    padding:
        clamp(30px, 5vw, 78px);

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255,30,45,.055),
            transparent 32%
        ),
        rgba(5,7,9,.70);
}


/* =========================
   LOGIN CARD
========================= */

.fs-auth-card {
    width:
        min(470px, 100%);

    padding:
        35px 34px 26px;

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

    border-radius:
        14px;

    background:
        linear-gradient(
            145deg,
            rgba(12,16,22,.97),
            rgba(7,10,14,.98)
        );

    box-shadow:
        0 30px 90px rgba(0,0,0,.48),
        0 0 0 1px rgba(255,30,45,.018),
        0 0 45px rgba(255,30,45,.035);
}

.fs-auth-card-head {
    margin-bottom:
        26px;
}

.fs-auth-status {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    margin-bottom:
        20px;

    padding:
        6px 9px;

    border:
        1px solid rgba(69,213,139,.16);

    border-radius:
        6px;

    background:
        rgba(69,213,139,.045);

    color:
        #65e69c;

    font:
        9px var(--fs-mono);

    letter-spacing:
        1.2px;
}

.fs-auth-status-dot {
    width: 6px;
    height: 6px;

    border-radius:
        50%;

    background:
        #45d58b;

    box-shadow:
        0 0 8px rgba(69,213,139,.8);
}

.fs-auth-card h2 {
    margin:
        0;

    color:
        #fff;

    font-size:
        32px;

    font-weight:
        850;

    letter-spacing:
        -.8px;
}

.fs-auth-card-head p {
    margin:
        10px 0 0;

    color:
        #87919c;

    font-size:
        12px;

    line-height:
        1.65;
}


/* =========================
   ALERT
========================= */

.fs-auth-alert {
    display: flex;
    align-items: flex-start;

    gap: 10px;

    margin-bottom:
        18px;

    padding:
        11px 12px;

    border-radius:
        8px;
}

.fs-auth-alert-error {
    border:
        1px solid rgba(255,91,103,.26);

    background:
        rgba(255,91,103,.075);
}

.fs-auth-alert-icon {
    width: 27px;
    height: 27px;

    flex: 0 0 27px;

    display: grid;
    place-items: center;

    color:
        #ff6370;
}

.fs-auth-alert-icon svg {
    width: 18px;
    height: 18px;
}

.fs-auth-alert strong {
    display: block;

    color:
        #ff8e98;

    font-size:
        10px;
}

.fs-auth-alert span {
    display: block;

    margin-top: 2px;

    color:
        #d0a1a5;

    font-size:
        10px;

    line-height:
        1.45;
}


/* =========================
   FORM
========================= */

.fs-auth-form {
    display: grid;

    gap: 18px;
}

.fs-auth-field label {
    display: block;

    margin:
        0 0 8px;

    color:
        #b7bec7;

    font-size:
        11px;

    font-weight:
        700;
}

.fs-auth-input-wrap {
    position: relative;
}

.fs-auth-input-wrap input {
    width: 100%;
    height: 49px;

    box-sizing: border-box;

    padding:
        0 48px 0 43px;

    outline: none;

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

    border-radius:
        8px;

    background:
        #080d12;

    color:
        #fff;

    font-family:
        var(--fs-font);

    font-size:
        12px;

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

.fs-auth-input-wrap input::placeholder {
    color:
        #505b66;
}

.fs-auth-input-wrap input:hover {
    border-color:
        rgba(255,255,255,.15);
}

.fs-auth-input-wrap input:focus {
    border-color:
        rgba(255,30,45,.58);

    background:
        #090e13;

    box-shadow:
        0 0 0 3px rgba(255,30,45,.055),
        0 0 18px rgba(255,30,45,.04);
}

.fs-auth-input-icon {
    position: absolute;

    z-index: 2;

    left: 14px;
    top: 50%;

    width: 18px;
    height: 18px;

    transform:
        translateY(-50%);

    display: grid;
    place-items: center;

    color:
        #68737e;

    pointer-events: none;

    transition:
        color .18s ease;
}

.fs-auth-input-icon svg {
    width: 17px;
    height: 17px;
}

.fs-auth-input-wrap:focus-within
.fs-auth-input-icon {
    color:
        var(--fs-red-bright);
}


/* =========================
   PASSWORD EYE
========================= */

.fs-auth-password-toggle {
    position: absolute;

    z-index: 3;

    right: 8px;
    top: 50%;

    width: 35px;
    height: 35px;

    transform:
        translateY(-50%);

    display: grid;
    place-items: center;

    padding: 0;

    border: 0;
    border-radius: 7px;

    background:
        transparent;

    color:
        #69747f;

    cursor: pointer;

    transition:
        color .16s ease,
        background .16s ease;
}

.fs-auth-password-toggle:hover {
    color:
        #fff;

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

.fs-auth-password-toggle svg {
    width: 17px;
    height: 17px;
}

.fs-auth-eye-closed {
    display: none;
}

.fs-auth-password-toggle.is-visible
.fs-auth-eye-open {
    display: none;
}

.fs-auth-password-toggle.is-visible
.fs-auth-eye-closed {
    display: block;
}


/* =========================
   META
========================= */

.fs-auth-form-meta {
    margin-top:
        -4px;
}

.fs-auth-secure-text {
    display: flex;
    align-items: center;

    gap: 6px;

    color:
        #67717c;

    font-size:
        9px;
}

.fs-auth-secure-text svg {
    width: 13px;
    height: 13px;

    color:
        #45d58b;
}


/* =========================
   SUBMIT
========================= */

.fs-auth-submit {
    position: relative;

    width: 100%;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 10px;

    margin-top:
        1px;

    overflow: hidden;

    border:
        1px solid var(--fs-red);

    border-radius:
        8px;

    background:
        linear-gradient(
            135deg,
            #ff2638,
            #ef1427
        );

    color:
        #08090b;

    font-size:
        12px;

    font-weight:
        850;

    cursor: pointer;

    box-shadow:
        0 7px 22px rgba(255,30,45,.12);

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

.fs-auth-submit::before {
    content: "";

    position: absolute;

    top: 0;
    left: -120%;

    width: 65%;
    height: 100%;

    transform:
        skewX(-20deg);

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

    transition:
        left .55s ease;
}

.fs-auth-submit:hover {
    transform:
        translateY(-1px);

    filter:
        brightness(1.06);

    box-shadow:
        0 10px 30px rgba(255,30,45,.24);
}

.fs-auth-submit:hover::before {
    left:
        150%;
}

.fs-auth-submit:active {
    transform:
        translateY(0);
}

.fs-auth-submit span,
.fs-auth-submit svg {
    position: relative;
    z-index: 1;
}

.fs-auth-submit svg {
    width: 16px;
    height: 16px;
}


/* =========================
   CARD FOOTER
========================= */

.fs-auth-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    margin-top:
        25px;

    padding-top:
        17px;

    border-top:
        1px solid rgba(255,255,255,.055);

    color:
        #515c67;

    font:
        8px var(--fs-mono);

    letter-spacing:
        1.2px;
}

.fs-auth-card-footer > div {
    display: flex;
    align-items: center;

    gap: 7px;
}

.fs-auth-footer-status {
    width: 6px;
    height: 6px;

    border-radius:
        50%;

    background:
        #45d58b;

    box-shadow:
        0 0 7px rgba(69,213,139,.55);
}


/* =========================
   RESPONSIVE
========================= */

@media (max-width: 1050px) {

    .fs-auth-shell {
        grid-template-columns:
            minmax(350px,.75fr)
            minmax(430px,1fr);
    }

    .fs-auth-security-list {
        grid-template-columns:
            1fr;
    }

    .fs-auth-security-item:nth-child(3) {
        display: none;
    }

    .fs-auth-hero h1 {
        font-size:
            clamp(44px, 6vw, 64px);
    }

}

@media (max-width: 820px) {

    .fs-auth-shell {
        display: block;
    }

    .fs-auth-visual {
        display: none;
    }

    .fs-auth-main {
        min-height: 100vh;

        padding:
            32px 20px;
    }

    .fs-auth-card {
        width:
            min(470px,100%);
    }

}

@media (max-width: 520px) {

    .fs-auth-main {
        padding:
            18px 14px;
    }

    .fs-auth-card {
        padding:
            27px 21px 22px;

        border-radius:
            12px;
    }

    .fs-auth-card h2 {
        font-size:
            28px;
    }

    .fs-auth-card-footer {
        align-items:
            flex-start;

        flex-direction:
            column;
    }

}


/* Mantiene le animazioni leggere e non invasive */

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

    .fs-auth-logo-ring,
    .fs-auth-live-dot,
    .fs-auth-visual::after {
        animation: none !important;
    }

}

/* =========================================================
   FOXSHIELD AUTH CENTER — MFA VERIFY
========================================================= */

.fs-auth-mfa-hero h1 {
    letter-spacing: -3px;
}


/* =========================
   MFA CARD
========================= */

.fs-auth-mfa-card {
    width: min(470px, 100%);
}


/* =========================
   MFA MAIN ICON
========================= */

.fs-auth-mfa-icon {
    width: 58px;
    height: 58px;

    display: grid;
    place-items: center;

    margin-bottom: 20px;

    border: 1px solid rgba(255,30,45,.30);
    border-radius: 13px;

    background:
        radial-gradient(
            circle at 50% 25%,
            rgba(255,79,92,.15),
            transparent 65%
        ),
        rgba(255,30,45,.06);

    color: var(--fs-red-bright);

    box-shadow:
        inset 0 0 20px rgba(255,30,45,.04),
        0 0 22px rgba(255,30,45,.07);
}

.fs-auth-mfa-icon svg {
    width: 28px;
    height: 28px;

    filter:
        drop-shadow(
            0 0 6px
            rgba(255,30,45,.3)
        );
}


/* =========================
   ACCOUNT
========================= */

.fs-auth-account {
    display: grid;

    grid-template-columns:
        42px
        minmax(0,1fr)
        34px;

    gap: 11px;

    align-items: center;

    margin-bottom: 20px;
    padding: 11px 12px;

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

    border-radius: 9px;

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

.fs-auth-account-avatar {
    width: 42px;
    height: 42px;

    display: grid;
    place-items: center;

    border:
        1px solid rgba(255,30,45,.38);

    border-radius: 50%;

    background:
        radial-gradient(
            circle at 35% 30%,
            rgba(255,79,92,.18),
            transparent 48%
        ),
        rgba(255,30,45,.07);

    color: #fff;

    font-size: 12px;
    font-weight: 800;

    box-shadow:
        0 0 14px rgba(255,30,45,.08);
}

.fs-auth-account-copy {
    min-width: 0;
}

.fs-auth-account-copy span {
    display: block;

    margin-bottom: 3px;

    color:
        #68737e;

    font-size:
        9px;
}

.fs-auth-account-copy strong {
    display: block;

    overflow: hidden;

    color:
        #e8edf2;

    font-size:
        11px;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.fs-auth-account-lock {
    width: 34px;
    height: 34px;

    display: grid;
    place-items: center;

    border:
        1px solid rgba(69,213,139,.13);

    border-radius: 8px;

    background:
        rgba(69,213,139,.035);

    color:
        #45d58b;
}

.fs-auth-account-lock svg {
    width: 16px;
    height: 16px;
}


/* =========================
   OTP
========================= */

.fs-auth-otp-wrap {
    position: relative;
}

.fs-auth-otp-wrap::before {
    content: "";

    position: absolute;

    inset: -1px;

    border-radius: 10px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,30,45,.16),
            transparent
        );

    opacity: 0;

    pointer-events: none;

    transition:
        opacity .18s ease;
}

.fs-auth-otp-wrap:focus-within::before {
    opacity: 1;
}

.fs-auth-otp-wrap input {
    position: relative;
    z-index: 1;

    width: 100%;
    height: 66px;

    box-sizing: border-box;

    padding:
        0 18px;

    outline: none;

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

    border-radius:
        9px;

    background:
        #070c11;

    color:
        #fff;

    font-family:
        var(--fs-mono);

    font-size:
        30px;

    font-weight:
        700;

    letter-spacing:
        12px;

    text-align:
        center;

    caret-color:
        var(--fs-red);

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

.fs-auth-otp-wrap input::placeholder {
    color:
        #303a44;

    opacity: 1;
}

.fs-auth-otp-wrap input:hover {
    border-color:
        rgba(255,255,255,.16);
}

.fs-auth-otp-wrap input:focus {
    border-color:
        rgba(255,30,45,.6);

    background:
        #090e13;

    box-shadow:
        0 0 0 3px rgba(255,30,45,.055),
        0 0 22px rgba(255,30,45,.055);
}

.fs-auth-otp-wrap input.is-complete {
    border-color:
        rgba(69,213,139,.45);

    box-shadow:
        0 0 0 3px rgba(69,213,139,.04),
        0 0 20px rgba(69,213,139,.04);
}


/* =========================
   OTP INFORMATION
========================= */

.fs-auth-otp-info {
    display: flex;
    align-items: flex-start;

    gap: 9px;

    margin-top:
        -4px;

    padding:
        10px 11px;

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

    border-radius:
        8px;

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

.fs-auth-otp-info-icon {
    width: 18px;
    height: 18px;

    flex: 0 0 18px;

    display: grid;
    place-items: center;

    color:
        #68a9ff;
}

.fs-auth-otp-info-icon svg {
    width: 15px;
    height: 15px;
}

.fs-auth-otp-info span {
    color:
        #788491;

    font-size:
        9.5px;

    line-height:
        1.5;
}


/* =========================
   SUBMIT LOADING
========================= */

.fs-auth-submit:disabled {
    cursor:
        wait;

    opacity:
        .82;
}

.fs-auth-submit.is-loading svg {
    animation:
        fsAuthMfaArrow .8s ease-in-out infinite alternate;
}

@keyframes fsAuthMfaArrow {

    from {
        transform:
            translateX(-2px);

        opacity:
            .45;
    }

    to {
        transform:
            translateX(3px);

        opacity:
            1;
    }

}


/* =========================
   MOBILE
========================= */

@media (max-width: 520px) {

    .fs-auth-otp-wrap input {
        height: 62px;

        padding:
            0 10px;

        font-size:
            27px;

        letter-spacing:
            8px;
    }

}

/* =========================================================
   FOXSHIELD AUTH CENTER — MFA SETUP
========================================================= */

.fs-auth-setup-shell {
    position: relative;

    z-index: 1;

    width: 100%;
    min-height: 100vh;

    display: flex;
    flex-direction: column;

    padding:
        30px clamp(26px, 5vw, 76px) 38px;
}


/* =========================
   HEADER
========================= */

.fs-auth-setup-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding-bottom: 24px;

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

.fs-auth-setup-header
.fs-auth-logo-wrap {
    width: 56px;
    height: 56px;

    flex-basis: 56px;
}

.fs-auth-setup-header
.fs-auth-logo {
    width: 49px;
    height: 49px;
}

.fs-auth-setup-status {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    padding:
        7px 10px;

    border:
        1px solid rgba(255,30,45,.21);

    border-radius:
        7px;

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

    color:
        #ff717a;

    font:
        9px var(--fs-mono);

    letter-spacing:
        1.25px;
}

.fs-auth-setup-status span {
    width: 7px;
    height: 7px;

    border-radius:
        50%;

    background:
        var(--fs-red);

    box-shadow:
        0 0 9px rgba(255,30,45,.75);

    animation:
        fsAuthPulse 1.8s ease-in-out infinite;
}


/* =========================
   MAIN
========================= */

.fs-auth-setup-main {
    width:
        min(1180px, 100%);

    margin:
        auto;

    padding:
        50px 0 0;
}


/* =========================
   INTRO
========================= */

.fs-auth-setup-intro {
    max-width:
        760px;
}

.fs-auth-setup-intro
.fs-auth-kicker {
    margin-bottom:
        14px;
}

.fs-auth-setup-intro h1 {
    margin: 0;

    color:
        #fff;

    font-size:
        clamp(34px, 5vw, 54px);

    font-weight:
        900;

    line-height:
        1.05;

    letter-spacing:
        -1.8px;
}

.fs-auth-setup-intro h1 span {
    color:
        var(--fs-red);

    text-shadow:
        0 0 24px rgba(255,30,45,.18);
}

.fs-auth-setup-intro p {
    max-width:
        650px;

    margin:
        15px 0 0;

    color:
        #909aa5;

    font-size:
        13px;

    line-height:
        1.7;
}


/* =========================
   STEPS
========================= */

.fs-auth-setup-steps {
    display: grid;

    grid-template-columns:
        auto
        minmax(40px,1fr)
        auto
        minmax(40px,1fr)
        auto;

    align-items: center;

    gap: 14px;

    margin:
        35px 0 24px;

    padding:
        17px 19px;

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

    border-radius:
        10px;

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

.fs-auth-setup-step {
    display: flex;
    align-items: center;

    gap: 10px;

    opacity:
        .52;
}

.fs-auth-setup-step.active {
    opacity:
        1;
}

.fs-auth-setup-step-number {
    width: 35px;
    height: 35px;

    flex: 0 0 35px;

    display: grid;
    place-items: center;

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

    border-radius:
        8px;

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

    color:
        #79838e;

    font:
        9px var(--fs-mono);
}

.fs-auth-setup-step.active
.fs-auth-setup-step-number {
    border-color:
        rgba(255,30,45,.35);

    background:
        rgba(255,30,45,.075);

    color:
        var(--fs-red-bright);

    box-shadow:
        0 0 14px rgba(255,30,45,.05);
}

.fs-auth-setup-step strong {
    display: block;

    color:
        #e8edf1;

    font-size:
        10px;
}

.fs-auth-setup-step span {
    display: block;

    margin-top:
        3px;

    color:
        #68737e;

    font-size:
        9px;
}

.fs-auth-setup-step-line {
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(255,30,45,.4),
            rgba(255,255,255,.08)
        );
}


/* =========================
   GRID
========================= */

.fs-auth-setup-grid {
    display: grid;

    grid-template-columns:
        minmax(370px,.9fr)
        minmax(430px,1.1fr);

    gap: 16px;

    align-items: stretch;
}


/* =========================
   PANELS
========================= */

.fs-auth-setup-panel {
    padding:
        24px;

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

    border-radius:
        13px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255,30,45,.045),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            rgba(11,15,20,.98),
            rgba(7,10,14,.98)
        );

    box-shadow:
        0 22px 60px rgba(0,0,0,.28);
}

.fs-auth-setup-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 15px;

    margin-bottom:
        22px;
}

.fs-auth-setup-panel-kicker {
    display: block;

    margin-bottom:
        6px;

    color:
        var(--fs-red);

    font:
        9px var(--fs-mono);

    letter-spacing:
        1.5px;
}

.fs-auth-setup-panel-head h2 {
    margin: 0;

    color:
        #fff;

    font-size:
        20px;

    font-weight:
        800;

    letter-spacing:
        -.35px;
}

.fs-auth-setup-panel-icon {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    display: grid;
    place-items: center;

    border:
        1px solid rgba(255,30,45,.20);

    border-radius:
        9px;

    background:
        rgba(255,30,45,.05);

    color:
        var(--fs-red-bright);
}

.fs-auth-setup-panel-icon svg {
    width: 20px;
    height: 20px;
}


/* =========================
   QR
========================= */

.fs-auth-qr-area {
    display: grid;
    place-items: center;

    min-height:
        315px;

    padding:
        22px;

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

    border-radius:
        10px;

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(255,30,45,.055),
            transparent 55%
        ),
        #070b0f;
}

.fs-auth-qr-frame {
    position: relative;

    display: grid;
    place-items: center;

    padding:
        17px;

    border-radius:
        12px;

    background:
        #fff;

    box-shadow:
        0 0 0 1px rgba(255,255,255,.09),
        0 0 35px rgba(255,30,45,.10);
}

.fs-auth-qr-frame img {
    display: block;

    width:
        min(250px, 100%);

    height:
        auto;
}

.fs-auth-qr-corner {
    position: absolute;

    width: 24px;
    height: 24px;

    pointer-events:
        none;
}

.fs-auth-qr-corner.corner-tl {
    top: -8px;
    left: -8px;

    border-top:
        2px solid var(--fs-red);

    border-left:
        2px solid var(--fs-red);
}

.fs-auth-qr-corner.corner-tr {
    top: -8px;
    right: -8px;

    border-top:
        2px solid var(--fs-red);

    border-right:
        2px solid var(--fs-red);
}

.fs-auth-qr-corner.corner-bl {
    bottom: -8px;
    left: -8px;

    border-bottom:
        2px solid var(--fs-red);

    border-left:
        2px solid var(--fs-red);
}

.fs-auth-qr-corner.corner-br {
    bottom: -8px;
    right: -8px;

    border-bottom:
        2px solid var(--fs-red);

    border-right:
        2px solid var(--fs-red);
}


/* =========================
   HELP
========================= */

.fs-auth-setup-help {
    display: flex;
    align-items: flex-start;

    gap: 9px;

    margin-top:
        15px;

    padding:
        11px 12px;

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

    border-radius:
        8px;

    background:
        rgba(104,169,255,.025);

    color:
        #82909d;

    font-size:
        9.5px;

    line-height:
        1.55;
}

.fs-auth-setup-help strong {
    color:
        #cbd4dd;
}

.fs-auth-setup-help-icon {
    width: 18px;
    height: 18px;

    flex: 0 0 18px;

    color:
        #68a9ff;
}

.fs-auth-setup-help-icon svg {
    width: 16px;
    height: 16px;
}


/* =========================
   ACCOUNT
========================= */

.fs-auth-setup-account {
    margin-bottom:
        17px;

    padding:
        12px 13px;

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

    border-radius:
        8px;

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

.fs-auth-setup-account span {
    display: block;

    color:
        #68737e;

    font-size:
        9px;
}

.fs-auth-setup-account strong {
    display: block;

    margin-top:
        4px;

    overflow: hidden;

    color:
        #edf1f4;

    font-size:
        11px;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;
}


/* =========================
   SECRET
========================= */

.fs-auth-secret-block {
    margin-bottom:
        19px;

    padding:
        13px;

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

    border-radius:
        9px;

    background:
        #070c11;
}

.fs-auth-secret-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;

    margin-bottom:
        10px;
}

.fs-auth-secret-head span {
    display: block;

    color:
        #aab3bc;

    font:
        9px var(--fs-mono);

    letter-spacing:
        1px;
}

.fs-auth-secret-head small {
    display: block;

    margin-top:
        3px;

    color:
        #606b76;

    font-size:
        8.5px;
}

.fs-auth-secret-value {
    padding:
        12px;

    overflow-wrap:
        anywhere;

    border:
        1px solid rgba(255,30,45,.14);

    border-radius:
        7px;

    background:
        rgba(255,30,45,.025);

    color:
        #e9edf1;

    font:
        12px var(--fs-mono);

    line-height:
        1.5;

    letter-spacing:
        1.4px;

    text-align:
        center;
}


/* =========================
   COPY
========================= */

.fs-auth-copy-button {
    display: inline-flex;
    align-items: center;

    gap: 6px;

    min-height:
        31px;

    padding:
        0 9px;

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

    border-radius:
        6px;

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

    color:
        #8d98a3;

    font-size:
        9px;

    font-weight:
        700;

    cursor:
        pointer;

    transition:
        color .16s ease,
        border-color .16s ease,
        background .16s ease;
}

.fs-auth-copy-button svg {
    width: 13px;
    height: 13px;
}

.fs-auth-copy-button:hover {
    color:
        #fff;

    border-color:
        rgba(255,30,45,.38);

    background:
        rgba(255,30,45,.06);
}

.fs-auth-copy-button.is-copied {
    color:
        #64e69c;

    border-color:
        rgba(69,213,139,.28);

    background:
        rgba(69,213,139,.055);
}


/* =========================
   FOOTER
========================= */

.fs-auth-setup-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;

    margin-top:
        20px;

    padding:
        14px 3px 0;

    border-top:
        1px solid rgba(255,255,255,.05);

    color:
        #505b66;

    font:
        8px var(--fs-mono);

    letter-spacing:
        1.1px;
}

.fs-auth-setup-footer > div {
    display: flex;
    align-items: center;

    gap: 7px;
}


/* =========================
   RESPONSIVE
========================= */

@media (max-width: 1000px) {

    .fs-auth-setup-grid {
        grid-template-columns:
            1fr;
    }

}

@media (max-width: 760px) {

    .fs-auth-setup-shell {
        padding:
            22px 16px 28px;
    }

    .fs-auth-setup-main {
        padding-top:
            35px;
    }

    .fs-auth-setup-steps {
        grid-template-columns:
            1fr;

        gap:
            12px;
    }

    .fs-auth-setup-step-line {
        display:
            none;
    }

    .fs-auth-setup-header {
        align-items:
            flex-start;

        flex-direction:
            column;
    }

}

@media (max-width: 520px) {

    .fs-auth-setup-panel {
        padding:
            19px;
    }

    .fs-auth-qr-area {
        min-height:
            270px;

        padding:
            17px;
    }

    .fs-auth-qr-frame img {
        width:
            210px;
    }

    .fs-auth-secret-head {
        align-items:
            flex-start;

        flex-direction:
            column;
    }

    .fs-auth-copy-button {
        width:
            100%;

        justify-content:
            center;
    }

    .fs-auth-setup-footer {
        align-items:
            flex-start;

        flex-direction:
            column;
    }

}

/* =========================================================
   FOXSHIELD AUTH CENTER — PASSWORD CHANGE
========================================================= */

.fs-auth-password-card {
    width: min(500px,100%);
}

.fs-auth-password-hero h1 {
    letter-spacing: -3px;
}


/* =========================
   STATUS
========================= */

.fs-auth-password-status {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    margin-bottom: 20px;

    padding: 6px 9px;

    border-radius: 6px;

    font:
        9px var(--fs-mono);

    letter-spacing: 1.15px;
}

.fs-auth-password-status.warning {
    color: #ffc45c;

    border:
        1px solid rgba(241,182,76,.22);

    background:
        rgba(241,182,76,.055);
}

.fs-auth-password-status span {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: #f1b64c;

    box-shadow:
        0 0 8px rgba(241,182,76,.65);

    animation:
        fsPasswordStatusPulse
        1.8s ease-in-out infinite;
}

@keyframes fsPasswordStatusPulse {

    50% {
        opacity: .4;
        transform: scale(.72);
    }

}


/* =========================
   ICON
========================= */

.fs-auth-password-main-icon {
    color: var(--fs-red-bright);
}


/* =========================
   ACCOUNT
========================= */

.fs-auth-password-account {
    margin-bottom: 20px;

    padding: 11px 13px;

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

    border-radius: 8px;

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

.fs-auth-password-account span {
    display: block;

    margin-bottom: 4px;

    color: #68737e;

    font:
        8px var(--fs-mono);

    letter-spacing: 1px;
}

.fs-auth-password-account strong {
    display: block;

    overflow: hidden;

    color: #e9edf1;

    font-size: 11px;

    text-overflow: ellipsis;

    white-space: nowrap;
}


/* =========================
   PASSWORD RULES
========================= */

.fs-auth-password-rules {
    padding: 13px 14px;

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

    border-radius: 9px;

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

.fs-auth-password-rules-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;

    margin-bottom: 10px;
}

.fs-auth-password-rules-head > span {
    color: #717d88;

    font:
        8.5px var(--fs-mono);

    letter-spacing: 1px;
}

.fs-auth-password-rules-head strong {
    color: #77828d;

    font-size: 9px;

    font-weight: 800;
}

.fs-auth-password-rules-head
strong[data-score="2"] {
    color: #ff6671;
}

.fs-auth-password-rules-head
strong[data-score="4"] {
    color: #f1b64c;
}

.fs-auth-password-rules-head
strong[data-score="5"] {
    color: #45d58b;
}


/* =========================
   STRENGTH BAR
========================= */

.fs-auth-password-strength {
    position: relative;

    width: 100%;
    height: 5px;

    overflow: hidden;

    margin-bottom: 13px;

    border-radius: 999px;

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

.fs-auth-password-strength span {
    display: block;

    width: 0;
    height: 100%;

    border-radius: inherit;

    background:
        var(--fs-red);

    box-shadow:
        0 0 8px rgba(255,30,45,.25);

    transition:
        width .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}

.fs-auth-password-strength
span[data-score="3"],
.fs-auth-password-strength
span[data-score="4"] {
    background: #f1b64c;

    box-shadow:
        0 0 8px rgba(241,182,76,.25);
}

.fs-auth-password-strength
span[data-score="5"] {
    background: #45d58b;

    box-shadow:
        0 0 10px rgba(69,213,139,.28);
}


/* =========================
   RULE GRID
========================= */

.fs-auth-password-rule-grid {
    display: grid;

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

    gap: 7px 10px;
}

.fs-auth-password-rule {
    display: flex;
    align-items: center;

    gap: 7px;

    color: #68737e;

    font-size: 9px;

    transition:
        color .18s ease;
}

.fs-auth-rule-icon {
    width: 16px;
    height: 16px;

    flex: 0 0 16px;

    display: grid;
    place-items: center;

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

    border-radius: 50%;

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

    color: #4e5964;

    font-size: 8px;

    font-weight: 900;

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

.fs-auth-password-rule.is-valid {
    color: #a4d8b9;
}

.fs-auth-password-rule.is-valid
.fs-auth-rule-icon {
    color: #45d58b;

    border-color:
        rgba(69,213,139,.28);

    background:
        rgba(69,213,139,.07);

    box-shadow:
        0 0 8px rgba(69,213,139,.08);
}


/* =========================
   PASSWORD MATCH
========================= */

.fs-auth-password-match {
    margin-top: 7px;

    color: #65717c;

    font-size: 9px;

    transition:
        color .18s ease;
}

.fs-auth-password-match.is-valid {
    color: #45d58b;
}

.fs-auth-password-match.is-invalid {
    color: #ff6571;
}


/* =========================
   LOADING
========================= */

.fs-auth-password-card
.fs-auth-submit.is-loading svg {
    animation:
        fsPasswordSubmitArrow
        .8s ease-in-out
        infinite alternate;
}

@keyframes fsPasswordSubmitArrow {

    from {
        opacity: .45;

        transform:
            translateX(-2px);
    }

    to {
        opacity: 1;

        transform:
            translateX(3px);
    }

}


/* =========================
   RESPONSIVE
========================= */

@media (max-width: 520px) {

    .fs-auth-password-rule-grid {
        grid-template-columns: 1fr;
    }

}

/* =========================================================
   SIDEBAR - CONTATORE INCIDENTI
========================================================= */

.fs-nav-counter {
    margin-left: auto;

    min-width: 24px;
    height: 24px;

    padding: 0 7px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 999px;

    background:
        linear-gradient(
            135deg,
            var(--fs-red-bright),
            var(--fs-red)
        );

    color: #fff;

    font-family: var(--fs-mono);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;

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

    box-shadow:
        0 0 0 1px rgba(255,30,45,.14),
        0 0 14px rgba(255,30,45,.34),
        0 5px 14px rgba(0,0,0,.28);

    flex-shrink: 0;
}

.fs-nav-link:hover .fs-nav-counter,
.fs-nav-link.active .fs-nav-counter {
    box-shadow:
        0 0 0 1px rgba(255,30,45,.22),
        0 0 19px rgba(255,30,45,.50),
        0 6px 16px rgba(0,0,0,.34);
}

/*
 * Sidebar ridotta:
 * il badge resta visibile vicino all'icona.
 */
.fs-sidebar.collapsed .fs-nav-counter {
    position: absolute;

    top: 6px;
    right: 6px;

    min-width: 18px;
    height: 18px;

    padding: 0 5px;

    font-size: 10px;

    border: 2px solid var(--fs-sidebar-bg, #0b0d10);
}

.fs-sidebar.collapsed .fs-nav-link {
    position: relative;
}

/* =========================================================
   FOXSHIELD SIDEBAR - FULL HEIGHT / NO SCROLLBAR
========================================================= */

.fs-sidebar {
    height: 100vh;
    min-height: 100vh;
    max-height: 100vh;

    display: flex;
    flex-direction: column;

    overflow: hidden;
}

/*
 * Il menu NON deve occupare artificialmente metà sidebar.
 * Deve prendere solo lo spazio necessario alle sue voci.
 */
.fs-nav {
    flex: 0 0 auto !important;
    min-height: 0;

    overflow: visible !important;
    overflow-y: visible !important;
    overflow-x: hidden !important;

    scrollbar-width: none;
}

.fs-nav::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

/*
 * È questo elemento che deve assorbire lo spazio
 * rimasto tra menu e blocco utente.
 */
.fs-sidebar-status {
    flex: 1 1 auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}

/*
 * Profilo sempre ancorato in fondo.
 */
.fs-sidebar-user {
    flex: 0 0 auto;
    margin-top: 0 !important;
}

/*
 * Le voci si ridimensionano automaticamente
 * in funzione dell'altezza dello schermo.
 */
.fs-nav {
    gap: clamp(2px, .55vh, 5px) !important;

    padding:
        clamp(6px, 1.5vh, 15px)
        13px !important;
}

.fs-nav-link {
    min-height:
        clamp(35px, 5.7vh, 47px) !important;

    padding:
        clamp(6px, 1.15vh, 11px)
        12px !important;
}

/*
 * Schermi particolarmente bassi:
 * compattiamo ulteriormente senza scroll.
 */
@media (max-height: 700px) {

    .fs-nav {
        gap: 2px !important;
        padding-top: 7px !important;
        padding-bottom: 7px !important;
    }

    .fs-nav-link {
        min-height: 38px !important;
        padding-top: 6px !important;
        padding-bottom: 6px !important;
    }

    .fs-sidebar-user {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media (max-height: 600px) {

    .fs-nav-link {
        min-height: 34px !important;
        padding-top: 4px !important;
        padding-bottom: 4px !important;
        font-size: 12px !important;
    }

    .fs-nav-link svg {
        width: 18px !important;
        height: 18px !important;
        flex-basis: 18px !important;
    }

    .fs-nav {
        padding-top: 4px !important;
        padding-bottom: 4px !important;
    }

    .fs-sidebar-user {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }
}