﻿:root {
    /* Identidad Visual: Empresa Maderera */
    --corteza-oscura: #2C1E12; /* Café muy oscuro */
    --blanco-puro: #FFFFFF;
    --madera-tronco: #3D2B1F; /* Café principal */
    --verde-pino: #2D5A27; /* Verde bosque profundo */
    --musgo-claro: #A8C69F; /* Verde suave */
    --follaje-densos: #4A6741; /* Verde medio */
    --hoja-fresca: #739072; /* Verde de acento */
    --crema-aserrin: #F2E8DF; /* Fondo cálido */
    --resina-ambar: #8B5A2B; /* Café de realce para focus */
    --caoba-profundo: #5D4037; /* Café rojizo */
    --carbon-vegetal: #1A120B; /* Negro orgánico */
}

/* ---- CONTENEDORES GENERALES ---- */

body {
    background-color: var(--crema-aserrin);
    color: var(--corteza-oscura);
}

.container, .table-responsive {
    padding-top: 15px;
    padding-bottom: 15px;
}

/* ---- TITULOS Y SUBTITULOS ---- */

h1, h2, h3, h4 {
    color: var(--madera-tronco);
    margin-bottom: 20px;
}


/* ---- FIELDSETS E INFORMACIÓN PRINCIPAL ---- */

fieldset {
    background: var(--blanco-puro);
    border: 2px solid var(--madera-tronco);
    padding: 25px 30px;
    border-radius: 12px;
    margin-bottom: 30px;
    box-shadow: 0 3px 10px rgba(44, 30, 18, 0.1);
}

legend {
    font-size: 20px;
    font-weight: 700;
    color: var(--verde-pino);
    padding: 0 10px;
}


/* ---- LABELS ---- */

label {
    font-weight: 600;
    font-size: 15px;
    display: block;
    margin-bottom: 6px;
    color: var(--corteza-oscura);
}


/* ---- INPUTS, SELECTS, TEXTAREAS ---- */

input.form-control,
select.form-control,
textarea.form-control,
.form-select {
    height: 50px !important;
    padding: 10px 14px !important;
    font-size: 16px !important;
    border: 2px solid var(--resina-ambar) !important;
    border-radius: 10px !important;
    transition: 0.2s ease-in-out;
}

    input.form-control:focus,
    select.form-control:focus,
    textarea.form-control:focus {
        outline: none !important;
        box-shadow: 0 0 6px var(--follaje-densos);
        border-color: var(--verde-pino) !important;
    }

/* ---- TABLAS ---- */

table.table {
    background: var(--blanco-puro);
    border-radius: 12px;
    overflow: hidden;
    border: 2px solid var(--corteza-oscura);
}

    table.table thead {
        background-color: var(--madera-tronco) !important;
        color: var(--corteza-oscura) !important;
    }

    table.table td,
    table.table th {
        vertical-align: middle !important;
        padding: 14px !important;
    }


/* ---- BOTONES ---- */

button, .btn {
    font-weight: 600 !important;
    border-radius: 10px !important;
    padding: 12px 25px !important;
    transition: 0.2s;
}

    /* Botones principales */
    button[type="submit"],
    .btn-primary {
        background-color: var(--verde-pino) !important;
        border: none !important;
        color: var(--blanco-puro) !important;
    }

        button[type="submit"]:hover,
        .btn-primary:hover {
            background-color: var(--follaje-densos) !important;
        }
