:root {
    --bg: #08111f;
    --panel: #101b2f;
    --panel-soft: #16243a;
    --text: #f8fafc;
    --muted: #94a3b8;
    --border: rgba(148, 163, 184, .18);
    --accent: #38bdf8;
}

* { box-sizing: border-box; }
body {
    margin: 0;
    color: var(--text);
    background: var(--bg);
    font-family: Inter, Arial, sans-serif;
}
a { color: inherit; }
.catalog-compare{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.catalog-compare section{min-width:0;padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--panel-soft)}.catalog-compare pre{max-height:340px;overflow:auto;white-space:pre-wrap;color:#dbeafe}.catalog-actions{display:flex;gap:12px;margin-top:16px}.catalog-actions button{padding:11px 16px;border:0;border-radius:9px;cursor:pointer;font-weight:800}.catalog-actions button:last-child{background:var(--accent);color:#04111f}@media(max-width:850px){.catalog-compare{grid-template-columns:1fr}}
.shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 250px 1fr;
}
.sidebar {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    border-right: 1px solid var(--border);
    background: #0b1526;
}
.brand {
    display: flex;
    align-items: center;
    gap: 12px;
}
.brand span { font-size: 26px; color: var(--accent); }
.brand small { display: block; color: var(--muted); margin-top: 3px; }
.sidebar nav { display: grid; gap: 8px; }
.sidebar nav a,
.sidebar button {
    padding: 12px 14px;
    border: 0;
    border-radius: 10px;
    color: var(--text);
    background: transparent;
    text-decoration: none;
    text-align: left;
    cursor: pointer;
}
.sidebar nav a:hover,
.sidebar button:hover { background: var(--panel-soft); }
.sidebar form { margin-top: auto; }
.content { padding: 28px; }
.topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}
.topbar p { margin: 0; color: var(--accent); font-size: 12px; font-weight: 800; }
.topbar h1 { margin: 4px 0 0; }
.user-chip { display: flex; align-items: center; gap: 10px; }
.user-chip span {
    width: 38px; height: 38px; display: grid; place-items: center;
    border-radius: 50%; background: var(--accent); color: #04202e; font-weight: 900;
}
.cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}
.cards article,
.panel {
    padding: 20px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--panel);
}
.cards span { color: var(--muted); }
.cards strong { display: block; margin-top: 10px; font-size: 30px; }
.grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 18px;
}
.list { display: grid; gap: 10px; }
.list a {
    display: grid; gap: 4px; padding: 12px;
    border-radius: 10px; background: var(--panel-soft); text-decoration: none;
}
.list span { color: var(--muted); font-size: 12px; }
.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.form-grid label { display: grid; gap: 6px; color: var(--muted); }
.form-grid input,
.form-grid select,
.form-grid textarea,
.inline-form input,
.inline-form select {
    width: 100%;
    padding: 11px 12px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel-soft);
}
.form-grid button,
.inline-form button,
.login-card button {
    padding: 12px 14px;
    border: 0;
    border-radius: 9px;
    color: #04202e;
    background: var(--accent);
    font-weight: 900;
    cursor: pointer;
}
.full { grid-column: 1 / -1; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 12px; border-bottom: 1px solid var(--border); text-align: left; }
th { color: var(--muted); font-size: 12px; }
.inline-form { display: flex; gap: 8px; }
.profile-grid {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
}
.profile-grid div {
    display: grid; gap: 6px; padding: 14px;
    border-radius: 10px; background: var(--panel-soft);
}
.profile-grid span { color: var(--muted); font-size: 12px; }
.login-page {
    min-height: 100vh; display: grid; place-items: center; padding: 20px;
}
.login-card {
    width: min(420px, 100%);
    padding: 30px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--panel);
    text-align: center;
}
.login-card form { display: grid; gap: 14px; margin: 22px 0; text-align: left; }
.login-card label { display: grid; gap: 7px; }
.login-card input {
    padding: 12px; color: var(--text);
    border: 1px solid var(--border); border-radius: 9px; background: var(--panel-soft);
}
.login-logo { font-size: 38px; color: var(--accent); }
.alert {
    padding: 12px; border-radius: 10px;
    color: #fecaca; background: rgba(239,68,68,.12);
}
@media (max-width: 900px) {
    .shell { grid-template-columns: 1fr; }
    .sidebar { position: static; }
    .cards, .grid, .form-grid, .profile-grid { grid-template-columns: 1fr; }
}

.success-message { margin:14px 0; padding:12px; color:#bbf7d0;
border:1px solid rgba(34,197,94,.28); border-radius:10px;
background:rgba(34,197,94,.12); }
.form-panel { max-width:760px; }


.panel-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.eyebrow {
    margin: 0 0 6px;
    color: var(--accent);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.top-gap {
    margin-top: 18px;
}

.filter-bar {
    display: grid;
    grid-template-columns: 1fr 180px auto;
    gap: 10px;
    margin: 18px 0;
}

.filter-bar input,
.filter-bar select {
    padding: 11px 12px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel-soft);
}

.filter-bar button,
.small-link,
.notification-item button {
    padding: 10px 12px;
    color: #04202e;
    border: 0;
    border-radius: 9px;
    background: var(--accent);
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
}

