:root {
    --primary: #e67e22;
    --primary-dark: #d35400;
    --success: #27ae60;
    --danger: #e74c3c;
    --info: #3498db;
    --bg: linear-gradient(90deg, #1e5799, #f39c12);
    --card: linear-gradient(90deg, #fff8e1, #fff8e1);/*#fff;*/
    --bg-filter: linear-gradient(90deg, #fff8e1, #fff8e1);/*#fff;*/
}
/* Estilos globais e de layout */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Roboto', sans-serif; background: var(--bg); color: #333; padding: 15px; }
.container { max-width: 1400px; margin: auto; }
.header { 
    background: var(--card); padding: 20px; border-radius: 16px; text-align: center; 
    box-shadow: 0 8px 25px rgba(0,0,0,0.15); margin-bottom: 20px; 
}
.header h1 { color: var(--primary); font-size: 1.9rem; }
.grafico-section, .tabela-section { 
    background: var(--card); padding: 20px; border-radius: 12px; 
    box-shadow: 0 8px 25px rgba(0,0,0,0.15); margin-bottom: 20px; 
}

/* Estilos de Filtros */
.filtros-section { 
    background: var(--card); padding: 20px; border-radius: 12px; 
    box-shadow: 0 8px 25px rgba(0,0,0,0.15); margin-bottom: 20px; 
}
.periodo-block { 
    /*background: #fff8e1; border: 2px solid #ffcc80; border-radius: 10px; */
    background: var(--bg-filter); border: 2px solid #ffcc80; border-radius: 10px;
    padding: 15px; margin-bottom: 15px; display: flex; gap: 15px; flex-wrap: wrap; 
}
.periodo-block h3 { color: #d35400; width: 100%; font-size: 1.1rem; }
.input-group { flex: 1; min-width: 200px; }
.input-group label { display: block; margin-bottom: 5px; font-weight: 500; }
.input-group input { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 6px; }
.filtros-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.btn-buscar { 
    background: var(--primary); color: white; border: none; padding: 12px 20px; 
    border-radius: 8px; cursor: pointer; font-weight: 600; transition: background 0.3s;
}
.btn-buscar:hover { background: var(--primary-dark); }

/* Estilos de Dashboard/Cards */
.dashboard { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; margin-bottom: 20px; }
.card { 
    background: var(--card); border-radius: 12px; padding: 18px; 
    box-shadow: 0 6px 18px rgba(0,0,0,0.1); transition: 0.3s; 
}
.card:hover { transform: translateY(-4px); }

/* Estilos de Tabela */
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th { background: var(--primary); color: white; padding: 12px; text-align: left; }
td { padding: 10px; border-bottom: 1px solid #eee; }
.text-right { text-align: right; }

/* Responsivo */
@media (max-width: 768px) { 
    .periodo-block, .filtros-grid { flex-direction: column; } 
    .dashboard { grid-template-columns: 1fr; } 
}

/* Estilos Específicos do LOG_EVENTOS */
.tear-card { /* Usado em LOG_EVENTOS.php */
    /* Herda de .card */
}
.tear-nome { font-weight: 700; color: var(--primary); font-size: 1.2rem; margin-bottom: 6px; }
.status { padding: 4px 10px; border-radius: 20px; font-size: 0.8rem; font-weight: 600; }
.status.ativo { background: #d4edda; color: var(--success); }
.status.inativo { background: #f8d7da; color: var(--danger); }
.metricas { display: flex; justify-content: space-between; }
.metrica-value { font-size: 1.6rem; font-weight: 700; color: var(--primary); }
.metrica-label { font-size: 0.8rem; color: #666; }
.estado-ativo { color: var(--success); font-weight: 600; }
.estado-inativo { color: var(--danger); font-weight: 600; }

/* Estilos Específicos do POTENCIAS */
.card-title { font-weight: 700; color: var(--primary); font-size: 1.2rem; margin-bottom: 6px; }
.metric { margin: 10px 0; }
.metric-label { font-size: 0.85rem; color: #666; }
.metric-value { font-size: 1.4rem; font-weight: 700; color: var(--info); }
.metric-value.volts { color: #f39c12; }
.metric-value.amperes { color: #e67e22; }
.metric-value.temp { color: #c0392b; }