body {
    margin:0;
    font-family:'Titillium Web',sans-serif;
    color:#fff;
    background:#000;
}
.bg-overlay {
    position:fixed;
    inset:0;
    background:url('../background.jpg') center center no-repeat;
    background-size:cover;
    filter:brightness(0.45);
    z-index:-2;
}
.bg-overlay::after {
    content:'';
    position:absolute;
    inset:0;
    background:radial-gradient(circle at top,rgba(255,153,0,0.3),transparent 60%);
}
.up-wrapper {
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
}
.up-card {
    width:720px;
    background:rgba(10,10,10,0.92);
    border:1px solid rgba(255,153,0,0.5);
    box-shadow:0 0 25px rgba(0,0,0,0.8);
    border-radius:8px;
    padding:25px 30px 30px;
}
.up-logo {
    text-align:center;
    margin-bottom:15px;
}
.up-logo img {
    max-width:120px;
}
.up-title {
    text-align:center;
    font-size:20px;
    letter-spacing:2px;
    margin:5px 0 15px;
    text-transform:uppercase;
    color:#ffa733;
}
.up-tabs {
    display:flex;
    gap:4px;
    margin-bottom:15px;
}
.up-tab-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 40px;
    font-size: 12px;
    text-transform: uppercase;
    text-decoration: none;        /* βγάζει την υπογράμμιση από τα <a> */
    border: 1px solid rgba(255, 153, 0, 0.35);
    background: rgba(20, 20, 20, 0.95);
    color: #fff;
    cursor: pointer;
}

.up-tab-btn.active {
    background:linear-gradient(90deg,#ff9900,#ffcc33);
    color:#111;
    border-color:#ffcc33;
    font-weight:600;
}
.up-flash {
    margin-bottom:10px;
    padding:8px 10px;
    border-radius:4px;
    font-size:13px;
    text-align:center;
}
.up-flash.ok {
    background:rgba(0,160,80,0.9);
}
.up-flash.fail {
    background:rgba(180,40,40,0.9);
}
.up-group {
    margin-bottom:10px;
}
.up-group label {
    display:block;
    font-size:13px;
    margin-bottom:4px;
}
.up-group input {
    width:100%;
    padding:8px 9px;
    background:#141414;
    border:1px solid #333;
    color:#fff;
    font-size:13px;
}
.up-btn {
    width:100%;
    padding:9px 0;
    margin-top:5px;
    background:linear-gradient(90deg,#ff9900,#ffcc33);
    border:none;
    color:#111;
    font-weight:600;
    text-transform:uppercase;
    cursor:pointer;
}
.up-small {
    font-size:12px;
    opacity:0.8;
    margin-top:6px;
    text-align:center;
}
.up-logout {
    margin-top:10px;
    text-align:center;
}
.up-logout button {
    background:none;
    border:none;
    color:#ffcc33;
    cursor:pointer;
    font-size:12px;
    text-decoration:underline;
}
table.up-table {
    width:100%;
    border-collapse:collapse;
    margin-top:8px;
    font-size:12px;
}
table.up-table th, table.up-table td {
    border:1px solid #333;
    padding:4px 6px;
    text-align:left;
}
table.up-table th {
    background:rgba(255,153,0,0.12);
}
.up-badge-online {
    color:#4cff4c;
    font-weight:600;
}
.up-badge-offline {
    color:#ff6666;
    font-weight:600;
}
.up-btn-small {
    padding:4px 6px;
    font-size:11px;
    width:auto;
    margin:0;
}