/* ComercialApp - Mobile First */
body {
    background: #f0f2f5;
    font-size: 0.95rem;
}

.card {
    border: none;
    border-radius: 12px;
    box-shadow: 0 1px 6px rgba(0,0,0,0.08);
}

.card-header {
    background: #fff;
    border-bottom: 1px solid #eee;
    border-radius: 12px 12px 0 0 !important;
    font-weight: 600;
}

.table th {
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    color: #666;
    border-bottom-width: 1px;
}

.table td {
    vertical-align: middle;
}

.btn-sm {
    padding: 0.3rem 0.6rem;
    font-size: 0.82rem;
}

.badge-estado {
    font-size: 0.78rem;
    padding: 0.35em 0.65em;
}

/* Login */
.login-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #2d6a4f 0%, #40916c 100%);
}

.login-card {
    width: 100%;
    max-width: 400px;
    border-radius: 16px;
}

/* Responsive table scroll on mobile */
@media (max-width: 768px) {
    .table-responsive {
        font-size: 0.85rem;
    }

    .hide-mobile {
        display: none !important;
    }

    .container-fluid {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* Estado badges */
.estado-borrador { background-color: #6c757d; }
.estado-confirmado { background-color: #0d6efd; }
.estado-enviado { background-color: #ffc107; color: #333; }
.estado-cobrado { background-color: #198754; }
.estado-devuelto { background-color: #dc3545; }
.estado-trf_pendiente { background-color: #fd7e14; }
.estado-enviada { background-color: #ffc107; color: #333; }
.estado-generada { background-color: #6c757d; }

/* Autosave spinner */
@keyframes spin { to { transform: rotate(360deg); } }
.spin { display: inline-block; animation: spin 0.8s linear infinite; }

/* Custom default select (CDS) — permite cursiva solo en "(por defecto)" */
.cds-wrapper { position: relative; }
.cds-btn {
    -webkit-appearance: none;
    appearance: none;
    display: block;
    width: 100%;
    padding: .375rem 2.25rem .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: .375rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
    text-align: left;
    cursor: pointer;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.cds-btn::after { display: none; }
.cds-btn:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
}
.cds-btn em, .cds-wrapper .dropdown-item em {
    font-style: italic;
    color: #6c757d;
}

/* Bulk selection toolbar */
.bulk-toolbar {
    display: none;
    position: fixed !important;
    bottom: 0 !important;
    left: 0; right: 0;
    background: #1e2430;
    color: #fff;
    padding: .65rem 1.25rem;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    z-index: 9999 !important;
    box-shadow: 0 -3px 12px rgba(0,0,0,.3);
}
.bulk-table thead th.bulk-col,
.bulk-table tbody td.bulk-col { width: 40px; text-align: center; vertical-align: middle; }
.bulk-table tbody tr.row-selected > td { background-color: rgba(0,0,0,.075) !important; }

/* Floating action button mobile */
.fab {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    z-index: 1000;
}

/* ── Árbol categorías en pedidos ─────────────────────────────────────────── */
.cat-nav-row { user-select: none; transition: background .1s; }
.cat-nav-row:hover { background: rgba(13,110,253,.07); }
.cat-nav-row.cat-selected { background: #cfe2ff; }
.cat-nav-row.cat-selected .small { font-weight: 600; }
.cat-nav-row.cat-ancestor { background: rgba(13,110,253,.06); border-left: 2px solid rgba(13,110,253,.25); padding-left: 2px; }

/* ── Comboboxes de atributos en pedidos ─────────────────────────────────── */
.attr-combo-wrap .combo-input.combo-selected {
    background-color: #e8f4fd;
    border-color: #86b7fe;
    font-weight: 600;
}
.attr-combo-wrap .combo-input.combo-selected.text-success {
    background-color: #d1e7dd;
    border-color: #a3cfbb;
}
.combo-dropdown .combo-item:hover,
.combo-dropdown .combo-item.active {
    background-color: #f0f4ff;
    color: #0d6efd;
}

/* ── Precio unitario sin flechas ────────────────────────────────────────── */
.no-spin::-webkit-outer-spin-button,
.no-spin::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.no-spin[type=number] { -moz-appearance: textfield; }

/* ── Sort + Filter (compartido en listas) ───────────────────────────────── */
.tbl-col-hdr  { display:inline-flex; align-items:center; gap:3px; }
.sort-btn, .flt-btn {
    flex-shrink:0; background:none; border:none; padding:1px 3px;
    color:#adb5bd; cursor:pointer; line-height:1; border-radius:3px;
    transition:color .12s, background .12s;
}
.sort-btn:hover, .flt-btn:hover { background:#e9ecef; color:#495057; }
.sort-btn.sort-on { color:#0d6efd; }
.flt-btn.flt-on   { color:#0d6efd; }

.flt-panel {
    position:fixed; z-index:1060;
    background:#fff; border:1px solid #ced4da; border-radius:.4rem;
    box-shadow:0 .5rem 1.2rem rgba(0,0,0,.2);
    min-width:230px; max-width:310px;
    display:none; flex-direction:column; font-size:.85rem;
}
.flt-panel.open { display:flex; }
.flt-p-search  { padding:.45rem .5rem .4rem; border-bottom:1px solid #dee2e6; }
.flt-p-search input { font-size:.8rem; }
.flt-p-all     { padding:.28rem .75rem; border-bottom:1px solid #eee; }
.flt-p-all label {
    display:flex; align-items:center; gap:.4rem;
    cursor:pointer; margin:0; font-size:.8rem; font-weight:600; user-select:none;
}
.flt-p-sr { background:#f0f4ff; border-top:1px dashed #c5cfe8; }
.flt-p-list   { overflow-y:auto; max-height:220px; padding:.1rem 0; }
.flt-p-item   { display:flex; align-items:center; gap:.4rem; padding:.2rem .75rem; cursor:pointer; user-select:none; }
.flt-p-item:hover { background:#f0f4f8; }
.flt-p-item span  { font-size:.82rem; line-height:1.3; }
.flt-p-footer {
    padding:.38rem .5rem; border-top:1px solid #dee2e6;
    display:flex; align-items:center; gap:.35rem;
}
.flt-p-footer .btn { font-size:.78rem; padding:.22rem .55rem; }
.flt-clear {
    font-size:.75rem; color:#6c757d; cursor:pointer;
    text-decoration:underline; margin-right:auto;
    background:none; border:none; padding:0;
}
.flt-clear:hover { color:#dc3545; }

/* Árbol de fechas en filtro (estilo Excel) */
.flt-dt-node  { display:flex; align-items:center; gap:.3rem; padding:.18rem .5rem; user-select:none; }
.flt-dt-node:hover { background:#f0f4f8; }
.flt-dt-year  { font-weight:600; }
.flt-dt-month { padding-left:1.3rem; }
.flt-dt-day   { padding-left:2.6rem; }
.flt-dt-chev  { width:14px; flex-shrink:0; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.flt-dt-chev i { font-size:.6rem; transition:transform .15s; }
.flt-dt-chev.open i { transform:rotate(90deg); }