.status-dot {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-weight: 900;
}

.status-dot::before {
    content: "";
    width: 9px;
    height: 9px;
    border-radius: 50%;
}

.status-dot.online::before {
    background: #22c55e;
    box-shadow: 0 0 12px rgba(34, 197, 94, .6);
}

.status-dot.offline::before {
    background: #ef4444;
    box-shadow: 0 0 12px rgba(239, 68, 68, .45);
}

.notification-list {
    display: grid;
    gap: 12px;
    margin-top: 18px;
}

.notification-item {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    border: 1px solid var(--border);
    border-left-width: 4px;
    border-radius: 12px;
    background: var(--panel-soft);
}

.notification-item.info {
    border-left-color: #38bdf8;
}

.notification-item.aviso {
    border-left-color: #f59e0b;
}

.notification-item.urgente {
    border-left-color: #ef4444;
}

.notification-item.read {
    opacity: .58;
}

.notification-item span {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 11px;
}

.notification-item p {
    margin-bottom: 0;
    color: var(--muted);
}

@media (max-width: 760px) {
    .filter-bar {
        grid-template-columns: 1fr;
    }

    .panel-heading,
    .notification-item {
        align-items: stretch;
        flex-direction: column;
    }
}


.executive-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    padding: 24px;
    border: 1px solid rgba(56, 189, 248, .2);
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(56, 189, 248, .14), transparent 36%),
        var(--panel);
}

.executive-hero h2 {
    margin: 4px 0 8px;
    font-size: 30px;
}

.executive-hero p {
    max-width: 700px;
    margin-bottom: 0;
    color: var(--muted);
}

.period-filter {
    min-width: 190px;
    display: grid;
    gap: 7px;
}

.period-filter label {
    display: grid;
    gap: 7px;
    color: var(--muted);
    font-size: 12px;
}

.period-filter select {
    padding: 11px 12px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel-soft);
}

.period-filter small {
    color: var(--muted);
}

.executive-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.executive-card {
    min-height: 138px;
    display: grid;
    align-content: space-between;
    gap: 10px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--panel);
}

.executive-card span,
.executive-card small {
    color: var(--muted);
}

.executive-card strong {
    font-size: 28px;
    overflow-wrap: anywhere;
}

.executive-card.revenue {
    border-color: rgba(34, 197, 94, .3);
    background:
        linear-gradient(145deg, rgba(34, 197, 94, .1), transparent),
        var(--panel);
}

.executive-card.online {
    border-color: rgba(56, 189, 248, .3);
    background:
        linear-gradient(145deg, rgba(56, 189, 248, .1), transparent),
        var(--panel);
}

.executive-card.warning {
    border-color: rgba(245, 158, 11, .32);
    background:
        linear-gradient(145deg, rgba(245, 158, 11, .08), transparent),
        var(--panel);
}

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

.executive-list,
.distribution-list {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.executive-list a,
.distribution-list > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 13px;
    border: 1px solid var(--border);
    border-radius: 11px;
    background: var(--panel-soft);
    text-decoration: none;
}

.executive-list a div {
    display: grid;
    gap: 4px;
}

.executive-list span {
    color: var(--muted);
    font-size: 12px;
}

.executive-list b,
.distribution-list strong {
    color: var(--accent);
}

.empty-state {
    padding: 18px;
    color: var(--muted);
    border: 1px dashed var(--border);
    border-radius: 11px;
    text-align: center;
}

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

@media (max-width: 850px) {
    .executive-hero {
        align-items: stretch;
        flex-direction: column;
    }

    .period-filter {
        min-width: 0;
    }

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


.analytics-actions {
    display: flex;
    align-items: end;
    gap: 12px;
}

.analytics-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.bar-chart {
    min-height: 300px;
    display: flex;
    align-items: end;
    gap: 10px;
    padding: 26px 10px 10px;
    overflow-x: auto;
}

.bar-column {
    min-width: 68px;
    height: 240px;
    display: grid;
    grid-template-rows: 1fr auto auto auto;
    align-items: end;
    justify-items: center;
    gap: 5px;
}

.bar-fill {
    width: 34px;
    min-height: 3px;
    border-radius: 8px 8px 3px 3px;
    background: linear-gradient(180deg, #38bdf8, #0ea5e9);
    box-shadow: 0 0 18px rgba(56, 189, 248, .24);
}

.bar-column strong {
    font-size: 11px;
}

.bar-column span,
.bar-column small {
    color: var(--muted);
    font-size: 10px;
}

.ranking-list {
    display: grid;
    gap: 9px;
    margin-top: 18px;
}

.ranking-list > div {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel-soft);
}

.ranking-list b {
    color: var(--accent);
}

.ranking-list span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ranking-list strong {
    text-align: right;
}

@media (max-width: 1100px) {
    .analytics-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .analytics-actions {
        align-items: stretch;
        flex-direction: column;
    }
}


.health-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.health-summary article {
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--panel);
}

.health-summary span {
    color: var(--muted);
}

.health-summary strong {
    display: block;
    margin-top: 8px;
    font-size: 30px;
}

