:root {
    --iveco-red: #1554FF;
    --iveco-dark-red: #0d3fcc;
    --iveco-black: #040505;
    --iveco-dark: #0f1012;
    --iveco-grey: #1a1b1e;
    --iveco-mid: #24252a;
    --iveco-light: #f5f5f3;
    --iveco-muted: #888;
    --iveco-border: rgba(255, 255, 255, 0.08);
    --accent: #ffffff;
    --ok: #3ddc84;
    --warn: #f0a030;
    --err: #e3556a;
}

*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: var(--iveco-black);
    color: var(--iveco-light);
    min-height: 100vh;
}

a { color: var(--iveco-red); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ──────── LOGIN ──────── */

.admin--login { display: flex; min-height: 100vh; }

.admin-login {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    background:
        radial-gradient(circle at 30% 20%, rgba(21, 84, 255, 0.15) 0%, transparent 40%),
        radial-gradient(circle at 70% 80%, rgba(255, 255, 255, 0.08) 0%, transparent 40%),
        var(--iveco-black);
}

.admin-login__card {
    width: 100%;
    max-width: 420px;
    background: var(--iveco-dark);
    border: 1px solid var(--iveco-border);
    border-radius: 8px;
    padding: 40px 36px;
}

.admin-login__brand {
    display: flex;
    flex-direction: column;
    margin-bottom: 28px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--iveco-border);
}

.admin-login__mark {
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
    font-size: 2rem;
    letter-spacing: 0.15em;
    color: #fff;
}

.admin-login__sub {
    font-size: 0.7rem;
    letter-spacing: 0.25em;
    color: var(--iveco-muted);
    text-transform: uppercase;
}

.admin-login h1 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
    font-size: 1.8rem;
    text-transform: uppercase;
    margin: 0 0 20px;
}

.admin-login label {
    display: block;
    margin-bottom: 16px;
    font-size: 0.72rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--iveco-muted);
}

.admin-login input[type="email"],
.admin-login input[type="password"] {
    display: block;
    margin-top: 6px;
    width: 100%;
    background: var(--iveco-mid);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    padding: 12px 14px;
    color: #fff;
    font-size: 0.95rem;
    outline: none;
}

.admin-login input:focus {
    border-color: var(--iveco-red);
}

/* ──────── TOPBAR ──────── */

.admin-topbar {
    display: flex;
    align-items: center;
    gap: 32px;
    padding: 16px 32px;
    background: var(--iveco-dark);
    border-bottom: 1px solid var(--iveco-border);
    position: sticky;
    top: 0;
    z-index: 100;
}

.admin-topbar__brand {
    display: flex;
    flex-direction: column;
    line-height: 1;
}

.admin-topbar__mark {
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
    font-size: 1.3rem;
    letter-spacing: 0.12em;
}

.admin-topbar__sub {
    font-size: 0.62rem;
    letter-spacing: 0.2em;
    color: var(--iveco-muted);
    text-transform: uppercase;
    margin-top: 2px;
}

.admin-topbar__nav {
    flex: 1;
    display: flex;
    gap: 4px;
}

.admin-topbar__nav a {
    padding: 10px 16px;
    color: rgba(255, 255, 255, 0.6);
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 0.85rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border-radius: 3px;
    transition: background 0.15s, color 0.15s;
    text-decoration: none;
}

.admin-topbar__nav a:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.05);
    text-decoration: none;
}

.admin-topbar__nav a.is-active {
    color: #fff;
    background: rgba(21, 84, 255, 0.15);
    border: 1px solid rgba(21, 84, 255, 0.4);
}

.admin-topbar__user {
    display: flex;
    align-items: center;
    gap: 12px;
}

.admin-topbar__email {
    font-size: 0.82rem;
    color: var(--iveco-muted);
}

.admin-topbar__logout { display: inline-block; }

/* ──────── MAIN ──────── */

.admin-main {
    max-width: 1280px;
    margin: 0 auto;
    padding: 32px;
}

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

.admin-page-head h1 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
    font-size: 2rem;
    text-transform: uppercase;
    margin: 0;
    letter-spacing: 0.02em;
}

