/* ============================================================
   compact-overrides.css — ChinaImport
   Se carga DESPUÉS de todos los demás CSS para tener prioridad.
   Contiene overrides de layout compacto sobre Bootstrap/Electro.
   ============================================================ */

/* ===== ESPACIADO GLOBAL COMPACTO ===== */
.section,
.section-padding {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}

.section-pb {
    padding-bottom: 16px !important;
}

.section-pt {
    padding-top: 16px !important;
}

/* ===== NAVBAR ===== */
.header-area {
    padding: 0 !important;
}

.header-nav .nav-link {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}

/* ===== PRODUCT CARDS ===== */
.product-card .card-body,
.product-item .item-info {
    padding: 8px 10px !important;
}

.product-card .card-title,
.product-item .item-title {
    font-size: 13px !important;
    margin-bottom: 4px !important;
}

.product-card .card-price,
.product-item .item-price {
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* ===== GRID DE PRODUCTOS ===== */
.products-grid .col,
.products-grid [class*="col-"] {
    padding-left: 6px !important;
    padding-right: 6px !important;
    margin-bottom: 12px !important;
}

.row.products-grid {
    margin-left: -6px !important;
    margin-right: -6px !important;
}

/* ===== HERO ===== */
#static-hero-desktop {
    height: 280px !important;
    min-height: unset !important;
}

/* ===== BREADCRUMB ===== */
.breadcrumb {
    padding: 6px 0 !important;
    margin-bottom: 8px !important;
    font-size: 12px !important;
}

/* ===== PAGINACION ===== */
.pagination {
    margin-top: 12px !important;
    margin-bottom: 12px !important;
}

/* ===== FOOTER ===== */
.footer-area {
    padding-top: 20px !important;
    padding-bottom: 10px !important;
}

/* ===== HEADINGS COMPACTOS ===== */
.section-title h2,
.section-title .title {
    font-size: 20px !important;
    margin-bottom: 8px !important;
}

/* ===== BOTONES ===== */
.btn {
    padding: 6px 14px !important;
    font-size: 13px !important;
}

.btn-sm {
    padding: 3px 8px !important;
    font-size: 12px !important;
}

/* ===== BADGES ===== */
.badge {
    font-size: 11px !important;
    padding: 3px 6px !important;
}

/* ===== TABLAS COMPACTAS ===== */
.table td,
.table th {
    padding: 6px 8px !important;
    vertical-align: middle !important;
}

.table {
    margin-bottom: 12px !important;
}

/* ===== NAVBAR COMPACTO ===== */
.navbar {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}

.navbar-brand {
    font-size: 16px !important;
}

.nav-link {
    padding: 6px 10px !important;
}

/* ===== FORMULARIOS COMPACTOS ===== */
label {
    margin-bottom: 4px !important;
    font-size: 13px !important;
}

.form-control {
    height: auto !important;
    padding: 6px 8px !important;
}

/* ===== BOTONES SECUNDARIOS ===== */
.btn-sm {
    padding: 4px 8px !important;
    font-size: 13px !important;
}

/* ===== CARDS COMPACTOS ===== */
.card {
    margin-bottom: 12px !important;
}

.card-body {
    padding: 12px !important;
}

/* ===== INPUTS Y SELECTS ===== */
input.form-control,
select.form-control,
textarea.form-control {
    height: auto !important;
    padding: 6px 8px !important;
}

/* ===== LISTAS COMPACTAS ===== */
.list-group-item {
    padding: 8px 12px !important;
}

/* ===== DROPDOWN MENUS ===== */
.dropdown-menu {
    padding: 6px !important;
}

.dropdown-item {
    padding: 6px 12px !important;
    font-size: 13px !important;
}

/* ===== MODALS COMPACTOS ===== */
.modal-header {
    padding: 12px 16px !important;
}

.modal-body {
    padding: 16px !important;
}

.modal-footer {
    padding: 12px 16px !important;
}