.health-summary .excellent {
    border-color: rgba(34, 197, 94, .34);
}

.health-summary .good {
    border-color: rgba(56, 189, 248, .34);
}

.health-summary .attention {
    border-color: rgba(245, 158, 11, .36);
}

.health-summary .critical {
    border-color: rgba(239, 68, 68, .42);
}

.health-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.health-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 15px;
    background: var(--panel-soft);
    text-decoration: none;
}

.health-card:hover {
    border-color: var(--accent);
}

.health-score-ring {
    width: 76px;
    height: 76px;
    flex: 0 0 76px;
    display: grid;
    place-items: center;
    align-content: center;
    border: 6px solid var(--border);
    border-radius: 50%;
}

.health-score-ring strong {
    font-size: 24px;
}

.health-score-ring span {
    color: var(--muted);
    font-size: 10px;
}

.health-card.excelente .health-score-ring {
    border-color: #22c55e;
}

.health-card.bom .health-score-ring {
    border-color: #38bdf8;
}

.health-card.atencao .health-score-ring {
    border-color: #f59e0b;
}

.health-card.critico .health-score-ring {
    border-color: #ef4444;
}

.health-card-body {
    min-width: 0;
    flex: 1;
}

.health-card-body > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.health-card-body h3 {
    margin: 0;
}

.health-card-body p,
.health-card-body small {
    color: var(--muted);
}

.health-detail-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 22px;
    padding: 24px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--panel);
}

.health-score-large {
    min-width: 150px;
    display: grid;
    justify-items: center;
    gap: 5px;
    padding: 18px;
    border: 2px solid var(--border);
    border-radius: 16px;
}

.health-score-large strong {
    font-size: 44px;
}

.health-score-large.excelente {
    border-color: #22c55e;
}

.health-score-large.bom {
    border-color: #38bdf8;
}

.health-score-large.atencao {
    border-color: #f59e0b;
}

.health-score-large.critico {
    border-color: #ef4444;
}

.diagnosis-list {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.diagnosis-list div {
    padding: 12px;
    border: 1px solid rgba(245, 158, 11, .25);
    border-radius: 10px;
    background: rgba(245, 158, 11, .07);
}

.diagnosis-list.recommendations div {
    border-color: rgba(34, 197, 94, .25);
    background: rgba(34, 197, 94, .07);
}

.health-history {
    min-height: 250px;
    display: flex;
    align-items: end;
    gap: 12px;
    margin-top: 18px;
    padding: 20px;
    overflow-x: auto;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--panel-soft);
}

.health-history > div {
    min-width: 50px;
    height: 190px;
    display: grid;
    grid-template-rows: 1fr auto auto;
    align-items: end;
    justify-items: center;
    gap: 5px;
}

.history-bar {
    width: 26px;
    min-height: 3px;
    border-radius: 7px 7px 2px 2px;
    background: linear-gradient(180deg, #38bdf8, #22c55e);
}

.health-history span {
    color: var(--muted);
    font-size: 10px;
}

@media (max-width: 900px) {
    .health-summary,
    .health-grid {
        grid-template-columns: 1fr;
    }

    .health-detail-hero {
        align-items: stretch;
        flex-direction: column;
    }
}


.insight-list {
    display: grid;
    gap: 14px;
    margin-top: 18px;
}

.insight-card {
    padding: 18px;
    border: 1px solid var(--border);
    border-left-width: 5px;
    border-radius: 14px;
    background: var(--panel-soft);
}

.insight-card.urgente {
    border-left-color: #ef4444;
}

.insight-card.alta {
    border-left-color: #f59e0b;
}

.insight-card.media {
    border-left-color: #38bdf8;
}

.insight-card.baixa {
    border-left-color: #22c55e;
}

.insight-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.insight-head span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.insight-head h3 {
    margin: 5px 0 0;
}

.insight-head b {
    color: var(--accent);
}

.insight-card p,
.insight-card small {
    color: var(--muted);
}

.insight-recommendation {
    margin: 14px 0;
    padding: 12px;
    border: 1px solid rgba(56, 189, 248, .2);
    border-radius: 10px;
    background: rgba(56, 189, 248, .06);
}

.insight-actions {
    display: flex;
    gap: 8px;
    margin-top: 14px;
}

.insight-actions button {
    padding: 9px 11px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel);
    cursor: pointer;
}

@media (max-width: 700px) {
    .insight-head,
    .insight-actions {
        align-items: stretch;
        flex-direction: column;
    }
}


.package-filter {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 190px 190px auto;
    gap: 10px;
    margin: 18px 0;
}

.package-filter input,
.package-filter select {
    padding: 11px 12px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel-soft);
}

.package-filter button,
.package-actions button {
    padding: 10px 12px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel-soft);
    cursor: pointer;
}

.package-list {
    display: grid;
    gap: 14px;
}

.package-card {
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--panel-soft);
}

.package-card.archived {
    opacity: .62;
}