.admin-page-head__actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.admin-toolbar {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
.admin-toolbar__hint {
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.85rem;
}

.admin-subtitle {
    font-size: 0.9rem;
    color: var(--iveco-muted);
    margin: 4px 0 0;
}

.admin-breadcrumb {
    font-size: 0.85rem;
    color: var(--iveco-muted);
    margin: 0 0 12px;
}

.admin-breadcrumb a {
    color: var(--iveco-muted);
}

/* ──────── STATS ──────── */

.admin-stat-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.admin-stat {
    background: var(--iveco-dark);
    border: 1px solid var(--iveco-border);
    border-radius: 4px;
    padding: 14px 20px;
    min-width: 120px;
}

.admin-stat--alert {
    border-color: rgba(227, 85, 106, 0.4);
    background: rgba(227, 85, 106, 0.08);
}

.admin-stat__num {
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
    font-size: 1.8rem;
    line-height: 1;
}

.admin-stat__label {
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    color: var(--iveco-muted);
    text-transform: uppercase;
    margin-top: 4px;
}

/* ──────── FILTERS ──────── */

.admin-filters {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
    background: var(--iveco-dark);
    border: 1px solid var(--iveco-border);
    border-radius: 4px;
    padding: 14px 18px;
    margin-bottom: 20px;
}

.admin-filters input[type="search"] { min-width: 260px; }

.admin-filters label {
    font-size: 0.7rem;
    letter-spacing: 0.15em;
    color: var(--iveco-muted);
    text-transform: uppercase;
}

.admin-filters input[type="search"],
.admin-filters input[type="date"] {
    display: block;
    margin-top: 4px;
    background: var(--iveco-mid);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 3px;
    padding: 8px 12px;
    color: #fff;
    font-size: 0.9rem;
    outline: none;
}

/* ──────── TABLE ──────── */

.admin-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--iveco-dark);
    border: 1px solid var(--iveco-border);
    border-radius: 4px;
    overflow: hidden;
}

.admin-table th,
.admin-table td {
    text-align: left;
    padding: 12px 14px;
    border-bottom: 1px solid var(--iveco-border);
    font-size: 0.9rem;
}

.admin-table th {
    background: rgba(255, 255, 255, 0.02);
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 0.78rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--iveco-muted);
}

.admin-table tbody tr:hover { background: rgba(255, 255, 255, 0.02); }

.admin-table--compact th,
.admin-table--compact td { padding: 8px 12px; font-size: 0.85rem; }

/* ──────── BADGES ──────── */

.admin-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.72rem;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.7);
}

.admin-badge--sent { background: rgba(61, 220, 132, 0.15); color: var(--ok); }
.admin-badge--pending { background: rgba(240, 160, 48, 0.15); color: var(--warn); }
.admin-badge--partial { background: rgba(240, 160, 48, 0.15); color: var(--warn); }
.admin-badge--failed { background: rgba(227, 85, 106, 0.15); color: var(--err); }

.admin-zap-status {
    padding: 14px 16px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.04);
    line-height: 1.6;
}
.admin-zap-status--ok { border-left: 3px solid var(--ok); }
.admin-zap-status--err { border-left: 3px solid var(--err); }
.admin-zap-status__error { margin-top: 10px; padding-top: 10px; border-top: 1px dashed rgba(255, 255, 255, 0.1); }
.admin-zap-status__ok { margin: 8px 0 0; color: rgba(255, 255, 255, 0.75); }
.admin-zap-status__hint { margin: 10px 0 0; font-size: 0.85rem; color: rgba(255, 255, 255, 0.65); }
.admin-zap-status__hint a { color: var(--accent); }
.admin-zap-status__pre {
    margin-top: 6px;
    padding: 10px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 6px;
    font-size: 0.8rem;
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-word;
}

.admin-tag {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 8px;
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--accent);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 20px;
}

/* ──────── BUTTONS ──────── */

.admin-btn {
    display: inline-block;
    background: var(--iveco-mid);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    padding: 10px 18px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s;
}

