/* ============================================================
   IPTV PROXY MANAGER - MASTER UI
   Gemeinsames Design MASTER DE + MASTER IT
   ============================================================ */

:root {
    --master-bg: #f4f7fb;
    --master-card: #ffffff;
    --master-text: #172033;
    --master-muted: #667085;
    --master-border: #e7ebf2;
    --master-primary: #2563eb;
    --master-primary-hover: #1d4ed8;
    --master-danger: #dc2626;
    --master-success: #16a34a;
    --master-radius: 14px;
    --master-shadow: 0 4px 18px rgba(16,24,40,.07);
}


/* GRUNDLAYOUT */

html {
    background: var(--master-bg);
}

body {
    background: var(--master-bg) !important;
    color: var(--master-text);
}


/* KARTEN */

.card,
.summary-box {
    background: var(--master-card) !important;
    border: 1px solid var(--master-border) !important;
    border-radius: var(--master-radius) !important;
    box-shadow: var(--master-shadow) !important;
}


/* ÜBERSCHRIFTEN */

h1 {
    color: var(--master-text);
    letter-spacing: -.02em;
}

h2,
h3 {
    color: var(--master-text);
}

.subtitle,
.note,
small {
    color: var(--master-muted);
}


/* EINGABEFELDER */

input,
select,
textarea {
    border: 1px solid #d9dee8 !important;
    border-radius: 9px !important;
    background: #fff;
}

input:focus,
select:focus,
textarea:focus {
    border-color: #86a8ff !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(37,99,235,.10) !important;
}


/* BUTTONS */

button,
.button,
.btn {
    border-radius: 9px !important;
    font-weight: 700;
}

button.primary,
.btn-primary,
.primary {
    background: var(--master-primary) !important;
    color: #fff !important;
    border-color: var(--master-primary) !important;
}

button.primary:hover,
.btn-primary:hover,
.primary:hover {
    background: var(--master-primary-hover) !important;
}

button.secondary,
.btn-secondary,
.secondary {
    border-radius: 9px !important;
}


/* ZURÜCK / AKTUALISIEREN */

.back,
.fw-overview {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 14px !important;
    background: #fff !important;
    color: #344054 !important;
    border: 1px solid #edf0f5 !important;
    border-radius: 9px !important;
    box-shadow: 0 3px 12px rgba(16,24,40,.07) !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

.fw-refresh,
.master-refresh {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 14px !important;
    background: var(--master-primary) !important;
    color: #fff !important;
    border: 1px solid var(--master-primary) !important;
    border-radius: 9px !important;
    box-shadow: 0 3px 12px rgba(37,99,235,.20) !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

.fw-refresh:hover,
.master-refresh:hover {
    background: var(--master-primary-hover) !important;
}


/* TABELLEN */

table {
    background: #fff;
    border-radius: 10px;
}

thead th {
    background: #f8fafc;
    color: #475467;
    font-weight: 700;
}

tbody tr {
    transition: background .15s ease;
}

tbody tr:hover {
    background: #f8faff;
}


/* STATUS / MELDUNGEN */

.message {
    border-radius: 10px !important;
}

.error {
    border-radius: 10px !important;
}

.ok {
    color: var(--master-success);
}

.bad {
    color: var(--master-danger);
}


/* FIREWALL TOP BUTTONS */

.top-firewall-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}


/* MOBILE */

@media (max-width: 700px) {

    .top-firewall-actions {
        flex-wrap: wrap;
    }

    .back,
    .fw-overview,
    .fw-refresh,
    .master-refresh {
        min-height: 38px;
    }
}

/* ============================================================
   LOGOUT / ABBMELDEN
   ============================================================ */

.master-logout {
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 15px !important;
    border-radius:9px !important;
    background:#fff !important;
    color:#b42318 !important;
    border:1px solid #f3d3d0 !important;
    box-shadow:0 3px 12px rgba(16,24,40,.07) !important;
    text-decoration:none !important;
    font-weight:700 !important;
    transition:.15s ease;
}

.master-logout:hover {
    background:#fff4f2 !important;
    border-color:#f0b9b3 !important;
}

/* ===== LOGOUT FINAL ===== */
a.logout.master-logout {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:40px !important;
    padding:0 16px !important;
    background:#fff !important;
    color:#dc2626 !important;
    border:1px solid #fecaca !important;
    border-radius:9px !important;
    box-shadow:0 3px 12px rgba(16,24,40,.08) !important;
    text-decoration:none !important;
    font-weight:700 !important;
}

a.logout.master-logout:hover {
    background:#fef2f2 !important;
    border-color:#fca5a5 !important;
}