.package-card-main {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.package-card h3 {
    margin: 8px 0;
}

.package-card p {
    color: var(--muted);
    white-space: pre-line;
}

.package-status {
    min-width: 120px;
    display: grid;
    align-content: start;
    justify-items: end;
    gap: 7px;
}

.package-status b {
    color: #f59e0b;
}

.package-status b.published {
    color: #22c55e;
}

.package-status small {
    color: var(--muted);
}

.package-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    padding: 12px 0;
    color: var(--muted);
    font-size: 12px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.package-meta a {
    color: var(--accent);
}

.package-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.package-actions .danger-button {
    border-color: rgba(239, 68, 68, .35);
    color: #fecaca;
    background: rgba(239, 68, 68, .1);
}

.channel-badge {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
    color: #e0f2fe;
    background: rgba(56, 189, 248, .12);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .06em;
}

.channel-badge.beta {
    color: #fde68a;
    background: rgba(245, 158, 11, .13);
}

.channel-badge.lts {
    color: #bbf7d0;
    background: rgba(34, 197, 94, .13);
}

.channel-badge.desenvolvimento {
    color: #ddd6fe;
    background: rgba(139, 92, 246, .13);
}

@media (max-width: 900px) {
    .package-filter {
        grid-template-columns: 1fr;
    }

    .package-card-main {
        flex-direction: column;
    }

    .package-status {
        justify-items: start;
    }
}


.distribution-rules {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.distribution-rules div {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel-soft);
}

.distribution-rules span {
    color: var(--muted);
    font-size: 11px;
}

@media (max-width: 760px) {
    .distribution-rules {
        grid-template-columns: 1fr;
    }
}


.update-dashboard-filter {
    display: grid;
    grid-template-columns: repeat(5, minmax(130px, 1fr)) auto;
    gap: 10px;
}

.update-dashboard-filter select,
.update-dashboard-filter button {
    padding: 11px 12px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel-soft);
}

.update-dashboard-filter button {
    cursor: pointer;
    font-weight: 800;
}

.version-performance-list {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.version-performance-list a {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 14px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 11px;
    background: var(--panel-soft);
    text-decoration: none;
}

.version-performance-list a > div:first-child {
    display: grid;
    gap: 5px;
}

.version-performance-list span {
    color: var(--muted);
    font-size: 12px;
}

.performance-numbers {
    display: grid;
    justify-items: end;
    gap: 4px;
}

.performance-numbers b {
    color: var(--accent);
}

@media (max-width: 1200px) {
    .update-dashboard-filter {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 760px) {
    .update-dashboard-filter {
        grid-template-columns: 1fr;
    }

    .version-performance-list a {
        flex-direction: column;
    }

    .performance-numbers {
        justify-items: start;
    }
}


.policy-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.policy-card {
    display: grid;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--panel-soft);
}

.policy-card.inactive {
    opacity: .55;
}

.policy-card span,
.policy-card p {
    color: var(--muted);
}

.policy-card h3 {
    margin: 5px 0 8px;
}

.policy-meta {
    display: grid;
    gap: 6px;
}

.policy-card button {
    padding: 10px 12px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel);
    cursor: pointer;
}

@media (max-width: 850px) {
    .policy-grid {
        grid-template-columns: 1fr;
    }
}


.security-status {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 900;
}

.security-status.online {
    color: #bbf7d0;
    background: rgba(34, 197, 94, .13);
}

.security-status.offline {
    color: #fde68a;
    background: rgba(245, 158, 11, .13);
}

.security-status.token-expirado,
.security-status.bloqueado {
    color: #fecaca;
    background: rgba(239, 68, 68, .13);
}

.security-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.security-actions button {
    padding: 8px 9px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel-soft);
    cursor: pointer;
}


.publication-progress {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.publication-progress > div {
    display: grid;
    justify-items: center;
    gap: 7px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    color: var(--muted);
    background: var(--panel);
}

.publication-progress b {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--panel-soft);
}

.publication-progress .active,
.publication-progress .done {
    color: var(--text);
    border-color: rgba(14, 165, 233, .35);
}

.publication-progress .done b {
    color: #062333;
    background: var(--accent);
}

.publication-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.publication-actions form {
    margin: 0;
}

