/* ============================================================
   css/catalogos.css
   Estilos de catalogos.html
   (movidos desde su <style> en línea el 2026-10-18).
   ============================================================ */
        * { box-sizing: border-box; }
        .category-chip {
            padding: 8px 16px !important;
            border-radius: 20px !important;
            font-size: 0.85rem !important;
            font-weight: 600 !important;
            cursor: pointer !important;
            transition: all 0.25s ease !important;
            background: rgba(255,255,255,0.08) !important;
            color: #ffffff !important;
            border: 2px solid rgba(255,255,255,0.15) !important;
        }
        .category-chip:hover {
            background: rgba(255, 107, 0, 0.25) !important;
            border-color: #ff6b00 !important;
        }
        .category-chip.active {
            background: #ff6b00 !important;
            color: #ffffff !important;
            border-color: #ff6b00 !important;
        }
        .subcategory-chip {
            padding: 6px 14px !important;
            border-radius: 15px !important;
            font-size: 0.75rem !important;
            font-weight: 600 !important;
            cursor: pointer !important;
            transition: all 0.25s ease !important;
            background: rgba(46, 204, 113, 0.15) !important;
            color: #2ecc71 !important;
            border: 1px solid rgba(46, 204, 113, 0.3) !important;
        }
        .subcategory-chip:hover {
            background: rgba(46, 204, 113, 0.3) !important;
            border-color: #2ecc71 !important;
        }
        .subcategory-chip.active {
            background: #2ecc71 !important;
            color: #ffffff !important;
            border-color: #2ecc71 !important;
        }
        .product-card-modern {
            background: #1a3a2a !important;
            border-radius: 16px !important;
            overflow: hidden !important;
            transition: all 0.3s ease !important;
            border: 1px solid rgba(46, 204, 113, 0.2) !important;
            height: 100% !important;
            display: flex !important;
            flex-direction: column !important;
        }
        .product-card-modern:hover {
            transform: translateY(-5px) !important;
            box-shadow: 0 15px 40px rgba(0,0,0,0.4) !important;
            border-color: rgba(255, 107, 0, 0.3) !important;
        }
        .product-image-wrapper {
            position: relative !important;
            height: 200px !important;
            overflow: hidden !important;
            background: #0d1f15 !important;
        }
        .product-image-wrapper img {
            width: 100% !important;
            height: 100% !important;
            object-fit: contain !important;
            padding: 1.25rem !important;
            transition: transform 0.4s ease, opacity 0.3s ease !important;
        }
        .product-card-modern:hover .product-image-wrapper img {
            transform: scale(1.05) !important;
        }
        .product-badges {
            position: absolute !important;
            top: 10px !important;
            left: 10px !important;
            right: 10px !important;
            display: flex !important;
            justify-content: space-between !important;
            align-items: flex-start !important;
        }
        .badge-discount {
            background: #ff6b00 !important;
            color: #fff !important;
            padding: 5px 10px !important;
            border-radius: 15px !important;
            font-size: 0.7rem !important;
            font-weight: 700 !important;
        }
        .badge-bestseller {
            background: #2ecc71 !important;
            color: #fff !important;
            padding: 5px 10px !important;
            border-radius: 15px !important;
            font-size: 0.7rem !important;
            font-weight: 700 !important;
        }
        .product-info {
            padding: 18px !important;
            flex: 1 !important;
            display: flex !important;
            flex-direction: column !important;
        }
        .product-category-tag {
            display: inline-flex !important;
            align-items: center !important;
            gap: 5px !important;
            color: #ff6b00 !important;
            font-size: 0.65rem !important;
            font-weight: 700 !important;
            text-transform: uppercase !important;
            letter-spacing: 0.5px !important;
            margin-bottom: 6px !important;
        }
        .product-name {
            color: #ffffff !important;
            font-size: 1rem !important;
            font-weight: 700 !important;
            margin: 0 0 10px 0 !important;
            line-height: 1.3 !important;
            display: -webkit-box !important;
            -webkit-line-clamp: 2 !important;
            -webkit-box-orient: vertical !important;
            overflow: hidden !important;
        }
        .product-description {
            color: #a0a0b0 !important;
            font-size: 0.8rem !important;
            line-height: 1.5 !important;
            margin-bottom: 12px !important;
            display: -webkit-box !important;
            -webkit-line-clamp: 3 !important;
            -webkit-box-orient: vertical !important;
            overflow: hidden !important;
            flex: 1 !important;
        }
        .product-footer {
            display: flex !important;
            align-items: center !important;
            justify-content: space-between !important;
            padding-top: 12px !important;
            border-top: 1px solid rgba(255,255,255,0.08) !important;
        }
        .product-price {
            display: flex !important;
            flex-direction: column !important;
        }
        .price-current {
            color: #ff6b00 !important;
            font-size: 1.25rem !important;
            font-weight: 800 !important;
        }
        .price-original {
            color: #666 !important;
            font-size: 0.8rem !important;
            text-decoration: line-through !important;
        }
        .product-actions {
            display: flex !important;
            gap: 6px !important;
        }
        .btn-action {
            width: 38px !important;
            height: 38px !important;
            border-radius: 10px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            cursor: pointer !important;
            transition: all 0.25s ease !important;
            border: none !important;
            font-size: 0.9rem !important;
        }
        .btn-view {
            background: rgba(255,255,255,0.1) !important;
            color: #fff !important;
        }
        .btn-view:hover {
            background: rgba(255,255,255,0.2) !important;
        }
        .btn-whatsapp {
            background: #2ecc71 !important;
            color: #fff !important;
        }
        .btn-whatsapp:hover {
            background: #27ae60 !important;
        }
        .pagination .page-link {
            background: rgba(255,255,255,0.08) !important;
            color: #ffffff !important;
            border: 1px solid rgba(255,255,255,0.15) !important;
            border-radius: 8px !important;
            padding: 6px 14px !important;
            font-weight: 600 !important;
            font-size: 0.85rem !important;
        }
        .pagination .page-link:hover {
            background: rgba(255, 107, 0, 0.25) !important;
            border-color: #ff6b00 !important;
            color: #ffffff !important;
        }
        .pagination .page-item.active .page-link {
            background: #ff6b00 !important;
            border-color: #ff6b00 !important;
            color: #ffffff !important;
        }
        .pagination .page-item.disabled .page-link {
            background: rgba(255,255,255,0.03) !important;
            color: #666 !important;
            border-color: rgba(255,255,255,0.05) !important;
        }
        .modal-content {
            background: #1a3a2a !important;
            border: 1px solid rgba(46, 204, 113, 0.2) !important;
            border-radius: 16px !important;
        }
        .modal-header { border-bottom: 1px solid rgba(255,255,255,0.1) !important; }
        .modal-title { color: #ffffff !important; font-weight: 700 !important; }
        .btn-close { filter: invert(1) !important; }
        .modal-body { padding: 1.5rem !important; }
        .modal-body img { border-radius: 10px !important; }
        .modal-footer { border-top: 1px solid rgba(255,255,255,0.1) !important; }
        .back-btn {
            display: inline-flex !important;
            align-items: center !important;
            gap: 8px !important;
            padding: 8px 16px !important;
            border-radius: 20px !important;
            background: rgba(255,255,255,0.08) !important;
            color: #ffffff !important;
            border: 1px solid rgba(255,255,255,0.15) !important;
            cursor: pointer !important;
            transition: all 0.25s ease !important;
            font-weight: 600 !important;
            font-size: 0.85rem !important;
        }
        .back-btn:hover {
            background: rgba(255, 107, 0, 0.2) !important;
            border-color: #ff6b00 !important;
        }
        .products-header {
            display: flex !important;
            align-items: center !important;
            justify-content: space-between !important;
            margin-bottom: 16px !important;
            flex-wrap: wrap !important;
            gap: 10px !important;
        }
        .products-title {
            color: #ffffff !important;
            font-size: 1.25rem !important;
            font-weight: 700 !important;
            margin: 0 !important;
        }
        .products-title i { color: #ff6b00 !important; margin-right: 8px !important; }
        @media (max-width: 768px) {
            .product-image-wrapper { height: 170px !important; }
            .products-title { font-size: 1.1rem !important; }
            .product-info { padding: 14px !important; }
        }
        @media (max-width: 576px) {
            .product-image-wrapper { height: 150px !important; }
            .product-info { padding: 12px !important; }
            .product-name { font-size: 0.9rem !important; }
            .price-current { font-size: 1.1rem !important; }
            .btn-action { width: 34px !important; height: 34px !important; font-size: 0.8rem !important; }
        }
    

/* ── estilos en línea (style="...") movidos a clases ── */
.est-position-fixed { position: fixed; bottom: 20px; right: 20px; z-index: 1000; }
.est-background-1a3a2a { background: #1a3a2a; border-radius: 16px; padding: 30px; max-width: 400px; width: 90%; border: 1px solid rgba(46,204,113,0.3); text-align: center; }
.est-color-2ecc71 { color: #2ecc71; margin-bottom: 20px; }
.est-width-100 { width: 100%; }
.est-font-size-0-8rem { font-size: 0.8rem; }