/* ── Painel de Sistemas (compartilhado home + /systems/painel) ──────────────────── */
.mgr-topbar {
    display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 16px;
}
.mgr-search {
    flex: 1; min-width: 200px; display: flex; gap: 6px;
}
.mgr-search input {
    flex: 1; padding: 8px 12px; border: 1px solid var(--border); border-radius: 6px;
    font-size: 13px; background: var(--bg-card);
}
.mgr-search button { padding: 8px 14px; }

/* Toolbar unificada: chips à esquerda, segmentos de visão à direita */
.mgr-toolbar {
    display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
    margin-bottom: 14px;
}
.mgr-toolbar .mgr-chips { margin-bottom: 0; flex: 1; min-width: 0; }
.mgr-views {
    display: inline-flex; gap: 6px; align-items: center; margin-left: auto;
}

/* Chips de filtro */
.mgr-chips {
    display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
    margin-bottom: 14px;
}
.mgr-chip {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 11px; border-radius: 999px; border: 1px solid var(--border, #e0e0e0);
    background: var(--bg-card, #fff); color: var(--text, #333);
    font-size: 12px; font-weight: 500; cursor: pointer;
    transition: all .15s;
}
.mgr-chip:hover:not(:disabled) { border-color: var(--wine, #8b2e5a); transform: translateY(-1px); }
.mgr-chip:disabled { opacity: .4; cursor: not-allowed; }
.mgr-chip .material-icons-outlined { font-size: 15px; }
.mgr-chip b { font-weight: 700; margin-left: 2px; }
.mgr-chip.active { color: #fff; border-color: transparent; box-shadow: 0 2px 6px rgba(0,0,0,0.15); }
.mgr-chip-erro.active    { background: #c62828; }
.mgr-chip-manut.active   { background: #ad1457; }
.mgr-chip-alta.active    { background: #d84315; }
.mgr-chip-semdono.active { background: #616161; }
.mgr-chip-radar.active   { background: #1a1a2e; }
.mgr-chip-clear { background: transparent; color: var(--text-muted); border-style: dashed; }

/* Segmentos compactos de visão/altura (dentro de .mgr-views) */
.mgr-segment {
    display: inline-flex; align-items: center; gap: 2px;
    background: var(--bg-subtle, #f5f0f5);
    border: 1px solid var(--border, #e0e0e0);
    border-radius: 6px; padding: 2px;
}
.mgr-segment-height::before {
    content: 'Altura';
    font-size: 10px; color: var(--text-muted); text-transform: uppercase;
    letter-spacing: .4px; font-weight: 600; padding: 0 6px 0 4px;
}
.mgr-seg-btn {
    background: transparent; border: none; cursor: pointer;
    padding: 4px 8px; border-radius: 4px;
    font-size: 12px; font-weight: 500; color: var(--text, #333);
    display: inline-flex; align-items: center; gap: 4px;
    transition: all .15s; line-height: 1;
}
.mgr-seg-btn:hover { background: rgba(0,0,0,0.05); }
.mgr-seg-btn.active {
    background: var(--wine, #8b2e5a); color: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.mgr-seg-btn .material-icons-outlined { font-size: 15px; }

/* Modo Compacto: cards menores, esconde owner/links/meta extra */
.mgr-heatmap.view-compact .mgr-card { padding: 5px 8px; }
.mgr-heatmap.view-compact .mgr-card-name { font-size: 12px; padding-right: 30px; }
.mgr-heatmap.view-compact .mgr-card-owner-hero {
    margin-top: 3px; padding: 3px 6px; border-left-width: 3px;
}
.mgr-heatmap.view-compact .mgr-card-owner-hero .material-icons-outlined { font-size: 14px; }
.mgr-heatmap.view-compact .mgr-card-owner-name { font-size: 12px; }
.mgr-heatmap.view-compact .mgr-card-meta { margin-top: 2px; font-size: 9px; gap: 4px; }
.mgr-heatmap.view-compact .mgr-card-link { display: none; }
.mgr-heatmap.view-compact .mgr-card-actions { display: none; }
.mgr-heatmap.view-compact .mgr-card:hover .mgr-card-actions { display: flex; opacity: 1; }

/* Modo Lista: colunas viram uma única coluna full-width em linhas compactas */
.mgr-heatmap.view-list { grid-template-columns: 1fr !important; gap: 8px; }
.mgr-heatmap.view-list .mgr-column { min-height: auto; }
.mgr-heatmap.view-list .mgr-col-body {
    display: flex; flex-direction: column; gap: 2px;
    padding: 4px; max-height: none;
}
.mgr-heatmap.view-list .mgr-card {
    display: grid;
    grid-template-columns: minmax(200px, 1.5fr) minmax(150px, 1fr) minmax(90px, auto) minmax(90px, auto) auto;
    gap: 10px; align-items: center;
    padding: 6px 10px; margin: 0;
}
.mgr-heatmap.view-list .mgr-card-name {
    padding-right: 0; font-size: 13px;
}
.mgr-heatmap.view-list .mgr-card-owner-hero {
    margin-top: 0; padding: 3px 8px; background: transparent;
    border-left: none; border-radius: 0;
}
.mgr-heatmap.view-list .mgr-card-owner-name { font-size: 13px; }
.mgr-heatmap.view-list .mgr-card-meta { margin-top: 0; gap: 4px; }
.mgr-heatmap.view-list .mgr-card-link { margin-top: 0; }
.mgr-heatmap.view-list .mgr-card-actions {
    position: static; opacity: 1; justify-content: flex-end;
}

.mgr-radar {
    background: linear-gradient(135deg, #1a1a2e, #16213e);
    border-radius: 10px; padding: 18px; margin-bottom: 20px; color: #e0e0e0;
}
.mgr-radar-title {
    font-size: 13px; font-weight: 600; margin-bottom: 10px;
    display: flex; align-items: center; gap: 8px; color: #a8d8ea;
}
.mgr-radar-title .material-icons-outlined { font-size: 18px; }
.mgr-radar-list { display: flex; gap: 8px; flex-wrap: wrap; }
.mgr-radar-card {
    background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.12);
    border-radius: 8px; padding: 10px 14px; min-width: 160px; flex: 1; max-width: 260px;
}
.mgr-radar-card:hover { background: rgba(255,255,255,0.14); }
.mgr-radar-name { font-weight: 600; font-size: 12px; color: #fff; margin-bottom: 3px; }
.mgr-radar-name a { color: #fff; text-decoration: none; }
.mgr-radar-note { font-size: 11px; color: #8899aa; }
.mgr-radar-badges { margin-top: 5px; display: flex; gap: 4px; flex-wrap: wrap; }
.mgr-radar-empty { font-size: 12px; color: #667; font-style: italic; }

.mgr-heatmap {
    display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 20px;
}
@media (max-width: 1200px) { .mgr-heatmap { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 800px) { .mgr-heatmap { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px) { .mgr-heatmap { grid-template-columns: 1fr; } }

.mgr-column {
    background: var(--bg-card, #fff); border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06); overflow: hidden; min-height: 180px;
}
.mgr-col-header {
    padding: 10px 14px; font-weight: 600; font-size: 12px;
    display: flex; align-items: center; justify-content: space-between;
    border-bottom: 3px solid;
}
.mgr-col-header .material-icons-outlined { font-size: 16px; vertical-align: middle; margin-right: 4px; }
.mgr-col-header .mgr-col-count {
    background: rgba(0,0,0,0.1); border-radius: 12px; padding: 2px 8px;
    font-size: 11px; font-weight: 700;
}
.mgr-col-constante .mgr-col-header { background: #e8f5e9; color: #2e7d32; border-color: #4caf50; }
.mgr-col-moderado .mgr-col-header { background: #fff3e0; color: #e65100; border-color: #ff9800; }
.mgr-col-raro .mgr-col-header { background: #ffebee; color: #c62828; border-color: #f44336; }
.mgr-col-sem .mgr-col-header { background: #f5f5f5; color: #616161; border-color: #9e9e9e; }
.mgr-col-afazer .mgr-col-header { background: #e3f2fd; color: #1565c0; border-color: #2196f3; }

.mgr-col-body {
    padding: 6px; min-height: 120px;
    transition: background .2s, max-height .2s;
    scrollbar-width: thin; scrollbar-color: rgba(0,0,0,0.1) transparent;
}
/* Alturas selecionáveis (aplicadas no .mgr-heatmap) */
.mgr-heatmap.h-sm   .mgr-col-body { max-height: 600px; overflow-y: auto; }
.mgr-heatmap.h-md   .mgr-col-body { max-height: 900px; overflow-y: auto; }
.mgr-heatmap.h-lg   .mgr-col-body { max-height: calc(100vh - 200px); overflow-y: auto; }
.mgr-heatmap.h-full .mgr-col-body { max-height: none; overflow-y: visible; }
.mgr-col-body.drag-over { background: rgba(0,0,0,0.04); }

.mgr-card {
    background: #fff; border: 1px solid var(--border, #e0e0e0);
    border-left: 4px solid #9e9e9e;
    border-radius: 7px; padding: 8px 10px; margin-bottom: 5px;
    transition: box-shadow .2s, transform .15s, opacity .2s;
    user-select: none; position: relative;
}
.mgr-card-status-producao     { border-left-color: #2e7d32; }
.mgr-card-status-homologacao  { border-left-color: #1565c0; }
.mgr-card-status-desenvolvimento { border-left-color: #e65100; }
.mgr-card-status-desativado   { border-left-color: #9e9e9e; opacity: .75; }
.mgr-card-status-erro         { border-left-color: #c62828; background: linear-gradient(90deg, rgba(198,40,40,0.08), #fff 40%); }
.mgr-card-status-manutencao   { border-left-color: #ad1457; background: linear-gradient(90deg, rgba(173,20,87,0.06), #fff 40%); }
.mgr-card.mgr-hidden { display: none !important; }
.mgr-card.mgr-dimmed { opacity: .28; filter: grayscale(.6); }
.mgr-card.draggable { cursor: grab; }
.mgr-card.draggable:active { cursor: grabbing; }
.mgr-card.dragging { opacity: 0.4; transform: scale(0.96); }
.mgr-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.1); }

.mgr-card-name {
    font-weight: 600; font-size: 12px; color: var(--text);
    display: flex; align-items: center; gap: 5px;
    padding-right: 60px;
}
.mgr-card-name a { color: inherit; text-decoration: none; }
.mgr-card-name a:hover { color: var(--wine); }

.mgr-card-meta {
    margin-top: 3px; font-size: 10px; color: var(--text-muted);
    display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
}
.mgr-card-link {
    margin-top: 3px; font-size: 11px;
    display: flex; align-items: center; gap: 4px;
}
.mgr-card-link a { color: var(--wine); text-decoration: none; }
.mgr-card-link a:hover { text-decoration: underline; }
.mgr-card-owners {
    margin-top: 4px; display: flex; gap: 3px; flex-wrap: wrap;
}
.mgr-owner-chip {
    font-size: 10px; padding: 1px 6px; border-radius: 10px;
    background: var(--bg-subtle, #f5f0f5); color: var(--wine);
    border: 1px solid rgba(139,46,90,0.15);
}

/* Dono em destaque no card */
.mgr-card-owner-hero {
    margin-top: 6px; display: flex; align-items: center; gap: 6px;
    padding: 6px 8px; border-radius: 6px;
    background: linear-gradient(135deg, rgba(139,46,90,0.08), rgba(139,46,90,0.02));
    border-left: 3px solid var(--wine, #8b2e5a);
}
.mgr-card-owner-hero .material-icons-outlined {
    font-size: 18px; color: var(--wine, #8b2e5a);
}
.mgr-card-owner-name {
    font-size: 15px; font-weight: 700; color: var(--wine, #8b2e5a);
    letter-spacing: 0.2px;
}
.mgr-card-owner-backup {
    font-size: 12px; font-weight: 500; color: var(--text-muted);
}
.mgr-card-owner-empty {
    background: rgba(158,158,158,0.08);
    border-left-color: #9e9e9e;
}
.mgr-card-owner-empty .material-icons-outlined,
.mgr-card-owner-empty .mgr-card-owner-name {
    color: #757575; font-style: italic; font-weight: 600;
}

/* Criticidade em destaque (alta/media) */
.mgr-badge-crit {
    font-size: 10px; padding: 2px 8px; border-radius: 4px;
    font-weight: 800; letter-spacing: 0.6px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}
.mgr-badge-crit.mgr-badge-alta {
    background: #c62828; color: #fff;
    animation: mgr-crit-pulse 2.4s ease-in-out infinite;
}
.mgr-badge-crit.mgr-badge-media {
    background: #f57f17; color: #fff;
}
@keyframes mgr-crit-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(198,40,40,0.35); }
    50% { box-shadow: 0 0 0 4px rgba(198,40,40,0); }
}
.mgr-card-actions {
    position: absolute; top: 5px; right: 5px;
    display: flex; gap: 1px; opacity: 0; transition: opacity .2s;
}
.mgr-card:hover .mgr-card-actions { opacity: 1; }
.mgr-card-btn {
    background: none; border: none; cursor: pointer; padding: 2px;
    color: var(--text-muted); border-radius: 4px;
}
.mgr-card-btn:hover { background: rgba(0,0,0,0.06); color: var(--wine); }
.mgr-card-btn .material-icons-outlined { font-size: 15px; }
.mgr-card-btn.btn-delete:hover { color: #c62828; }

.mgr-badge {
    display: inline-block; padding: 1px 5px; border-radius: 4px;
    font-size: 9px; font-weight: 600; text-transform: uppercase;
}
.mgr-badge-producao { background: #e8f5e9; color: #2e7d32; }
.mgr-badge-homologacao { background: #e3f2fd; color: #1565c0; }
.mgr-badge-desenvolvimento { background: #fff3e0; color: #e65100; }
.mgr-badge-desativado { background: #f5f5f5; color: #757575; }
.mgr-badge-erro { background: #ffebee; color: #c62828; }
.mgr-badge-manutencao { background: #fce4ec; color: #ad1457; }
.mgr-badge-alta { background: #ffebee; color: #c62828; }
.mgr-badge-media { background: #fff8e1; color: #f57f17; }
.mgr-badge-baixa { background: #e8f5e9; color: #2e7d32; }
.mgr-badge-radar { background: #1a1a2e; color: #a8d8ea; font-size: 8px; padding: 1px 5px; border-radius: 3px; }

.mgr-confirm-overlay {
    position: fixed; top:0; left:0; right:0; bottom:0;
    background: rgba(0,0,0,0.4); z-index: 200; display: none;
    align-items: center; justify-content: center;
}
.mgr-confirm-overlay.visible { display: flex; }
.mgr-confirm-box {
    background: #fff; border-radius: 10px; padding: 24px; max-width: 400px; width: 90%;
    box-shadow: 0 8px 32px rgba(0,0,0,0.2); text-align: center;
}
.mgr-confirm-box h3 { margin: 0 0 8px; font-size: 16px; }
.mgr-confirm-box p { font-size: 13px; color: var(--text-light); margin-bottom: 16px; }
.mgr-confirm-btns { display: flex; gap: 8px; justify-content: center; }

.mgr-toast {
    position: fixed; bottom: 24px; right: 24px; padding: 10px 20px;
    background: #333; color: #fff; border-radius: 8px; font-size: 13px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3); z-index: 9999;
    opacity: 0; transform: translateY(10px); transition: all .3s;
}
.mgr-toast.visible { opacity: 1; transform: translateY(0); }

.mgr-col-empty {
    padding: 20px 12px; text-align: center; font-size: 11px; color: var(--text-muted);
    font-style: italic;
}

/* ── Dark theme overrides (cfo-connect-theme) ── */
body.cfo-connect-theme .mgr-card {
    background: hsl(220, 15%, 12%);
    border-color: hsl(220, 10%, 18%);
    color: hsl(0, 0%, 96%);
}
body.cfo-connect-theme .mgr-card:hover {
    box-shadow: 0 2px 12px hsla(345, 70%, 35%, 0.15);
}
body.cfo-connect-theme .mgr-card-name a:hover { color: hsl(345, 70%, 45%); }
body.cfo-connect-theme .mgr-card-btn:hover { background: hsla(0,0%,100%,0.08); }

body.cfo-connect-theme .mgr-column {
    background: hsl(220, 15%, 10%);
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}
body.cfo-connect-theme .mgr-col-constante .mgr-col-header { background: hsla(142,71%,45%,0.12); color: #4ade80; border-color: #4ade80; }
body.cfo-connect-theme .mgr-col-moderado .mgr-col-header { background: hsla(38,92%,50%,0.12); color: #fbbf24; border-color: #fbbf24; }
body.cfo-connect-theme .mgr-col-raro .mgr-col-header { background: hsla(0,72%,51%,0.12); color: #f87171; border-color: #f87171; }
body.cfo-connect-theme .mgr-col-sem .mgr-col-header { background: hsla(220,10%,18%,0.5); color: hsl(215,15%,60%); border-color: hsl(215,15%,40%); }
body.cfo-connect-theme .mgr-col-afazer .mgr-col-header { background: hsla(217,91%,60%,0.12); color: #60a5fa; border-color: #60a5fa; }
body.cfo-connect-theme .mgr-col-header .mgr-col-count { background: hsla(0,0%,100%,0.1); }
body.cfo-connect-theme .mgr-col-body.drag-over { background: hsla(0,0%,100%,0.04); }

body.cfo-connect-theme .mgr-badge-producao { background: hsla(142,71%,45%,0.15); color: #4ade80; }
body.cfo-connect-theme .mgr-badge-homologacao { background: hsla(217,91%,60%,0.15); color: #60a5fa; }
body.cfo-connect-theme .mgr-badge-desenvolvimento { background: hsla(38,92%,50%,0.15); color: #fbbf24; }
body.cfo-connect-theme .mgr-badge-desativado { background: hsla(220,10%,18%,0.5); color: hsl(215,15%,60%); }
body.cfo-connect-theme .mgr-badge-erro { background: hsla(0,72%,51%,0.15); color: #f87171; }
body.cfo-connect-theme .mgr-badge-manutencao { background: hsla(340,82%,52%,0.15); color: #f472b6; }
body.cfo-connect-theme .mgr-badge-alta { background: hsla(0,72%,51%,0.15); color: #f87171; }
body.cfo-connect-theme .mgr-badge-media { background: hsla(45,93%,47%,0.15); color: #fbbf24; }
body.cfo-connect-theme .mgr-badge-baixa { background: hsla(142,71%,45%,0.15); color: #4ade80; }

body.cfo-connect-theme .mgr-owner-chip {
    background: hsla(345,70%,35%,0.15);
    color: hsl(345, 70%, 55%);
    border-color: hsla(345,70%,35%,0.25);
}

body.cfo-connect-theme .mgr-confirm-box {
    background: hsl(220, 15%, 12%);
    color: hsl(0, 0%, 96%);
    border: 1px solid hsl(220, 10%, 18%);
}
body.cfo-connect-theme .mgr-confirm-box p { color: hsl(215, 15%, 60%); }

body.cfo-connect-theme .mgr-search input {
    background: hsl(220, 15%, 12%);
    color: hsl(0, 0%, 96%);
    border-color: hsl(220, 10%, 18%);
}
body.cfo-connect-theme .mgr-search input::placeholder { color: hsl(215, 15%, 45%); }

body.cfo-connect-theme .mgr-card-owner-hero {
    background: linear-gradient(135deg, hsla(345,70%,45%,0.18), hsla(345,70%,45%,0.04));
    border-left-color: hsl(345, 70%, 55%);
}
body.cfo-connect-theme .mgr-card-owner-hero .material-icons-outlined,
body.cfo-connect-theme .mgr-card-owner-name {
    color: hsl(345, 70%, 65%);
}
body.cfo-connect-theme .mgr-card-owner-backup { color: hsl(215, 15%, 60%); }
body.cfo-connect-theme .mgr-card-owner-empty {
    background: hsla(220,10%,40%,0.15);
    border-left-color: hsl(215, 15%, 50%);
}
body.cfo-connect-theme .mgr-card-owner-empty .material-icons-outlined,
body.cfo-connect-theme .mgr-card-owner-empty .mgr-card-owner-name {
    color: hsl(215, 15%, 60%);
}
body.cfo-connect-theme .mgr-badge-crit.mgr-badge-alta { background: #ef4444; color: #fff; }
body.cfo-connect-theme .mgr-badge-crit.mgr-badge-media { background: #f59e0b; color: #111; }

body.cfo-connect-theme .mgr-chip {
    background: hsl(220, 15%, 12%);
    border-color: hsl(220, 10%, 20%);
    color: hsl(0, 0%, 90%);
}
body.cfo-connect-theme .mgr-chip:hover:not(:disabled) { border-color: hsl(345, 70%, 55%); }
body.cfo-connect-theme .mgr-card-status-erro       { background: linear-gradient(90deg, hsla(0,72%,51%,0.18), hsl(220,15%,12%) 40%); }
body.cfo-connect-theme .mgr-card-status-manutencao { background: linear-gradient(90deg, hsla(340,82%,52%,0.15), hsl(220,15%,12%) 40%); }

body.cfo-connect-theme .mgr-segment {
    background: hsl(220, 15%, 10%);
    border-color: hsl(220, 10%, 20%);
}
body.cfo-connect-theme .mgr-seg-btn { color: hsl(0, 0%, 90%); }
body.cfo-connect-theme .mgr-seg-btn:hover { background: hsla(0,0%,100%,0.06); }
body.cfo-connect-theme .mgr-seg-btn.active {
    background: hsl(345, 70%, 45%); color: #fff;
}