/* ===== PALETA GENERAL ===== */
:root {
    --verde-principal: #9acd32;
    --verde-oscuro: #7fbf00;
    --gris-oscuro: rgb(59, 56, 56);
    --gris-medio: #4a4a4a;
    --gris-claro: #7a7a7a;
    --negro: #1e1e1e;
}

/* ===== CONTENEDOR BASE ===== */
.seccion-app {
    max-width: 1400px;
    margin: 40px auto;
    padding: 0 20px;
}

/* ===== HEADER SECCIONES ===== */
.header-seccion {
    background: linear-gradient(to bottom, var(--verde-principal), var(--verde-oscuro));
    padding: 16px 24px;
    border-radius: 6px 6px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-seccion h1 {
    margin: 0;
    color: #000;
    font-weight: 700;
}

/* ===== BOTÓN PRINCIPAL ===== */
.btn-principal {
    background: var(--negro);
    color: var(--verde-principal);
    border: 1px solid #000;
    padding: 8px 14px;
    font-weight: 600;
}

.btn-principal:hover {
    background: #000;
    color: var(--verde-principal);
}

.nombre-app{
    color: var(--verde-principal);
}

.usuario-info{
    color: var(--gris-claro);
}