/* Built-in theme inherits assets/app.css */


/* HostFlow v3.1.1 — Default theme server network map */
.default-server-map-section{
    margin-top:56px;
    padding-top:46px;
    border-top:1px solid var(--line);
}
.server-map-heading{
    align-items:flex-end;
    margin-bottom:22px;
}
.server-map-heading>div:first-child{
    max-width:720px;
}
.server-map-heading p{
    margin:7px 0 0;
    color:var(--muted);
    line-height:1.65;
}
.server-map-summary{
    display:flex;
    align-items:baseline;
    gap:8px;
    padding:10px 14px;
    border:1px solid var(--line);
    border-radius:12px;
    background:#111722;
}
.server-map-summary strong{
    font-size:24px;
    color:#fff;
}
.server-map-summary span{
    color:var(--muted);
    font-size:13px;
}
.default-server-map-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:18px;
    align-items:stretch;
    width:100%;
}
.server-world-map{
    width:100%;
}
.server-world-map{
    position:relative;
    min-height:430px;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:18px;
    background:
        radial-gradient(circle at 50% 44%,rgba(108,99,255,.08),transparent 42%),
        linear-gradient(180deg,#111722,#0c1119);
}
.server-world-map::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,.015),transparent 30%,rgba(0,0,0,.1));
}
.server-world-map-art{
    position:absolute;
    inset:7% 4%;
    width:92%;
    height:86%;
}
.world-map-grid{
    fill:none;
    stroke:rgba(143,158,184,.07);
    stroke-width:1;
    vector-effect:non-scaling-stroke;
}
.world-map-land{
    fill:#1b2432;
    stroke:#2b384b;
    stroke-width:1.4;
    vector-effect:non-scaling-stroke;
}
.server-map-marker{
    position:absolute;
    left:var(--marker-x);
    top:var(--marker-y);
    width:20px;
    height:20px;
    transform:translate(-50%,-50%);
    z-index:5;
    outline:none;
}
.server-map-dot{
    position:absolute;
    left:50%;
    top:50%;
    width:10px;
    height:10px;
    transform:translate(-50%,-50%);
    border-radius:50%;
    background:#52d99a;
    border:2px solid #dffbef;
    box-shadow:0 0 18px rgba(82,217,154,.6);
}
.server-map-pulse{
    position:absolute;
    inset:0;
    border:1px solid rgba(82,217,154,.65);
    border-radius:50%;
    animation:hostflow-server-pulse 2s infinite ease-out;
}
.server-map-marker.degraded .server-map-dot{background:#ffbd55;border-color:#fff0d5;box-shadow:0 0 18px rgba(255,189,85,.5)}
.server-map-marker.degraded .server-map-pulse{border-color:rgba(255,189,85,.65)}
.server-map-marker.offline .server-map-dot{background:#ff6f86;border-color:#ffe0e5;box-shadow:0 0 18px rgba(255,111,134,.45)}
.server-map-marker.offline .server-map-pulse{border-color:rgba(255,111,134,.6);animation:none}
.server-map-marker.maintenance .server-map-dot{background:#72c8ff;border-color:#e0f4ff;box-shadow:0 0 18px rgba(114,200,255,.45)}
.server-map-marker.maintenance .server-map-pulse{border-color:rgba(114,200,255,.6)}
@keyframes hostflow-server-pulse{
    0%{transform:scale(.55);opacity:.9}
    75%,100%{transform:scale(1.55);opacity:0}
}
.server-map-tooltip{
    position:absolute;
    left:50%;
    bottom:calc(100% + 12px);
    min-width:180px;
    transform:translateX(-50%) translateY(6px);
    padding:10px 11px;
    border:1px solid #2a3445;
    border-radius:10px;
    background:#090e16;
    box-shadow:0 15px 42px rgba(0,0,0,.45);
    opacity:0;
    visibility:hidden;
    transition:.16s ease;
    pointer-events:none;
}
.server-map-marker:hover .server-map-tooltip,
.server-map-marker:focus .server-map-tooltip{
    opacity:1;
    visibility:visible;
    transform:translateX(-50%) translateY(0);
}
.server-map-tooltip strong,
.server-map-tooltip small{
    display:block;
}
.server-map-tooltip small{
    margin:2px 0 8px;
    color:var(--muted);
}
.server-map-tooltip>div{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
}
.server-map-tooltip b{
    color:#fff;
}
.server-map-status{
    display:inline-flex;
    align-items:center;
    width:max-content;
    padding:3px 7px;
    border-radius:999px;
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
}
.server-map-status.online{background:rgba(82,217,154,.12);color:#71e6af}
.server-map-status.degraded{background:rgba(255,189,85,.13);color:#ffca72}
.server-map-status.offline{background:rgba(255,111,134,.12);color:#ff8da0}
.server-map-status.maintenance{background:rgba(114,200,255,.12);color:#8dd5ff}
.server-location-list{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    width:100%;
}
.server-location-card{
    flex:1;
    min-height:74px;
    display:grid;
    grid-template-columns:36px minmax(0,1fr) auto;
    gap:11px;
    align-items:center;
    padding:12px 14px;
    border:1px solid var(--line);
    border-radius:13px;
    background:#111722;
}
.server-location-icon{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:9px;
    background:#172231;
}
.server-location-icon span{
    width:9px;
    height:9px;
    border-radius:50%;
    background:#52d99a;
}
.server-location-icon.degraded span{background:#ffbd55}
.server-location-icon.offline span{background:#ff6f86}
.server-location-icon.maintenance span{background:#72c8ff}
.server-location-info{
    min-width:0;
}
.server-location-info strong,
.server-location-info span,
.server-location-latency strong,
.server-location-latency span{
    display:block;
}
.server-location-info strong{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.server-location-info span,
.server-location-latency span{
    color:var(--muted);
    font-size:12px;
}
.server-location-latency{
    text-align:right;
}
.server-location-latency strong{
    font-size:17px;
}
.server-map-empty{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:min(320px,80%);
    text-align:center;
    padding:18px;
    border:1px solid var(--line);
    border-radius:12px;
    background:rgba(9,14,22,.88);
}
.server-map-empty strong,
.server-map-empty span{
    display:block;
}
.server-map-empty span{
    margin-top:5px;
    color:var(--muted);
    font-size:13px;
}

@media(max-width:900px){
    .default-server-map-layout{
        grid-template-columns:1fr;
    }
    .server-world-map{
        min-height:380px;
    }
    .server-location-list{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media(max-width:620px){
    .default-server-map-section{
        margin-top:38px;
        padding-top:32px;
    }
    .server-map-heading{
        align-items:flex-start!important;
    }
    .server-map-summary{
        width:100%;
    }
    .server-world-map{
        min-height:300px;
    }
    .server-world-map-art{
        inset:4% 1%;
        width:98%;
        height:92%;
    }
    .server-location-list{
        grid-template-columns:1fr;
    }
    .server-map-tooltip{
        min-width:150px;
        max-width:220px;
    }
}
