/* Estilo glass + gradiente azul */
body {
  margin: 0;
  padding: 40px 0;
  font-family: 'Segoe UI', sans-serif;
  background: linear-gradient(135deg, #004e92, #000428);
  color: #fff;
  display: flex;
  justify-content: center;
  min-height: 100vh;
}

/* Container principal */
.container {
  width: 94%;
  max-width: 1200px;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(10px);
  border-radius: 12px;
  padding: 28px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

/* Títulos */
h2, h3 {
  color: #fff;
  margin-bottom: 20px;
}
h2 {
  text-align: center;
  font-size: 28px;
  font-weight: 600;
}

/* Botão voltar */
a.back-btn {
  display: inline-block;
  margin-bottom: 20px;
  color: #00d4ff;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.25);
  padding: 8px 14px;
  text-decoration: none;
  border-radius: 8px;
  font-weight: 600;
  transition: all .25s ease;
}
a.back-btn:hover {
  color: #000;
  background: #00d4ff;
  border-color: #00d4ff;
}

/* Botões */
.btn {
  display: inline-block;
  padding: 8px 14px;
  background: #00d4ff;
  color: #000;
  border-radius: 8px;
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 600;
  transition: transform .2s ease, background .25s ease;
  border: none;
  cursor: pointer;
  margin-left: 6px;
}
.btn:hover {
  background: #00a0cc;
  transform: translateY(-2px);
}
.btn-danger {
  background: #e74c3c;
  color: #fff;
}
.btn-danger:hover {
  background: #c0392b;
}
.btn-secondary {
  background: #6c757d;
  color: white;
}
.btn-secondary:hover {
  background: #5a6268;
}

/* Tabelas */
table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 30px;
  font-size: 0.95rem;
  background: rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  overflow: hidden;
}
th, td {
  padding: 12px;
  border: 1px solid rgba(255,255,255,0.2);
  text-align: center;
}
th {
  background: rgba(0, 212, 255, 0.4);
  color: white;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
td { color: #fff; }

/* Formulários */
form {
  margin-bottom: 20px;
}
form input, form select {
  padding: 10px;
  margin-right: 10px;
  border: none;
  border-radius: 6px;
  font-size: 0.95rem;
  background: #fff;
  color: #000;
  outline: none;
  transition: background 0.3s;
}
form select option { color: #000; }
form input:focus, form select:focus { background: #f1f1f1; }
form button {
  padding: 10px 16px;
  font-size: 0.95rem;
  border: none;
  border-radius: 6px;
  background: #28a745;
  color: white;
  cursor: pointer;
  font-weight: 600;
  transition: background 0.3s ease;
}
form button:hover { background: #218838; }

/* Responsivo */
@media (max-width: 768px) {
  .container { padding: 20px; }
  h2 { font-size: 24px; }
  table { font-size: 0.85rem; }
  th, td { padding: 8px; }
}

/* === o teu CSS inteiro aqui (glass + gradiente) === */
body {
  margin: 0;
  padding: 40px 0;
  font-family: 'Segoe UI', sans-serif;
  background: linear-gradient(135deg, #004e92, #000428);
  color: #fff;
  display: flex;
  justify-content: center;
  min-height: 100vh;
}
.container{width:94%;max-width:1100px;background:rgba(255,255,255,.08);backdrop-filter:blur(10px);border-radius:12px;padding:28px;box-shadow:0 4px 20px rgba(0,0,0,.4)}
h2,h3{color:#fff;margin-bottom:20px}
h2{text-align:center;font-size:28px;font-weight:600}
a.back-btn{display:inline-block;margin-bottom:20px;color:#00d4ff;background:transparent;border:1px solid rgba(255,255,255,.25);padding:8px 14px;text-decoration:none;border-radius:8px;font-weight:600;transition:all .25s ease}
a.back-btn:hover{color:#000;background:#00d4ff;border-color:#00d4ff}
.btn{display:inline-block;padding:8px 14px;background:#00d4ff;color:#000;border-radius:8px;text-decoration:none;font-size:.9rem;font-weight:600;transition:transform .2s ease,background .25s ease;border:none;cursor:pointer;margin-left:6px}
.btn:hover{background:#00a0cc;transform:translateY(-2px)}
.btn-danger{background:#e74c3c;color:#fff}
.btn-danger:hover{background:#c0392b}
.btn-secondary{background:#6c757d;color:#fff}
.btn-secondary:hover{background:#5a6268}
table{width:100%;border-collapse:collapse;margin-bottom:30px;font-size:.95rem;background:rgba(255,255,255,.12);border-radius:8px;overflow:hidden}
th,td{padding:12px;border:1px solid rgba(255,255,255,.2);text-align:center}
th{background:rgba(0,212,255,.4);color:#fff;text-transform:uppercase;letter-spacing:.5px}
td{color:#fff}
form{margin-bottom:20px}
form input,form select{padding:10px;margin-right:10px;border:none;border-radius:6px;font-size:.95rem;background:#fff;color:#000;outline:none;transition:background .3s}
form select option{color:#000}
form input:focus,form select:focus{background:#f1f1f1}
form button{padding:10px 16px;font-size:.95rem;border:none;border-radius:6px;background:#28a745;color:#fff;cursor:pointer;font-weight:600;transition:background .3s}
form button:hover{background:#218838}
@media (max-width:768px){.container{padding:20px}h2{font-size:24px}table{font-size:.85rem}th,td{padding:8px}}

/* Extras */
.navbar {display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.badge-oc{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;font-weight:600;font-size:.85rem;border:1px solid rgba(255,255,255,.2)}
.badge-oc.off{background:rgba(255,255,255,.08);color:#fff}
.badge-oc.on{background:rgba(46, 204, 113, .25);color:#2ecc71;border-color:rgba(46,204,113,.5)}
.badge-oc .dot{width:8px;height:8px;border-radius:50%;background:#9ca3af}
.badge-oc.on .dot{background:#2ecc71}

/* Adicionar em lote (compacto) */
.batch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.batch-grid .item{background:rgba(255,255,255,.08);padding:8px;border-radius:8px}
.batch-grid input{width:100%}
@media (max-width:1024px){.batch-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.batch-grid{grid-template-columns:1fr}}