.publication-diagnostics {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.publication-diagnostics article {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 11px;
    background: var(--panel-soft);
}

.publication-diagnostics article > div {
    display: grid;
    gap: 6px;
}

.publication-diagnostics span {
    color: var(--muted);
}

.publication-diagnostics .ok {
    border-color: rgba(34, 197, 94, .35);
}

.publication-diagnostics .ok > b {
    color: #86efac;
}

.publication-diagnostics .atenção {
    border-color: rgba(245, 158, 11, .35);
}

.publication-diagnostics .atenção > b {
    color: #fde68a;
}

.publication-diagnostics .erro {
    border-color: rgba(239, 68, 68, .35);
}

.publication-diagnostics .erro > b {
    color: #fecaca;
}

.danger-button {
    padding: 10px 13px;
    color: #fecaca;
    border: 1px solid rgba(239, 68, 68, .35);
    border-radius: 9px;
    background: rgba(239, 68, 68, .1);
    cursor: pointer;
}

@media (max-width: 760px) {
    .publication-progress {
        grid-template-columns: repeat(2, 1fr);
    }

    .publication-diagnostics article {
        flex-direction: column;
    }
}


.master-nav {
    display: grid;
    gap: 6px;
}

.master-nav-direct,
.master-menu-trigger,
.master-submenu a {
    width: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    color: var(--muted);
    border: 0;
    border-radius: 9px;
    background: transparent;
    text-decoration: none;
    text-align: left;
    cursor: pointer;
}

.master-nav-direct:hover,
.master-nav-direct.active,
.master-menu-trigger:hover,
.master-menu-trigger[aria-expanded="true"],
.master-submenu a:hover,
.master-submenu a.active {
    color: var(--text);
    background: var(--panel-soft);
}

.master-menu-group + .master-menu-group {
    margin-top: 4px;
}

.master-menu-trigger {
    font-weight: 900;
}

.master-submenu {
    display: grid;
    gap: 3px;
    padding: 4px 0 7px 12px;
}

.master-submenu[hidden] {
    display: none;
}

.master-submenu a {
    font-size: 13px;
}

.commercial-kanban {
    display: grid;
    grid-template-columns: repeat(8, minmax(240px, 1fr));
    gap: 14px;
    overflow-x: auto;
    padding-bottom: 8px;
}

.commercial-column {
    min-height: 340px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--panel-soft);
}

.commercial-column > header {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.commercial-column > header span {
    color: var(--muted);
}

.commercial-card {
    display: grid;
    gap: 7px;
    margin-bottom: 10px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel);
}

.commercial-card h3,
.commercial-card p {
    margin: 0;
}

.commercial-card p,
.commercial-card small {
    color: var(--muted);
}

.commercial-card select {
    width: 100%;
    padding: 8px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel-soft);
}

