/* ===== Tema DSS (paleta fornecida) ===== */
:root{
  /* Paleta base
     #007D79 (teal) | #EBAF10 (amarelo) | #08B996 (verde) | #3AB4E3 (azul)
     #BF2E5D (magenta/danger) | #EC6D14 (laranja/acento) | #535353 (cinza)
  */
  --bg: #2b2b2b;            /* base escura derivada do cinza */
  --bg-soft: #262626;       /* fundo alternativo */
  --card: #333333;          /* blocos/cards */
  --text: #f2f2f2;          /* texto principal */
  --muted: #cfcfcf;         /* texto secundário */
  --border: #3e3e3e;        /* linhas/bordas */

  /* Cores de ação mapeadas à paleta */
  --primary: #007D79;       /* ação principal (teal) */
  --primary-700: #006965;   /* hover/ativo do primary */
  --info: #3AB4E3;          /* informativo */
  --success: #08B996;       /* sucesso */
  --warning: #EBAF10;       /* aviso */
  --danger: #BF2E5D;        /* erro/risco */
  --accent: #EC6D14;        /* destaque/cta alternativo */
}

*{box-sizing: border-box}
html,body{
  margin:0;padding:0;background:var(--bg);color:var(--text);
  font:16px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, "Helvetica Neue", Arial, "Apple Color Emoji","Segoe UI Emoji";
}
img{max-width:100%;display:block}
a{color:var(--info);text-decoration:none}

.app-header,.app-footer{border-bottom:1px solid var(--border);background:var(--bg-soft)}
.app-footer{border-top:1px solid var(--border);border-bottom:none}
.wrap{max-width:1100px;margin:0 auto;padding:12px}
.header-flex{display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{font-size:1.2rem;margin:0}
.nav .link{background:none;border:none;color:var(--text);cursor:pointer;margin-left:8px}
.nav .danger{color:var(--danger)}

.container{max-width:1100px;margin:20px auto;padding:0 12px}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:16px;box-shadow:0 8px 24px rgba(0,0,0,.25)}

.form-grid{display:grid;grid-template-columns:1fr;gap:12px}
label span{display:block;margin-bottom:6px;color:var(--muted);font-size:.9rem}
input,select,button{font:inherit}
input,select{width:100%;padding:10px;border-radius:8px;border:1px solid var(--border);background:var(--bg-soft);color:var(--text)}
input[type=date]{padding:8px}

.btn{padding:10px 14px;border-radius:8px;border:1px solid var(--border);background:var(--bg-soft);color:var(--text);cursor:pointer;transition:filter .15s, transform .02s}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--primary);border-color:transparent}
.btn.primary:hover{filter:brightness(.95);background:var(--primary-700)}
.btn.link{padding:6px 10px;background:transparent;border:none}
.btn.link:hover{filter:brightness(1.1)}
.btn.danger{background:var(--danger);border-color:transparent}
.btn.danger:hover{filter:brightness(.95)}
.btn.accent{background:var(--accent);border-color:transparent}
.btn.accent:hover{filter:brightness(.95)}
.btn:disabled{opacity:.6;cursor:not-allowed}

.muted{color:var(--muted)}
.success{color:var(--success);margin-top:8px}
.error{color:var(--danger)}
.warning{color:var(--warning)}

.table-wrap{overflow:auto}
.table{width:100%;border-collapse:collapse;margin-top:10px}
.table th,.table td{border-bottom:1px solid var(--border);padding:10px;text-align:left}
.table th{color:var(--muted);font-weight:600}
.table tbody tr:hover{background:var(--bg-soft)}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.toolbar{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end}
.preview{margin-top:10px}
.preview img{max-height:260px;border:1px solid var(--border);border-radius:8px;background:var(--bg-soft)}

/* Toast */
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:24px;background:var(--bg-soft);color:var(--text);border:1px solid var(--border);padding:12px 16px;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .2s, bottom .2s;z-index:1000}
.toast.show{opacity:1;bottom:32px}
.toast.success{border-color:color-mix(in srgb, var(--success) 60%, #000)}
.toast.error{border-color:color-mix(in srgb, var(--danger) 60%, #000)}

/* Modal (dialog) */
.modal{border:none;border-radius:12px;padding:0;background:transparent}
.modal::backdrop{background:rgba(0,0,0,.6)}
.modal-content{background:var(--card);border:1px solid var(--border);padding:16px;border-radius:12px;min-width:300px}

/* DSS view */
.dss-view{display:grid;gap:12px}
.dss-box{border:1px solid var(--border);border-radius:12px;padding:12px}
.dss-title{font-size:1.1rem;margin:0;color:var(--primary)}
.dss-meta{color:var(--muted);font-size:.9rem}
.dss-img{border:1px solid var(--border);border-radius:12px;overflow:hidden}
.dss-img img{width:100%;max-height:520px;object-fit:contain;background:var(--bg-soft)}

/* Filters */
.filters{display:grid;grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));gap:12px;align-items:end}
.pagination{display:flex;align-items:center;gap:12px;justify-content:flex-end;margin-top:10px}

@media (min-width: 700px){
  .form-grid{grid-template-columns:repeat(2,1fr)}
  #formUser.form-grid{grid-template-columns:repeat(4,1fr)}
}