.admin-btn:hover { text-decoration: none; background: rgba(255, 255, 255, 0.05); }

.admin-btn--primary {
    background: var(--iveco-red);
    border-color: var(--iveco-red);
}
.admin-btn--primary:hover { background: var(--iveco-dark-red); border-color: var(--iveco-dark-red); }

.admin-btn--ghost {
    background: transparent;
    color: rgba(255, 255, 255, 0.6);
}

.admin-btn--danger {
    border-color: rgba(227, 85, 106, 0.4);
    color: var(--err);
}
.admin-btn--danger:hover { background: rgba(227, 85, 106, 0.12); }

.admin-btn--small { padding: 6px 12px; font-size: 0.72rem; }

/* ──────── CARDS / FORMS ──────── */

.admin-card {
    background: var(--iveco-dark);
    border: 1px solid var(--iveco-border);
    border-radius: 4px;
    padding: 20px 22px;
    margin-bottom: 20px;
}

.admin-card h2 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--accent);
    margin: 0 0 14px;
}

.admin-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 16px;
}

.admin-card--wide { grid-column: 1 / -1; }

.admin-card dl { margin: 0; display: grid; grid-template-columns: 140px 1fr; gap: 6px 14px; }
.admin-card dt { font-size: 0.75rem; color: var(--iveco-muted); text-transform: uppercase; letter-spacing: 0.1em; }
.admin-card dd { margin: 0; font-size: 0.92rem; }

.admin-ua { font-family: 'SF Mono', Menlo, monospace; font-size: 0.78rem; word-break: break-all; }

.admin-comments { white-space: pre-wrap; line-height: 1.6; }

.admin-form-inline {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.admin-form-inline input[type="text"],
.admin-form-inline input[type="email"],
.admin-form-inline input[type="password"] {
    background: var(--iveco-mid);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    padding: 9px 12px;
    color: #fff;
    font-size: 0.9rem;
    outline: none;
    flex: 1;
    min-width: 180px;
}

.admin-form-row,
.admin-inline-form { display: inline-flex; gap: 6px; align-items: center; margin: 0; }

.admin-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.82rem;
    color: var(--iveco-muted);
}

.admin-checkbox input { accent-color: var(--iveco-red); }

.admin-row-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.admin-row-actions input[type="password"] {
    background: var(--iveco-mid);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    padding: 6px 10px;
    color: #fff;
    font-size: 0.85rem;
}

/* ──────── FLASH / EMPTY ──────── */

.admin-flash {
    padding: 12px 18px;
    border-radius: 4px;
    margin-bottom: 16px;
    font-size: 0.9rem;
}
.admin-flash--success { background: rgba(61, 220, 132, 0.12); border: 1px solid rgba(61, 220, 132, 0.35); color: var(--ok); }
.admin-flash--error   { background: rgba(227, 85, 106, 0.12); border: 1px solid rgba(227, 85, 106, 0.35); color: var(--err); }

.admin-empty {
    padding: 40px;
    text-align: center;
    color: var(--iveco-muted);
    background: var(--iveco-dark);
    border: 1px dashed var(--iveco-border);
    border-radius: 4px;
}

.admin-pager {
    display: flex;
    gap: 6px;
    justify-content: center;
    margin: 24px 0;
}
.admin-pager a {
    padding: 6px 12px;
    background: var(--iveco-dark);
    border: 1px solid var(--iveco-border);
    border-radius: 3px;
    color: rgba(255, 255, 255, 0.7);
    font-family: 'Open Sans', sans-serif;
    text-decoration: none;
}
.admin-pager a.is-current { background: var(--iveco-red); border-color: var(--iveco-red); color: #fff; }

@media (max-width: 720px) {
    .admin-topbar { flex-wrap: wrap; gap: 12px; padding: 12px 16px; }
    .admin-topbar__nav { order: 3; width: 100%; overflow-x: auto; }
    .admin-main { padding: 16px; }
    .admin-card dl { grid-template-columns: 1fr; }
    .admin-table { font-size: 0.82rem; }
    .admin-table th, .admin-table td { padding: 8px 10px; }
}