/* Sprint 14.3.12 - Central de Serviços */
.services-page { background: #f4f6f9; min-height: 100vh; }
.page-header { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:22px; }
.page-header h1 { margin:4px 0 6px; }
.page-header p { margin:0; color:#657084; }
.eyebrow { color:#3372d6; font-size:.75rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.services-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:18px; }
.service-summary-card,.service-detail-card,.windows-services-panel { background:#fff; border:1px solid #dce2ea; border-radius:10px; box-shadow:0 2px 8px rgba(25,42,70,.06); }
.service-summary-card { padding:18px 20px; display:flex; flex-direction:column; gap:5px; }
.service-summary-label { color:#677489; font-size:.82rem; }
.service-summary-card strong { font-size:1.45rem; color:#172235; }
.service-summary-card .summary-action { font-size:.96rem; line-height:1.35; }
.service-summary-card small { color:#8b95a6; }
.windows-services-panel { overflow:hidden; margin-bottom:18px; }
.windows-services-header,.windows-service-row { display:grid; grid-template-columns:2.1fr .9fr 1.1fr .55fr 1.8fr; align-items:center; gap:15px; }
.windows-services-header { padding:11px 18px; background:#edf1f6; color:#4c596e; font-size:.78rem; font-weight:800; text-transform:uppercase; border-bottom:1px solid #dce2ea; }
.windows-service-row { padding:17px 18px; min-height:78px; }
.service-name-cell { display:flex; align-items:center; gap:13px; }
.service-name-cell small { display:block; margin-top:4px; color:#778297; }
.service-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:8px; background:#2467c9; color:#fff; font-weight:900; box-shadow:inset 0 0 0 1px rgba(255,255,255,.25); }
.service-status-cell { display:flex; align-items:center; gap:8px; }
.status-led { width:12px; height:12px; border-radius:50%; display:inline-block; box-shadow:0 0 0 4px rgba(0,0,0,.04); }
.status-led.green { background:#20a95b; box-shadow:0 0 0 4px rgba(32,169,91,.13),0 0 10px rgba(32,169,91,.55); animation:servicePulse 1.8s infinite; }
.status-led.red { background:#df3f45; box-shadow:0 0 0 4px rgba(223,63,69,.12); }
.status-led.yellow { background:#e4a11b; }
@keyframes servicePulse { 50% { box-shadow:0 0 0 7px rgba(32,169,91,.04),0 0 14px rgba(32,169,91,.65); } }
.startup-badge { display:inline-block; background:#eef4ff; color:#2b65b9; border:1px solid #d5e3fb; border-radius:999px; padding:5px 9px; font-size:.75rem; font-weight:700; }
.service-actions { display:flex; gap:7px; flex-wrap:wrap; }
.service-btn { border:1px solid #cbd3df; background:#fff; color:#233149; padding:8px 10px; border-radius:6px; cursor:pointer; font-weight:700; }
.service-btn.start { border-color:#90d1ac; color:#147d43; }
.service-btn.stop { border-color:#efb1b4; color:#b52c32; }
.service-btn.restart { border-color:#abc8ef; color:#245fae; }
.service-btn:disabled { opacity:.4; cursor:not-allowed; }
.service-detail-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:18px; }
.service-detail-card { padding:20px; }
.service-detail-card h2 { margin:0 0 15px; font-size:1.05rem; }
.service-details-list { margin:0; }
.service-details-list div { display:grid; grid-template-columns:160px 1fr; gap:12px; padding:10px 0; border-bottom:1px solid #edf0f4; }
.service-details-list dt { color:#6c788c; }
.service-details-list dd { margin:0; font-weight:700; color:#26334a; }
.path-value { word-break:break-all; font-family:Consolas,monospace; font-size:.82rem; }
.path-warning,.service-message { padding:12px 14px; border-radius:7px; margin:14px 0; }
.path-warning { background:#fff6dc; color:#765510; border:1px solid #edd18a; }
.service-message.success { background:#e9f8ef; color:#176c3b; border:1px solid #a8dbbc; }
.service-message.error { background:#fff0f1; color:#a52930; border:1px solid #edb6b9; }
.service-events { max-height:270px; overflow:auto; }
.service-events > div { padding:9px 0; border-bottom:1px solid #edf0f4; font-size:.88rem; color:#435067; }
.muted { color:#8a94a4!important; }
@media (max-width:1050px) { .windows-services-header { display:none; } .windows-service-row { grid-template-columns:1fr 1fr; } .service-actions { grid-column:1/-1; } .services-summary-grid,.service-detail-grid { grid-template-columns:1fr; } }
@media (max-width:640px) { .page-header { align-items:flex-start; flex-direction:column; } .windows-service-row { grid-template-columns:1fr; } .service-details-list div { grid-template-columns:1fr; gap:4px; } }
/* Sprint 14.3.12 R3 - cadastro central de clientes */
.eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.13em;color:#f59e0b;margin-bottom:.35rem}.muted{opacity:.72}.form-grid small{display:block;opacity:.68;margin-top:.3rem}.check-line{display:flex!important;align-items:center;gap:.55rem}.check-line input{width:auto!important}.status-pill{display:inline-flex;padding:.25rem .65rem;border-radius:999px;font-weight:800;font-size:.78rem}.status-pill.ok{background:rgba(34,197,94,.15);color:#22c55e}.status-pill.danger{background:rgba(239,68,68,.14);color:#ef4444}.notice.success{margin:1rem 0;padding:1rem;border:1px solid rgba(34,197,94,.5);background:rgba(34,197,94,.1);border-radius:12px}.credential-box{margin-top:1.2rem;padding:1.1rem;border:1px solid rgba(245,158,11,.42);background:rgba(245,158,11,.07);border-radius:14px}.credential-box code{word-break:break-all}.action-row{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1rem}.danger-button{background:#991b1b!important}.button-link{display:inline-flex;align-items:center;text-decoration:none;padding:.7rem 1rem;border-radius:10px;background:#1e3a5f;color:#fff;font-weight:700}

/* Sprint 14.4.0 - SGCI Cloud */
.cloud-hero{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px;border-radius:16px;background:linear-gradient(135deg,#12243d,#1f4f83);color:#fff}.cloud-hero h2{margin:.25rem 0}.cloud-hero p{margin:.3rem 0;opacity:.85}.cloud-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:18px}.cloud-kpis article{padding:18px;border:1px solid var(--border);border-radius:13px;background:var(--panel);display:flex;flex-direction:column;gap:5px}.cloud-kpis strong{font-size:1.8rem}.cloud-kpis .ok strong{color:#22c55e}.cloud-kpis .warn strong{color:#e4a11b}.cloud-kpis .danger strong{color:#ef4444}.cloud-status{display:inline-flex;align-items:center;gap:8px;font-weight:800}.status-led.gray{background:#8b95a6}.cloud-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}@media(max-width:900px){.cloud-kpis{grid-template-columns:repeat(2,1fr)}.cloud-detail-grid{grid-template-columns:1fr}}

/* Sprint 14.4.2 — SGCI Cloud Operations Center */
.ops-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px;border-radius:20px;background:linear-gradient(135deg,#10243f 0%,#23578e 100%);color:#fff;box-shadow:0 18px 40px rgba(4,18,38,.22)}
.ops-hero h2{font-size:2rem;margin:.25rem 0}.ops-hero p{margin:.35rem 0;opacity:.86}.ops-server-quick{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.ops-server-quick>div{display:flex;align-items:center;gap:9px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.button-link.secondary{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25)}
.ops-kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:18px}.ops-kpi-grid article{padding:18px;border:1px solid var(--border);border-radius:15px;background:var(--panel);display:flex;flex-direction:column;gap:5px;min-height:112px}.ops-kpi-grid strong{font-size:1.85rem}.ops-kpi-grid small{opacity:.68}.ops-kpi-grid .ok strong{color:#22c55e}.ops-kpi-grid .warn strong{color:#f0a500}.ops-kpi-grid .danger strong{color:#ef4444}.ops-kpi-grid .blocked strong{color:#9aa3b2}.ops-kpi-grid .info strong{color:#38bdf8}
.ops-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:18px}.server-health-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.server-health-grid>div{padding:14px;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.025);display:flex;flex-direction:column;gap:6px}.server-health-grid span{font-size:.82rem;opacity:.7}.server-health-grid strong{font-size:1.1rem}.ops-map-placeholder{min-height:250px}.map-ghost{height:180px;border:1px dashed rgba(56,189,248,.35);border-radius:16px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;font-size:1.3rem;font-weight:900;letter-spacing:.12em;color:#38bdf8;background:radial-gradient(circle at center,rgba(56,189,248,.09),transparent 65%)}.map-ghost small{font-size:.78rem;letter-spacing:normal;font-weight:500;opacity:.7}
.ops-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;font-size:.76rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.ops-badge.stable{background:rgba(34,197,94,.13);color:#4ade80;border:1px solid rgba(34,197,94,.25)}.ops-badge.beta{background:rgba(168,85,247,.14);color:#c084fc;border:1px solid rgba(168,85,247,.28)}.soon-pill{display:inline-flex;padding:5px 10px;border-radius:999px;background:rgba(56,189,248,.12);color:#38bdf8;border:1px solid rgba(56,189,248,.25);font-size:.72rem;font-weight:800}.hero-soon{font-size:.9rem;padding:8px 14px}.menu-soon{float:right;font-size:.6rem;padding:2px 5px;border-radius:999px;background:rgba(56,189,248,.12);color:#38bdf8}
.status-led.blue{background:#38bdf8;box-shadow:0 0 0 4px rgba(56,189,248,.13),0 0 10px rgba(56,189,248,.55);animation:servicePulse 1.8s infinite}.ops-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:.72rem}.ops-legend span{display:flex;align-items:center;gap:6px}.ops-legend .status-led{width:8px;height:8px}.version-warning{display:inline-block;color:#fbbf24;font-size:.68rem;margin-top:4px}.ops-table td{vertical-align:middle}.ops-table small{opacity:.68}
.ops-timeline{display:flex;flex-direction:column;margin-top:14px}.ops-timeline>div{display:grid;grid-template-columns:110px 16px 1fr;gap:10px;align-items:start;padding:8px 0}.ops-timeline time{font-size:.78rem;opacity:.65}.timeline-dot{width:9px;height:9px;border-radius:50%;background:#38bdf8;margin-top:5px;box-shadow:0 0 0 4px rgba(56,189,248,.1)}.ops-timeline p{margin:0}.ops-timeline small{opacity:.66}.muted{opacity:.65}
.ops-alert{margin-top:16px;padding:14px 16px;border:1px solid rgba(245,158,11,.35);border-radius:12px;background:rgba(245,158,11,.1);color:#fbbf24}.health-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.health-strip article{display:flex;align-items:center;gap:10px;padding:13px;border:1px solid var(--border);border-radius:12px;background:var(--panel)}.health-strip article div{display:flex;flex-direction:column}.health-strip small{font-size:.68rem;opacity:.65;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.health-strip .unhealthy{border-color:rgba(239,68,68,.3)}
.remote-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.remote-actions button,.remote-actions a{padding:13px;border-radius:11px;border:1px solid var(--border);background:rgba(255,255,255,.035);color:inherit;text-decoration:none;text-align:center;font-weight:800}.remote-actions button:disabled{opacity:.45;cursor:not-allowed}.remote-actions a:hover{border-color:#38bdf8}.coming-panel{min-height:360px;display:flex;align-items:center;justify-content:center}.coming-panel .map-ghost{width:100%;height:260px}
@media(max-width:1200px){.ops-kpi-grid{grid-template-columns:repeat(3,1fr)}.health-strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.ops-hero{align-items:flex-start;flex-direction:column}.ops-server-quick{align-items:flex-start}.ops-kpi-grid{grid-template-columns:repeat(2,1fr)}.ops-grid{grid-template-columns:1fr}.server-health-grid{grid-template-columns:repeat(2,1fr)}.remote-actions{grid-template-columns:1fr 1fr}.health-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.ops-kpi-grid,.server-health-grid,.remote-actions,.health-strip{grid-template-columns:1fr}.ops-legend{display:none}}

/* Sprint 14.4.3 Fase 2 - Diagnóstico Remoto */
.diagnostics-kpis{grid-template-columns:repeat(5,minmax(0,1fr))}
.diagnostics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.diagnostic-client-card{padding:18px;border:1px solid var(--border);border-radius:16px;background:var(--panel);box-shadow:0 12px 28px rgba(0,0,0,.08)}
.diagnostic-card-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.diagnostic-card-head h3{margin:.45rem 0 .2rem}.diagnostic-card-head small{opacity:.68}
.health-score-mini{min-width:76px;height:76px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;border:7px solid rgba(56,189,248,.2);background:rgba(56,189,248,.06)}.health-score-mini strong{font-size:1.4rem}.health-score-mini span{font-size:.66rem;opacity:.68}.health-score-mini.excelente{border-color:#22c55e}.health-score-mini.atencao{border-color:#f59e0b}.health-score-mini.requer-acao{border-color:#fb923c}.health-score-mini.critico{border-color:#ef4444}
.diagnostic-metrics-row{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:16px 0}.diagnostic-metrics-row>div{padding:10px;border:1px solid var(--border);border-radius:10px;display:flex;flex-direction:column;gap:4px}.diagnostic-metrics-row span{font-size:.7rem;opacity:.65}.diagnostic-metrics-row strong{font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.diagnostic-card-foot{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:.76rem}.diagnostic-card-foot>span{opacity:.65}
.diagnostic-overview{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}.health-score-panel{display:flex;align-items:center;gap:22px;padding:22px;border-radius:18px;border:1px solid var(--border);background:linear-gradient(135deg,rgba(56,189,248,.08),var(--panel))}.health-score-circle{width:116px;height:116px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;border:12px solid #38bdf8}.health-score-circle strong{font-size:2.2rem}.health-score-circle span{font-size:.72rem;opacity:.7}.health-score-panel.excelente .health-score-circle{border-color:#22c55e}.health-score-panel.atencao .health-score-circle{border-color:#f59e0b}.health-score-panel.requer-acao .health-score-circle{border-color:#fb923c}.health-score-panel.critico .health-score-circle{border-color:#ef4444}.health-score-panel h3{margin:.25rem 0}.health-score-panel p{margin:.2rem 0;opacity:.72}.health-reasons-panel ul{margin:12px 0 0;padding-left:18px}.health-reasons-panel li{margin:8px 0}
.diagnostic-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.metric-panel{grid-row:span 2}.metric-bars{display:flex;flex-direction:column;gap:20px}.metric-bars header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.metric-bars progress{width:100%;height:12px;accent-color:#38bdf8}.metric-bars small{display:block;margin-top:6px;opacity:.65}
.table-health{display:inline-flex;align-items:baseline;gap:2px}.table-health strong{font-size:1.15rem}.table-health span{font-size:.68rem;opacity:.65}
@media(max-width:1100px){.diagnostics-grid,.diagnostic-overview,.diagnostic-panels{grid-template-columns:1fr}.diagnostic-metrics-row{grid-template-columns:repeat(3,1fr)}.metric-panel{grid-row:auto}}
@media(max-width:700px){.diagnostics-kpis{grid-template-columns:repeat(2,1fr)}.diagnostic-card-head{flex-direction:column}.diagnostic-metrics-row{grid-template-columns:repeat(2,1fr)}.diagnostic-card-foot{align-items:flex-start;flex-direction:column}.health-score-panel{align-items:flex-start;flex-direction:column}}

.remote-actions form{display:inline-flex;margin:0}.remote-actions button{cursor:pointer}.command-status{display:inline-block;padding:5px 10px;border-radius:999px;font-weight:800;font-size:.75rem}.command-aguardando{background:#3a2d08;color:#ffd75d}.command-enviado,.command-executando{background:#0b3653;color:#65c7ff}.command-concluido{background:#073d2b;color:#58e0a2}.command-falhou{background:#4a1720;color:#ff7a8a}

/* SGCI 14.6.1 REVISAO 2 - acoes rapidas da instalacao */
.installation-quick-actions{display:flex;flex-wrap:wrap;gap:6px;min-width:280px}.installation-quick-actions form{margin:0}.installation-quick-actions .small-link,.quick-action-btn{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:7px 10px;border-radius:9px;border:1px solid var(--border);background:rgba(255,255,255,.035);color:inherit;text-decoration:none;font:inherit;font-size:.78rem;font-weight:800;cursor:pointer}.installation-quick-actions .small-link:hover,.quick-action-btn:hover{border-color:#38bdf8}.remote-access-btn{border-color:rgba(56,189,248,.45);background:rgba(56,189,248,.10)}


/* Sprint 14.7.4 REV.1 — Central de Cobranças */
.billing-kpis {
    grid-template-columns: repeat(5, minmax(175px, 1fr));
    align-items: stretch;
}
.billing-kpis .executive-card {
    min-width: 0;
}
.billing-kpis .executive-card strong {
    line-height: 1.08;
    white-space: normal;
}
.billing-kpis .billing-suspended {
    border-color: rgba(239, 68, 68, .32);
    background:
        linear-gradient(145deg, rgba(239, 68, 68, .08), transparent),
        var(--panel);
}
.billing-filter-grid {
    display: grid;
    grid-template-columns: minmax(260px, 2fr) minmax(220px, 1fr);
    gap: 14px;
    align-items: end;
}
.billing-filter-grid label {
    display: grid;
    gap: 6px;
    color: var(--muted);
}
.billing-filter-grid input,
.billing-filter-grid select {
    width: 100%;
    padding: 11px 12px;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel-soft);
}
.billing-filter-actions {
    grid-column: 1 / -1;
    display: flex;
    gap: 10px;
    align-items: center;
}
.billing-filter-actions button,
.billing-filter-actions .button {
    min-width: 140px;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.billing-filter-actions button {
    padding: 12px 18px;
    border: 0;
    border-radius: 9px;
    color: #04202e;
    background: var(--accent);
    font-weight: 900;
    cursor: pointer;
}
.billing-filter-actions .secondary {
    padding: 11px 18px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--panel-soft);
    color: var(--text);
    text-decoration: none;
}
@media (max-width: 1450px) {
    .billing-kpis {
        grid-template-columns: repeat(3, minmax(190px, 1fr));
    }
}
@media (max-width: 900px) {
    .billing-kpis,
    .billing-filter-grid {
        grid-template-columns: 1fr;
    }
    .billing-filter-actions {
        grid-column: 1;
        flex-wrap: wrap;
    }
}