/* _content/PMCWEB/Components/Layout/LanguageSelector.razor.rz.scp.css */
.language-selector[b-c9i14g2vud] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 14px;
    user-select: none;
}

.lang-option[b-c9i14g2vud] {
    color: #2D2E2E;
    font-weight: 400;
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 2px 6px;
    border-radius: 4px;
}

.lang-option:hover[b-c9i14g2vud] {
    background-color: rgba(60, 170, 54, 0.1);
    color: #3CAA36;
}

.lang-option.active[b-c9i14g2vud] {
    font-weight: 700;
    color: #3CAA36;
}

.lang-separator[b-c9i14g2vud] {
    color: #999;
    font-weight: 300;
    pointer-events: none;
    user-select: none;
}
/* _content/PMCWEB/Components/Layout/MainLayout.razor.rz.scp.css */
/* ============================================================================
   MENÚ DESPLEGABLE DE PRODUCTOS - DISEÑO FIGMA
   ============================================================================ */

/* Contenedor principal del menú productos */
[b-qprs79yowd] .productos-menu-container {
    display: none;
    position: absolute;
    width: 1498px;
    min-height: 520px;
    margin-top: 20px;
    z-index: 9999;
    background: #F5F5F5;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    border-radius: 0 0 15px 15px;
    padding: 0;
    grid-template-columns: 224px 1fr;
    grid-template-rows: 1fr;
    gap: 0;
    left: 50%;
    transform: translateX(-50%);
}

/* ============================================================================
   COLUMNA IZQUIERDA - CATEGORÍAS PRINCIPALES (224px)
   ============================================================================ */

[b-qprs79yowd] #primary_categories {
    display: flex;
    flex-direction: column;
    background: transparent;
    width: 224px;
    padding: 0;
    height: 520px;
}

/* Header verde - "Promociones de Mes" */
[b-qprs79yowd] .promociones-mes {
    background: #3CAA36;
    height: 40px;
    display: flex;
    align-items: center;
    padding-left: 29px;
    color: #FFFFFF;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.25px;
    flex-shrink: 0;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

[b-qprs79yowd] .promociones-mes:hover {
    background: #45a049;
}

/* Título - "Familias de Producto" */
[b-qprs79yowd] .familias-titulo {
    background: #FFFFFF;
    height: 42px;
    display: flex;
    align-items: center;
    padding-left: 29px;
    color: #2D2E2E;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.25px;
    flex-shrink: 0;
}

/* Items de categoría principal */
[b-qprs79yowd] .categoria-item {
    background: #FFFFFF;
    height: 45px;
    display: flex;
    align-items: center;
    padding-left: 29px;
    gap: 7px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    flex-shrink: 0;
    border-bottom: 1px solid #E0E0E0;
}

[b-qprs79yowd] .categoria-item:last-of-type {
    border-bottom: none;
}

/* Hover de categoría */
[b-qprs79yowd] .categoria-item:hover {
    background: #F5F5F5;
}

/* Categoría seleccionada */
[b-qprs79yowd] .categoria-item.selected {
    background: #F5F5F5;
    font-weight: 700;
}

[b-qprs79yowd] .categoria-item.selected::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #3CAA36;
}

/* Icono de categoría */
[b-qprs79yowd] .categoria-icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

[b-qprs79yowd] .categoria-icon img {
    max-width: 20px;
    max-height: 18px;
    display: block;
}

/* Texto de categoría */
[b-qprs79yowd] .categoria-text {
    color: #2D2E2E;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.25px;
    flex: 1;
}

[b-qprs79yowd] .categoria-item.selected .categoria-text {
    font-weight: 700;
}

/* Espacio inferior */
[b-qprs79yowd] #primary_categories::after {
    content: '';
    background: #FFFFFF;
    flex: 1;
    border-bottom-left-radius: 15px;
}

/* ============================================================================
   COLUMNA CENTRAL - SUBCATEGORÍAS (GRID)
   ============================================================================ */

[b-qprs79yowd] #subcategories_panel {
    background: var(--Gris-10, #F5F5F5);
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    height: 520px;
    max-height: 520px;
    border-radius: 0 0 15px 0;
}

/* Scroll personalizado para el panel */
[b-qprs79yowd] #subcategories_panel::-webkit-scrollbar {
    width: 8px;
}

[b-qprs79yowd] #subcategories_panel::-webkit-scrollbar-track {
    background: #f5f5f5;
    border-radius: 4px;
}

[b-qprs79yowd] #subcategories_panel::-webkit-scrollbar-thumb {
    background: #bdbdbd;
    border-radius: 4px;
}

[b-qprs79yowd] #subcategories_panel::-webkit-scrollbar-thumb:hover {
    background: #9e9e9e;
}

/* Contenedor de subcategorías (oculto por defecto) */
[b-qprs79yowd] #subcategories_panel .subcategories {
    display: none;
    width: 100%;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* Subcategorías activas (4 COLUMNAS FIJAS) */
[b-qprs79yowd] #subcategories_panel .subcategories.active {
    display: grid;
    opacity: 1;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px 60px;
    animation: fadeIn-b-qprs79yowd 0.2s ease-in-out;
}

@keyframes fadeIn-b-qprs79yowd {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Columna individual de subcategorías */
[b-qprs79yowd] .subcategory {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Título de la columna (nivel 2) */
[b-qprs79yowd] .subcategory > a {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 24px;
    color: #2D2E2E;
    text-decoration: none;
    padding: 0;
    transition: color 0.2s ease;
    white-space: nowrap;
}

[b-qprs79yowd] .subcategory > a:hover {
    color: #3CAA36;
}

/* Contenedor de nivel 3 */
[b-qprs79yowd] .subsubcategories {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

/* Item nivel 3 */
[b-qprs79yowd] .subsubcategory {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

/* Contenedor para texto + chevron en nivel 3 */
[b-qprs79yowd] .subsubcategory-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: 24px;
    width: 100%;
}

/* Link de texto del nivel 3 (clickable para navegar) */
[b-qprs79yowd] .subsubcategory-text-link {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #2D2E2E;
    letter-spacing: 0.25px;
    text-decoration: none;
    flex: 1;
    padding: 2px 0;
    transition: color 0.2s ease;
}

[b-qprs79yowd] .subsubcategory-text-link:hover {
    color: #3CAA36;
}

/* Botón toggle para categorías con nivel 4 (solo el chevron) */
[b-qprs79yowd] .subsubcategory-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    background: transparent;
    border: none;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.2s ease;
    border-radius: 4px;
}

[b-qprs79yowd] .subsubcategory-toggle:hover {
    background: #F5F5F5;
}



/* Icono chevron (›) */
[b-qprs79yowd] .chevron-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 400;
    color: #757575;
    transform: rotate(0deg);
    transition: transform 0.3s ease, color 0.2s ease;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

[b-qprs79yowd] .subsubcategory-toggle:hover .chevron-icon {
    color: #3CAA36;
}

[b-qprs79yowd] .subsubcategory-toggle.expanded .chevron-icon {
    transform: rotate(90deg);
}

/* Link directo nivel 3 (sin nivel 4) */
[b-qprs79yowd] .subsubcategory-link {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #2D2E2E;
    letter-spacing: 0.25px;
    text-decoration: none;
    padding: 2px 0;
    transition: color 0.2s ease;
}

[b-qprs79yowd] .subsubcategory-link:hover {
    color: #3CAA36;
}

/* Contenedor de nivel 4 (colapsable) */
[b-qprs79yowd] .nivel4categories {
    display: none;
    flex-direction: column;
    gap: 3px;
    padding-left: 10px;
    padding-top: 3px;
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease;
}

[b-qprs79yowd] .nivel4categories.expanded {
    display: flex;
    opacity: 1;
    max-height: 500px;
    padding-top: 3px;
}

/* Links nivel 4 */
[b-qprs79yowd] .nivel4category-link {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #2D2E2E;
    letter-spacing: 0.25px;
    text-decoration: none;
    padding: 0;
    transition: color 0.2s ease;
}

[b-qprs79yowd] .nivel4category-link:hover {
    color: #3CAA36;
}

/* Separador vertical entre columnas */
[b-qprs79yowd] .subcategory::after {
    content: '';
    position: absolute;
    right: -40px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #E0E0E0;
}

[b-qprs79yowd] .subcategory:last-child::after {
    display: none;
}

/* ============================================================================
   COLUMNA DERECHA - ELIMINADA (ahora usamos 4 columnas de subcategorías)
   ============================================================================ */

/* ============================================================================
   OVERLAY DE FONDO
   ============================================================================ */

/* ============================================================================
   OVERLAY DE FONDO
   ============================================================================ */

[b-qprs79yowd] .header-nuevo-overlay {
    opacity: 0;
    visibility: hidden;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 500;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    pointer-events: none;
}

[b-qprs79yowd] .header-nuevo-overlay.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* ============================================================================
   RESPONSIVE DESIGN
   ============================================================================ */

@media (max-width: 1600px) {
    [b-qprs79yowd] .productos-menu-container {
        width: 95%;
    }
    
    [b-qprs79yowd] #subcategories_panel {
        padding: 40px 60px;
    }
    
    [b-qprs79yowd] #subcategories_panel .subcategories.active {
        gap: 60px 60px;
    }
}

@media (max-width: 1400px) {
    [b-qprs79yowd] .productos-menu-container {
        width: 98%;
    }
    
    [b-qprs79yowd] #subcategories_panel {
        padding: 30px 40px;
    }
    
    [b-qprs79yowd] #subcategories_panel .subcategories.active {
        gap: 40px 40px;
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    }
}

@media (max-width: 1200px) {
    [b-qprs79yowd] .productos-menu-container {
        grid-template-columns: 200px 1fr 280px;
        width: 100%;
    }
    
    [b-qprs79yowd] #primary_categories {
        width: 200px;
    }
    
    [b-qprs79yowd] #category-preview {
        width: 280px;
    }
    
    [b-qprs79yowd] .preview-image {
        width: 280px;
    }
    
    [b-qprs79yowd] #subcategories_panel {
        padding: 30px 30px;
    }
    
    [b-qprs79yowd] #subcategories_panel .subcategories.active {
        gap: 30px 30px;
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }
}

@media (max-width: 992px) {
    [b-qprs79yowd] .productos-menu-container {
        grid-template-columns: 180px 1fr;
        min-height: 400px;
    }
    
    [b-qprs79yowd] #primary_categories {
        width: 180px;
        height: auto;
    }
    
    [b-qprs79yowd] #category-preview {
        display: none;
    }
    
    [b-qprs79yowd] #subcategories_panel {
        padding: 20px 25px;
        height: auto;
        min-height: 400px;
    }
    
    [b-qprs79yowd] #subcategories_panel .subcategories.active {
        gap: 25px 25px;
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    }
    
    [b-qprs79yowd] .categoria-item {
        padding-left: 20px;
    }
    
    [b-qprs79yowd] .promociones-mes,
    [b-qprs79yowd] .familias-titulo {
        padding-left: 20px;
    }
}

@media (max-width: 768px) {
    [b-qprs79yowd] .productos-menu-container {
        grid-template-columns: 1fr;
        width: 100%;
        left: 0;
        transform: none;
        min-height: auto;
        max-height: 70vh;
        overflow-y: auto;
    }
    
    [b-qprs79yowd] #primary_categories {
        width: 100%;
        height: auto;
    }
    
    [b-qprs79yowd] #primary_categories::after {
        display: none;
    }
    
    [b-qprs79yowd] #subcategories_panel {
        display: none !important;
    }
    
    [b-qprs79yowd] .categoria-item {
        height: 48px;
        padding-left: 20px;
        border-bottom: 1px solid #E0E0E0;
    }
    
    [b-qprs79yowd] .promociones-mes {
        border-radius: 0;
    }
}

/* ============================================================================
   MENÚ DE SERVICIOS
   ============================================================================ */

[b-qprs79yowd] .servicios-menu-container {
    display: none;
    position: absolute;
    width: 100%;
    margin-top: 20px;
    z-index: 9999;
    background: transparent;
    border-radius: 0 0 12px 12px;
    opacity: 1 !important;
    filter: none !important;
    padding: 0;
    gap: 0;
    right: 0;
    left: 0;
    grid-template-columns: 280px 1fr;
    min-height: 320px;
}

/* Contenedor de subcategorías - Recuadro blanco */
[b-qprs79yowd] #servicios_categories {
    background: #FFFFFF;
    padding: 10px 10px;
    border-radius: 12px 0 0 12px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}

/* Título "Nuestros Servicios" */
[b-qprs79yowd] #servicios_categories h3 {
    color: #2D2E2E;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0.15px;
    margin: 0 0 12px 0;
}

/* Items de servicios en el recuadro blanco */
[b-qprs79yowd] #servicios_categories > div {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    transition: all 0.3s ease;
    cursor: pointer;
    background: transparent;
    border: 1px solid transparent;
}

[b-qprs79yowd] #servicios_categories > div:hover {
    background: #F8F9FA;
    border-color: #4CAF50;
    transform: translateX(3px);
}

/* Iconos de servicios */
[b-qprs79yowd] #servicios_categories > div img {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    filter: brightness(0.7);
    transition: filter 0.3s ease;
}

[b-qprs79yowd] #servicios_categories > div:hover img {
    filter: brightness(1);
}

/* Enlaces de servicios */
[b-qprs79yowd] #servicios_categories > div a {
    color: #2D2E2E;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.3;
    text-decoration: none;
    transition: color 0.3s ease;
    flex: 1;
}

[b-qprs79yowd] #servicios_categories > div:hover a {
    color: #4CAF50;
}

/* Separadores entre servicios */
[b-qprs79yowd] #servicios_categories hr {
    border: none;
    height: 1px;
    background: linear-gradient(to right, transparent, #E0E0E0, transparent);
    margin: 2px 0;
}

/* Área de imagen - ocupa el resto del espacio hasta el botón Log In */
[b-qprs79yowd] .servicios-image-area {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 0 12px 12px 0;
    min-height: 320px;
    transition: background-image 0.5s ease;
    overflow: hidden;
    background-image: linear-gradient(135deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.6) 100%), var(--bg-image, url('../images/images/servicios/bannerPM.svg'));
}

/* Overlay con información de la categoría */
[b-qprs79yowd] .servicios-image-overlay {
    position: absolute;
    bottom: 20px;
    left: 20px;
    right: 20px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-radius: 8px;
    padding: 15px 18px;
    transform: translateY(15px);
    opacity: 0;
    transition: all 0.4s ease;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

[b-qprs79yowd] .servicios-image-area:hover .servicios-image-overlay {
    transform: translateY(0);
    opacity: 1;
}

/* Título en overlay de imagen */
[b-qprs79yowd] .servicios-image-overlay h4 {
    color: #2D2E2E;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.2;
    margin: 0 0 8px 0;
}

/* Descripción en overlay de imagen */
[b-qprs79yowd] .servicios-image-overlay p {
    color: #666666;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 1.4;
    margin: 0 0 12px 0;
}

/* Botón CTA en overlay */
[b-qprs79yowd] .servicios-image-overlay .cta-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #4CAF50;
    color: white;
    padding: 8px 16px;
    border-radius: 6px;
    text-decoration: none;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 13px;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
}

[b-qprs79yowd] .servicios-image-overlay .cta-button:hover {
    background: #45a049;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3);
}

/* Responsive - Tablet */
@media (max-width: 1024px) {
    [b-qprs79yowd] .servicios-menu-container {
        grid-template-columns: 260px 1fr;
        width: 90%;
        margin-left: -10%;
    }

    [b-qprs79yowd] #servicios_categories {
        padding: 18px 15px;
    }

    [b-qprs79yowd] .servicios-image-overlay {
        bottom: 15px;
        left: 15px;
        right: 15px;
        padding: 12px 15px;
    }
}

/* Responsive - Mobile */
@media (max-width: 768px) {
    [b-qprs79yowd] .servicios-menu-container {
        grid-template-columns: 1fr;
        width: 100%;
        margin-left: 0;
        left: 0;
        right: 0;
        min-height: 280px;
    }

    [b-qprs79yowd] .servicios-image-area {
        display: none;
    }

    [b-qprs79yowd] #servicios_categories {
        border-radius: 12px;
        max-height: 60vh;
        overflow-y: auto;
        padding: 15px 12px;
        gap: 8px;
    }

    [b-qprs79yowd] #servicios_categories h3 {
        font-size: 15px;
        margin: 0 0 10px 0;
        padding-bottom: 8px;
    }

    [b-qprs79yowd] #servicios_categories > div {
        padding: 8px 10px;
        border-radius: 6px;
        gap: 10px;
    }

    [b-qprs79yowd] #servicios_categories > div img {
        width: 20px;
        height: 20px;
    }

    [b-qprs79yowd] #servicios_categories > div a {
        font-size: 13px;
    }

    [b-qprs79yowd] #servicios_categories hr {
        margin: 1px 0;
    }
}

/* ============================================================================
   RESTO DE ESTILOS DEL LAYOUT
   ============================================================================ */

/* Estilos para el buscador */
.search-container[b-qprs79yowd] {
    display: flex;
    align-items: center;
    gap: 8px;
    position: relative;
    z-index: 500;
}

#lupaIcon[b-qprs79yowd] {
    cursor: pointer;
    opacity: 0.7;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    transition: opacity 0.2s ease;
}

#lupaIcon:hover[b-qprs79yowd] {
    opacity: 1;
}

.search-input[b-qprs79yowd] {
    border: 1px solid #ddd !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    width: 300px !important;
    height: 36px !important;
    outline: none;
    box-sizing: border-box !important;
    background-color: #fff !important;
    color: #333 !important;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 400 !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    transition: all 0.3s ease !important;
}

.search-input[b-qprs79yowd]::placeholder {
    color: #999 !important;
    font-size: 14px !important;
    opacity: 1 !important;
    font-weight: 400 !important;
}

.search-input:focus[b-qprs79yowd] {
    border-color: #4CAF50 !important;
    box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.1) !important;
    background-color: #fff !important;
    color: #333 !important;
}

.search-suggestions[b-qprs79yowd] {
    position: absolute;
    top: calc(100% + 48px);
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
    max-height: 400px;
    overflow-y: auto;
    z-index: 600;
    margin-top: 0;
}

.suggestion-item[b-qprs79yowd] {
    padding: 0;
    cursor: pointer;
    border-bottom: 1px solid #f5f5f5;
    transition: background-color 0.2s ease;
    background: white;
}

.suggestion-item:first-child[b-qprs79yowd] {
    border-radius: 8px 8px 0 0;
}

.suggestion-item:last-child[b-qprs79yowd] {
    border-bottom: none;
    border-radius: 0 0 8px 8px;
}

.suggestion-item:hover[b-qprs79yowd] {
    background-color: #f8f9fa;
}

.suggestion-content[b-qprs79yowd] {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    gap: 12px;
}

.suggestion-image[b-qprs79yowd] {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    object-fit: cover;
    border: 1px solid #e0e0e0;
    background: #f8f9fa;
    flex-shrink: 0;
}

.suggestion-icon[b-qprs79yowd] {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    background: #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}

.suggestion-icon-product[b-qprs79yowd] {
    background: #e8f5e8;
    color: #4caf50;
}

.suggestion-icon-reference[b-qprs79yowd] {
    background: #e3f2fd;
    color: #2196f3;
}

.suggestion-icon-brand[b-qprs79yowd] {
    background: #fff3e0;
    color: #ff9800;
}

.suggestion-icon-category[b-qprs79yowd] {
    background: #f3e5f5;
    color: #9c27b0;
}

.suggestion-text[b-qprs79yowd] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.suggestion-main-text[b-qprs79yowd] {
    font-size: 14px;
    font-weight: 500;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.suggestion-reference[b-qprs79yowd] {
    font-size: 12px;
    color: #666;
    font-weight: 400;
    margin-top: 1px;
}

.suggestion-price[b-qprs79yowd] {
    font-size: 12px;
    color: #4caf50;
    font-weight: 600;
    margin-top: 2px;
}

.suggestion-type[b-qprs79yowd] {
    font-size: 11px;
    color: #999;
    font-weight: 500;
    background: #f5f5f5;
    padding: 2px 8px;
    border-radius: 12px;
    white-space: nowrap;
    align-self: flex-start;
    margin-top: 2px;
}

/* Estructura principal de la página */
html[b-qprs79yowd], body[b-qprs79yowd] {
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Nunito Sans', sans-serif;
}

.page[b-qprs79yowd] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Header */
#cabecera[b-qprs79yowd] {
    width: 100%;
    position: relative;
    z-index: 998;
    height: auto;
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    flex-shrink: 0;
    background: white;
    transition: all 0.3s ease;
}

/* Header sticky solo en productos */
body.productos-page #cabecera[b-qprs79yowd] {
    position: sticky;
    top: 0;
}

body.productos-page #cabecera.scrolled[b-qprs79yowd] {
    padding: 5px 0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

body.productos-page #cabecera.scrolled .logo img[b-qprs79yowd] {
    height: 35px;
    transition: height 0.3s ease;
}

body.productos-page #cabecera.scrolled .descripcionmenu[b-qprs79yowd] {
    display: none;
}

body.productos-page #cabecera.scrolled hr[b-qprs79yowd] {
    display: none;
}

body.productos-page #cabecera.scrolled #barramenu[b-qprs79yowd] {
    padding: 0;
    margin: 0;
}

body.productos-page #cabecera.scrolled #barramenu nav ul.menuul[b-qprs79yowd] {
    margin: 0;
    gap: 15px;
}

body.productos-page #cabecera.scrolled #barramenu nav ul.menuul li[b-qprs79yowd] {
    font-size: 13px;
}

body.productos-page #cabecera.scrolled #textBoxBusqueda[b-qprs79yowd] {
    display: none !important;
}

body.productos-page #cabecera.scrolled #searchSuggestions[b-qprs79yowd] {
    display: none !important;
}

body.productos-page #cabecera.scrolled #icons[b-qprs79yowd] {
    gap: 8px;
}

body.productos-page #cabecera.scrolled #icons img[b-qprs79yowd] {
    width: 16px;
    height: 16px;
}

body.productos-page #cabecera.scrolled .boton-2[b-qprs79yowd] {
    height: 2rem;
    font-size: 12px;
    padding: 0 12px;
}

body.productos-page #cabecera.scrolled .user-name[b-qprs79yowd] {
    padding: 6px 12px;
    font-size: 13px;
}

/* Contenido principal */
main[b-qprs79yowd] {
    flex: 1 0 auto;
    width: 100%;
}

/* Footer */
.footer[b-qprs79yowd] {
    width: 100%;
    position: relative;
    flex-shrink: 0;
    padding-top: 20px;
}

.sidebar[b-qprs79yowd] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-qprs79yowd] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

.top-row[b-qprs79yowd]  a, .top-row[b-qprs79yowd]  .btn-link {
    white-space: nowrap;
    margin-left: 1.5rem;
    text-decoration: none;
}

.top-row[b-qprs79yowd]  a:hover, .top-row[b-qprs79yowd]  .btn-link:hover {
    text-decoration: underline;
}

.top-row[b-qprs79yowd]  a:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
}

.boton-2[b-qprs79yowd] {
    display: inline-flex;
    height: 2.7rem;
    bottom: 0.2rem;
    margin-left: 24px;
    align-items: center;
    background-color: var(--blanco);
    border: 0.0625rem solid;
    border-color: var(--primario);
    flex-direction: column;
    justify-content: center;
    gap: 0.4rem;
    position: relative;
    border-radius: 0.375rem;
    overflow: hidden;
    text-decoration: none;
}

.state-layer[b-qprs79yowd] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 0.5rem;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.label-text-3[b-qprs79yowd] {
    color: var(--primario);
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-small-font-style);
}

@media (max-width: 640.98px) {
    .top-row[b-qprs79yowd] {
        justify-content: space-between;
    }

    .top-row[b-qprs79yowd]  a, .top-row[b-qprs79yowd]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .sidebar[b-qprs79yowd] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-qprs79yowd] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-qprs79yowd]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-qprs79yowd], article[b-qprs79yowd] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-qprs79yowd] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss[b-qprs79yowd] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* Dropdown del usuario */
.user-dropdown[b-qprs79yowd] {
    position: relative;
    display: inline-block;
}

.user-name[b-qprs79yowd] {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 8px 16px;
    background-color: var(--primario);
    color: white;
    border-radius: 6px;
    transition: background-color 0.3s;
}

.user-name:hover[b-qprs79yowd] {
    background-color: #34953d;
}

.welcome-text[b-qprs79yowd] {
    margin-right: 4px;
    font-size: 14px;
}

.user-display-name[b-qprs79yowd] {
    font-weight: 600;
    font-size: 14px;
}

.user-dropdown .bi[b-qprs79yowd] {
    margin-left: 8px;
    font-size: 12px;
}

.user-dropdown-content[b-qprs79yowd] {
    display: none;
    position: absolute;
    right: 0;
    top: 100%;
    background-color: white;
    min-width: 180px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.1);
    z-index: 1000;
    border-radius: 4px;
    margin-top: 4px;
}

.user-dropdown-content.show[b-qprs79yowd] {
    display: block;
}

.user-dropdown-content a[b-qprs79yowd] {
    color: #333;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    transition: background-color 0.2s;
}

.user-dropdown-content a:hover[b-qprs79yowd] {
    background-color: #f5f5f5;
}

.user-dropdown-content a:not(:last-child)[b-qprs79yowd] {
    border-bottom: 1px solid #eee;
}

/* Estilos para favoritos */
.cart-item.removed-item[b-qprs79yowd] {
    opacity: 0.5;
    background-color: #f8f9fa;
    border-left: 3px solid #dc3545;
    transition: all 0.3s ease;
}

.removed-image[b-qprs79yowd] {
    filter: grayscale(100%);
    opacity: 0.6;
}

.removed-text[b-qprs79yowd] {
    color: #6c757d !important;
    text-decoration: line-through;
}

.removed-label[b-qprs79yowd] {
    font-size: 0.85em;
    color: #dc3545;
    font-weight: 600;
    margin-left: 8px;
    font-style: italic;
    text-decoration: none;
}

.quantity-control.disabled[b-qprs79yowd] {
    opacity: 0.5;
    pointer-events: none;
}

.restore-btn[b-qprs79yowd] {
    background: none;
    border: none;
    cursor: pointer;
    color: #28a745;
    font-size: 16px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
    transition: color 0.2s ease;
}

.restore-btn:hover[b-qprs79yowd] {
    color: #1e7e34;
    transform: scale(1.1);
}

.cart-item.removed-item:hover[b-qprs79yowd] {
    opacity: 0.7;
    background-color: #e9ecef;
}

/* ============================================================================
   BÚSQUEDA MEJORADA - DISEÑO COHERENTE CON MENÚ DE PRODUCTOS
   ============================================================================ */

/* Dropdown principal mejorado - OVERFLOW VISIBLE para que el panel de filtros salga */
[b-qprs79yowd] .search-dropdown-enhanced {
    display: none;
    position: absolute;
    top: calc(100% + 48px);
    left: 0;
    right: 0;
    background: white;
    border: none;
    border-radius: 0 0 15px 15px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    max-height: 80vh;
    overflow: visible; /* CAMBIADO: permite que el panel de filtros salga */
    z-index: 600;
    animation: slideDown-b-qprs79yowd 0.2s ease-out;
}

[b-qprs79yowd] .search-dropdown-enhanced.visible {
    display: block;
}

/* Wrapper para posicionamiento de filtros - OVERFLOW VISIBLE */
[b-qprs79yowd] .search-dropdown-content-wrapper {
    position: relative;
    overflow: visible; /* Permite que el panel salga hacia la derecha */
}

/* Contenedor de contenido - AQUÍ está el límite de altura */
[b-qprs79yowd] .search-content {
    display: flex;
    min-height: 300px;
    max-height: calc(80vh - 100px);
    overflow: hidden; /* El scroll individual está en cada componente interno */
}

/* Animaciones */
@keyframes slideDown-b-qprs79yowd {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes spin-b-qprs79yowd {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Loading state */
[b-qprs79yowd] .search-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    gap: 16px;
    background: #FFFFFF;
}

[b-qprs79yowd] .search-loading-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #F5F5F5;
    border-top: 3px solid #3CAA36;
    border-radius: 50%;
    animation: spin-b-qprs79yowd 1s linear infinite;
}

[b-qprs79yowd] .search-loading span {
    color: #2D2E2E;
    font-size: 14px;
    font-weight: 500;
    font-family: 'Nunito Sans', sans-serif;
}

/* Sidebar de categorías - Estilo menú productos */
[b-qprs79yowd] .search-sidebar {
    width: 224px;
    background: #FFFFFF;
    border-right: none;
    padding: 0;
    overflow-y: auto;
    flex-shrink: 0;
}

[b-qprs79yowd] .search-sidebar-title {
    background: #3CAA36;
    height: 40px;
    display: flex;
    align-items: center;
    padding-left: 29px;
    color: #FFFFFF;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.25px;
    flex-shrink: 0;
    margin: 0;
}

[b-qprs79yowd] .search-sidebar-categories {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: #FFFFFF;
}

[b-qprs79yowd] .search-category-btn {
    background: #FFFFFF;
    border: none;
    padding-left: 29px;
    padding-right: 12px;
    height: 45px;
    text-align: left;
    font-size: 14px;
    color: #2D2E2E;
    cursor: pointer;
    transition: all 0.2s ease;
    font-weight: 400;
    font-family: 'Nunito Sans', sans-serif;
    letter-spacing: 0.25px;
    border-bottom: 1px solid #E0E0E0;
    position: relative;
}

[b-qprs79yowd] .search-category-btn:last-child {
    border-bottom: none;
}

[b-qprs79yowd] .search-category-btn:hover {
    background: #F5F5F5;
}

[b-qprs79yowd] .search-category-btn.active {
    background: #F5F5F5;
    color: #2D2E2E;
    font-weight: 700;
}

[b-qprs79yowd] .search-category-btn.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #3CAA36;
}

/* Contenedor de productos - SIN PADDING SUPERIOR para que la barra verde quede pegada */
[b-qprs79yowd] .search-products-container {
    flex: 1;
    overflow-y: auto;
    padding: 0 24px 24px 24px; /* Sin padding superior */
    background: var(--Gris-10, #F5F5F5);
}

[b-qprs79yowd] .search-products-container.full-width {
    width: 100%;
    padding: 0 20px 20px 20px; /* Sin padding superior */
}

/* Header de categoría seleccionada */
[b-qprs79yowd] .search-category-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: #FFFFFF;
    border-radius: 8px;
    margin-bottom: 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

[b-qprs79yowd] .search-category-header h3 {
    font-size: 14px;
    font-weight: 700;
    color: #2D2E2E;
    margin: 0;
    font-family: 'Nunito Sans', sans-serif;
    letter-spacing: 0.25px;
}

[b-qprs79yowd] .search-show-all {
    background: none;
    border: none;
    color: #3CAA36;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: background 0.2s ease;
    font-family: 'Nunito Sans', sans-serif;
}

[b-qprs79yowd] .search-show-all:hover {
    background: rgba(60, 170, 54, 0.1);
    text-decoration: underline;
}

/* Grid de productos - Diseño vertical - CON PADDING SUPERIOR */
[b-qprs79yowd] .search-products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 20px;
    padding-top: 20px; /* Espacio entre la barra verde y el grid */
    padding-bottom: 8px;
}

@media (max-width: 768px) {
    [b-qprs79yowd] .search-products-grid {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        gap: 16px;
        padding-top: 16px; /* Menos padding en móvil */
    }
}

/* Tarjeta de producto VERTICAL - Diseño mejorado */
[b-qprs79yowd] .search-product-card-vertical {
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
    border: 1px solid #E8E8E8;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

[b-qprs79yowd] .search-product-card-vertical:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
    border-color: #D0D0D0;
}

/* Imagen del producto - Diseño mejorado */
[b-qprs79yowd] .search-product-image-vertical {
    width: 100%;
    height: 180px;
    flex-shrink: 0;
    background: linear-gradient(135deg, #FAFAFA 0%, #F5F5F5 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
    padding: 12px;
}

[b-qprs79yowd] .search-product-image-vertical img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

[b-qprs79yowd] .search-product-card-vertical:hover .search-product-image-vertical img {
    transform: scale(1.1);
}

/* Botón carrito superpuesto - Diseño mejorado */
[b-qprs79yowd] .search-cart-btn-overlay {
    position: absolute;
    bottom: 8px;
    right: 8px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    border: 2px solid #3CAA36;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 2;
    opacity: 0;
    transform: scale(0.7) translateY(10px);
    box-shadow: 0 4px 12px rgba(60, 170, 54, 0.2);
}

[b-qprs79yowd] .search-product-card-vertical:hover .search-cart-btn-overlay {
    opacity: 1;
    transform: scale(1) translateY(0);
}

[b-qprs79yowd] .search-cart-btn-overlay:hover {
    background: #3CAA36;
    color: white;
    transform: scale(1.1) translateY(0) !important;
    box-shadow: 0 6px 16px rgba(60, 170, 54, 0.35);
}

[b-qprs79yowd] .search-cart-btn-overlay:active {
    transform: scale(0.95) translateY(0) !important;
}

[b-qprs79yowd] .search-cart-btn-overlay svg {
    width: 18px;
    height: 18px;
    transition: color 0.3s ease;
}

/* Info del producto - Diseño mejorado */
[b-qprs79yowd] .search-product-info-vertical {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 12px 12px 12px;
    flex: 1;
    background: #FFFFFF;
}

[b-qprs79yowd] .search-product-name-vertical {
    font-size: 15px;
    font-weight: 500;
    color: #1A1A1A;
    margin: 0;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: 'Nunito Sans', sans-serif;
    min-height: 2.8em;
    letter-spacing: -0.01em;
}

/* Footer del producto vertical */
[b-qprs79yowd] .search-product-footer-vertical {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: auto;
}

[b-qprs79yowd] .search-product-prices {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}

[b-qprs79yowd] .search-product-price-vertical {
    font-size: 22px;
    font-weight: 700;
    color: #3CAA36;
    font-family: 'Nunito Sans', sans-serif;
    line-height: 1;
    letter-spacing: -0.02em;
}

/* Stock indicator vertical - Mejorado */
[b-qprs79yowd] .search-product-stock-vertical {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 0;
}

[b-qprs79yowd] .search-stock-indicator-vertical {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

[b-qprs79yowd] .search-stock-indicator-vertical.bg-green-500 {
    background-color: #4caf50;
    box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.15);
}

[b-qprs79yowd] .search-stock-indicator-vertical.bg-yellow-500 {
    background-color: #ff9800;
    box-shadow: 0 0 0 3px rgba(255, 152, 0, 0.15);
}

[b-qprs79yowd] .search-stock-indicator-vertical.bg-red-500 {
    background-color: #f44336;
    box-shadow: 0 0 0 3px rgba(244, 67, 54, 0.15);
}

[b-qprs79yowd] .search-stock-text-vertical {
    font-size: 11px;
    color: #666666;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Footer del dropdown */
[b-qprs79yowd] .search-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px;
    border-top: 1px solid #E0E0E0;
    background: #FFFFFF;
}

[b-qprs79yowd] .search-results-count {
    font-size: 13px;
    color: #757575;
    font-weight: 500;
    font-family: 'Nunito Sans', sans-serif;
}

[b-qprs79yowd] .search-view-all {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #3CAA36;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s ease;
    font-family: 'Nunito Sans', sans-serif;
    letter-spacing: 0.25px;
}

[b-qprs79yowd] .search-view-all:hover {
    color: #2d8b2a;
    text-decoration: underline;
}

/* Estado vacío */
[b-qprs79yowd] .search-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 40px;
    text-align: center;
    background: #FFFFFF;
}

[b-qprs79yowd] .search-empty-icon {
    margin-bottom: 20px;
    color: #BDBDBD;
}

[b-qprs79yowd] .search-empty-title {
    font-size: 18px;
    font-weight: 700;
    color: #2D2E2E;
    margin: 0 0 12px 0;
    font-family: 'Nunito Sans', sans-serif;
}

[b-qprs79yowd] .search-empty-text {
    font-size: 14px;
    color: #757575;
    line-height: 1.5;
    max-width: 400px;
    margin: 0;
    font-family: 'Nunito Sans', sans-serif;
}

/* Responsive */
@media (max-width: 768px) {
    [b-qprs79yowd] .search-dropdown-enhanced {
        max-height: 90vh;
        border-radius: 0 0 12px 12px;
    }

    [b-qprs79yowd] .search-content {
        flex-direction: column;
    }

    [b-qprs79yowd] .search-sidebar {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #E0E0E0;
        max-height: 150px;
    }

    [b-qprs79yowd] .search-sidebar-title {
        border-radius: 0;
    }

    [b-qprs79yowd] .search-sidebar-categories {
        flex-direction: row;
        overflow-x: auto;
        gap: 0;
        padding-bottom: 0;
    }

    [b-qprs79yowd] .search-category-btn {
        white-space: nowrap;
        flex-shrink: 0;
        min-width: 150px;
        border-bottom: none;
        border-right: 1px solid #E0E0E0;
    }

    [b-qprs79yowd] .search-category-btn:last-child {
        border-right: none;
    }

    [b-qprs79yowd] .search-category-btn.active::before {
        left: auto;
        right: 0;
        top: auto;
        bottom: 0;
        width: 100%;
        height: 3px;
    }

    [b-qprs79yowd] .search-products-container {
        padding: 0 16px 16px 16px; /* Sin padding superior */
    }

    [b-qprs79yowd] .search-products-grid {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        gap: 12px;
        padding-top: 12px; /* Menos padding en móvil */
    }

    [b-qprs79yowd] .search-product-image-vertical {
        height: 140px;
        padding: 8px;
    }

    [b-qprs79yowd] .search-product-info-vertical {
        padding: 10px 8px 8px 8px;
    }

    [b-qprs79yowd] .search-product-name-vertical {
        font-size: 13px;
        min-height: 2.6em;
    }

    [b-qprs79yowd] .search-product-price-vertical {
        font-size: 18px;
    }

    [b-qprs79yowd] .search-cart-btn-overlay {
        width: 36px;
        height: 36px;
    }

    [b-qprs79yowd] .search-cart-btn-overlay svg {
        width: 16px;
        height: 16px;
    }
}

/* ==============================================================================
   BOTÓN X DE LIMPIAR BÚSQUEDA
   ============================================================================== */

[b-qprs79yowd] .header-nuevo-busqueda-clear {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    color: #999;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s ease;
    z-index: 10;
    padding: 0;
}

[b-qprs79yowd] .header-nuevo-busqueda-clear:hover {
    color: #666;
    background: #f5f5f5;
}

[b-qprs79yowd] .header-nuevo-busqueda-clear:active {
    transform: translateY(-50%) scale(0.9);
}

/* Asegurar que el input tenga padding a la derecha para el botón X */
[b-qprs79yowd] .header-nuevo-busqueda-input {
    padding-right: 42px !important;
}

/* Responsive */
@media (max-width: 768px) {
    [b-qprs79yowd] .header-nuevo-busqueda-clear {
        width: 20px;
        height: 20px;
        right: 10px;
        font-size: 20px;
    }
}

/* ==============================================================================
   BARRA DE FILTROS DE BÚSQUEDA (STICKY) - SIN PADDING, ALTURA 40PX
   ============================================================================== */

[b-qprs79yowd] .search-filter-toolbar {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    background: #3CAA36;
    height: 40px; /* Igual que todas las barras verdes */
    display: flex;
    align-items: center;
    z-index: 10;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    margin: 0 -24px 0 -24px; /* Extender hasta los bordes */
    padding: 0; /* Sin padding */
    min-height: 40px;
    max-height: 40px;
}

[b-qprs79yowd] .search-filter-toolbar.sticky {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

[b-qprs79yowd] .search-filter-toolbar-content {
    width: 100%;
    height: 100%; /* Ocupar toda la altura */
    padding: 0 29px; /* Mismo padding lateral que las categorías */
    display: flex;
    align-items: center;
    justify-content: flex-end; /* Alinear a la derecha */
}

[b-qprs79yowd] .search-filter-toolbar-title {
    display: none; /* Ocultar título */
}

[b-qprs79yowd] .search-filter-toggle-btn {
    display: flex;
    align-items: center;
    gap: 8px; /* Menos gap para que quepa mejor */
    background: transparent;
    color: #FFFFFF;
    border: none;
    padding: 0;
    height: 40px; /* Altura exacta */
    cursor: pointer;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700; /* Bold como las otras barras */
    font-size: 14px; /* Mismo tamaño que la barra de categorías */
    line-height: 20px;
    letter-spacing: 0.25px;
    transition: opacity 0.2s ease;
}

[b-qprs79yowd] .search-filter-toggle-btn:hover {
    opacity: 0.85;
}

[b-qprs79yowd] .search-filter-toggle-btn:active {
    opacity: 1;
}

[b-qprs79yowd] .search-filter-toggle-btn i {
    font-size: 14px; /* Icono más pequeño */
    color: #FFFFFF;
}

[b-qprs79yowd] .search-filter-badge {
    background: #FFFFFF;
    color: #3CAA36;
    font-size: 11px; /* Más pequeño */
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 10px;
    min-width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* ==============================================================================
   PANEL LATERAL DE FILTROS DE BÚSQUEDA
   ============================================================================== */

/* Overlay externo - SIN opacidad para no tapar el modal de búsqueda */
[b-qprs79yowd] .search-filter-overlay-external {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: transparent; /* Transparente - no opacar */
    z-index: 19;
    pointer-events: auto; /* Permite cerrar al hacer clic */
}

/* Panel de filtros - Se abre DESDE DENTRO hacia FUERA (hacia la derecha) */
[b-qprs79yowd] .search-filter-panel {
    position: absolute;
    top: 0;
    left: 100%; /* Posicionado justo FUERA del borde derecho del dropdown */
    height: 100%; /* Ocupa todo el alto del dropdown */
    width: 320px;
    background: #FFFFFF;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
    transform: translateX(0); /* Posición natural (fuera del dropdown) */
    transition: all 0.3s ease;
    z-index: 20;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 0 0 15px 0; /* Esquina inferior derecha redondeada */
    visibility: hidden; /* Ocultar cuando está cerrado */
    opacity: 0; /* Transición suave */
    pointer-events: none; /* No interceptar clics cuando está cerrado */
}

[b-qprs79yowd] .search-filter-panel.open {
    visibility: visible; /* Mostrar cuando está abierto */
    opacity: 1; /* Transición suave */
    pointer-events: auto; /* Permitir interacción cuando está abierto */
}

[b-qprs79yowd] .search-filter-panel-header {
    background: #3CAA36;
    color: #FFFFFF;
    padding: 4px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

[b-qprs79yowd] .search-filter-panel-header h5 {
    margin: 0;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.3;
    letter-spacing: 0.15px;
}

[b-qprs79yowd] .search-filter-close-btn {
    background: transparent;
    border: none;
    color: #FFFFFF;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: background 0.2s ease;
}

[b-qprs79yowd] .search-filter-close-btn:hover {
    background: rgba(255, 255, 255, 0.2);
}

[b-qprs79yowd] .search-filter-panel-body {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
}

/* Sección de filtros */
[b-qprs79yowd] .search-filter-section {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #E0E0E0;
}

[b-qprs79yowd] .search-filter-section:last-of-type {
    border-bottom: none;
}

/* Checkbox option */
[b-qprs79yowd] .search-filter-checkbox-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    cursor: pointer;
    border-radius: 8px;
    transition: background 0.2s ease;
    user-select: none;
    margin-bottom: 8px;
}

[b-qprs79yowd] .search-filter-checkbox-option:hover {
    background: #F5F5F5;
}

[b-qprs79yowd] .search-filter-checkbox-option input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    flex-shrink: 0;
    accent-color: #3CAA36;
}

[b-qprs79yowd] .search-filter-checkbox-option label {
    cursor: pointer;
    font-size: 14px;
    color: #2D2E2E;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 500;
    margin: 0;
    flex: 1;
}

/* Header de filtro desplegable */
[b-qprs79yowd] .search-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    cursor: pointer;
    border-radius: 8px;
    transition: background 0.2s ease;
    user-select: none;
}

[b-qprs79yowd] .search-filter-header:hover {
    background: #F5F5F5;
}

[b-qprs79yowd] .search-filter-label {
    font-size: 14px;
    font-weight: 700;
    color: #2D2E2E;
    font-family: 'Nunito Sans', sans-serif;
    letter-spacing: 0.15px;
}

[b-qprs79yowd] .search-filter-current {
    font-size: 12px;
    color: #757575;
    font-weight: 500;
    margin-left: 8px;
}

[b-qprs79yowd] .search-filter-header i {
    font-size: 16px;
    color: #757575;
    transition: transform 0.2s ease;
}

/* Contenido del filtro */
[b-qprs79yowd] .search-filter-content {
    margin-top: 12px;
    padding: 0 12px;
}

/* Rango de precio */
[b-qprs79yowd] .search-price-range-container {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-qprs79yowd] .search-price-inputs {
    display: flex;
    align-items: center;
    gap: 12px;
}

[b-qprs79yowd] .search-price-input-group {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

[b-qprs79yowd] .search-price-input-group label {
    font-size: 12px;
    font-weight: 600;
    color: #757575;
    font-family: 'Nunito Sans', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-qprs79yowd] .search-price-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #2D2E2E;
    font-family: 'Nunito Sans', sans-serif;
    transition: border-color 0.2s ease;
}

[b-qprs79yowd] .search-price-input:focus {
    outline: none;
    border-color: #3CAA36;
    box-shadow: 0 0 0 3px rgba(60, 170, 54, 0.1);
}

[b-qprs79yowd] .search-price-separator {
    color: #757575;
    font-size: 16px;
    font-weight: 600;
    align-self: flex-end;
    padding-bottom: 10px;
}

/* Botones de acción */
[b-qprs79yowd] .search-apply-filters-btn,
[b-qprs79yowd] .search-clear-filters-btn {
    width: 100%;
    padding: 14px 20px;
    border: none;
    border-radius: 8px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
}

[b-qprs79yowd] .search-apply-filters-btn {
    background: #3CAA36;
    color: white;
}

[b-qprs79yowd] .search-apply-filters-btn:hover {
    background: #2d8b2a;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(60, 170, 54, 0.3);
}

[b-qprs79yowd] .search-clear-filters-btn {
    background: transparent;
    color: #757575;
    border: 1px solid #E0E0E0;
}

[b-qprs79yowd] .search-clear-filters-btn:hover {
    background: #F5F5F5;
    color: #2D2E2E;
    border-color: #D0D0D0;
}

/* Lista de opciones de filtro (marcas, categorías) */
[b-qprs79yowd] .search-filter-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 250px;
    overflow-y: auto;
    padding-right: 4px;
}

[b-qprs79yowd] .search-filter-list::-webkit-scrollbar {
    width: 6px;
}

[b-qprs79yowd] .search-filter-list::-webkit-scrollbar-track {
    background: #F5F5F5;
    border-radius: 3px;
}

[b-qprs79yowd] .search-filter-list::-webkit-scrollbar-thumb {
    background: #D0D0D0;
    border-radius: 3px;
}

[b-qprs79yowd] .search-filter-list::-webkit-scrollbar-thumb:hover {
    background: #BDBDBD;
}

/* Contador de productos en cada opción */
[b-qprs79yowd] .search-filter-count {
    color: #999;
    font-size: 12px;
    font-weight: 400;
    margin-left: 4px;
}

/* Responsive */
@media (max-width: 768px) {
    [b-qprs79yowd] .search-filter-toolbar {
        height: 44px;
        margin: 0 -16px 0 -16px; /* Ajuste para móvil */
    }
    
    [b-qprs79yowd] .search-filter-toolbar-content {
        padding: 0 16px;
    }
    
    [b-qprs79yowd] .search-filter-toolbar-title {
        font-size: 13px;
    }
    
    [b-qprs79yowd] .search-filter-toggle-btn {
        padding: 6px 12px;
        font-size: 12px;
    }
    
    [b-qprs79yowd] .search-filter-panel {
        width: 100%;
        max-width: 320px;
    }
    
    [b-qprs79yowd] .search-filter-panel-header h5 {
        font-size: 15px;
    }
    
    [b-qprs79yowd] .search-filter-panel-body {
        padding: 16px;
    }
}
/* _content/PMCWEB/Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-bg1nnwwy4o] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-bg1nnwwy4o] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-bg1nnwwy4o] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-bg1nnwwy4o] {
    font-size: 1.1rem;
}

.bi[b-bg1nnwwy4o] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-bg1nnwwy4o] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-bg1nnwwy4o] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-bg1nnwwy4o] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-bg1nnwwy4o] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-bg1nnwwy4o] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-bg1nnwwy4o] {
        padding-bottom: 1rem;
    }

    .nav-item[b-bg1nnwwy4o]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-bg1nnwwy4o]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-bg1nnwwy4o]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-bg1nnwwy4o] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-bg1nnwwy4o] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-bg1nnwwy4o] {
        display: none;
    }

    .nav-scrollable[b-bg1nnwwy4o] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* _content/PMCWEB/Components/Pages/AcercaPMC.razor.rz.scp.css */
*[b-x7xr5v1fsv] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body[b-x7xr5v1fsv] {
    margin: 0;
    font-family: "Nunito Sans", sans-serif;
    background: #ffffff;
    color: #000000;
}

.container[b-x7xr5v1fsv] {
    max-width: 1920px;
    max-height: 3840px;
    margin: 0px;
}

section[b-x7xr5v1fsv] {
    padding: 0px 115px 0px 115px;
}

.displayFlex[b-x7xr5v1fsv] {
    display: flex;
}

.displayFlexPadding[b-x7xr5v1fsv]{
    display: flex;
    padding: 0 36px 0 36px;
    max-width: 550px;
    max-height: 160px;

}

.displayFlexPaddingTwo[b-x7xr5v1fsv] {
    display: flex;
    padding: 0 36px 0 36px;
}

.displayFlexIcons[b-x7xr5v1fsv] {
    display: flex;
    justify-content: space-between;
}

.displayFlexIconsTwo[b-x7xr5v1fsv] {
    display: flex;
    max-width: 274px;
    max-height: 90px;
}

.actualidad[b-x7xr5v1fsv] {
    display: flex;
    margin-top: 60px;
    gap: 60px;
}


.textOffer[b-x7xr5v1fsv] {
    margin-left: 40px;
}

.pText[b-x7xr5v1fsv] {
    font-weight: 300;
    font-size: 18px;
    line-height: 100%;
}

span[b-x7xr5v1fsv] {
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

.pTextOffer[b-x7xr5v1fsv] {
    border-left: 4px solid #A0CD9E;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 16px;
    margin: 40px 0 0px 0;
    line-height: 22px;
    letter-spacing: 0%;
    color: #2D2E2E;
    padding-left: 28px;
}

h2[b-x7xr5v1fsv] {
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    margin-bottom: 32px;

}

h3[b-x7xr5v1fsv] {
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #2D2E2E;
}

h4[b-x7xr5v1fsv] {
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    margin-left: 20px;
    padding-top: 35.5px;
}

hr[b-x7xr5v1fsv] {
    width: 503px;
    background-color: #ABABAB;
    border: 1px;
}

p[b-x7xr5v1fsv] {
    font-weight: 300;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #323332;
}

strong[b-x7xr5v1fsv] {
    font-weight: 700;
}

.toOffer[b-x7xr5v1fsv] {
    display: flex;
    margin-bottom: 61px;
    margin-top: 60px;
    justify-content: space-between;
}

.toOfferTwo[b-x7xr5v1fsv] {
    display: flex;
    margin-bottom: 120px;
    justify-content: space-between;
}


.fleet[b-x7xr5v1fsv] {
    display: flex;
    margin-top: 60px;
    justify-content: space-between;
    padding-bottom: 120px;
    gap: 40px;
}

.ourGoal[b-x7xr5v1fsv] {
    display: flex;
    justify-content: space-between;
    padding-bottom: 60px;
}

.ourGoalTwo[b-x7xr5v1fsv] {
    padding-top: 60px;
    display: flex;
    justify-content: space-between;
}

.sectionOurGoal[b-x7xr5v1fsv] {
    padding-top: 120px;
    background-color: #525551;
    color: #ffffff;
    padding-bottom: 120px;
}

.textOurGoal[b-x7xr5v1fsv] {
    width: 815px;
    height: 408px;
    max-width: 815px;
    max-height: 408px;
}

.pOurGoal[b-x7xr5v1fsv] {
    font-family: "Nunito Sans", sans-serif;
    color: white;
    font-weight: 250;
    font-size: 18px;      
    line-height: 145%;
    letter-spacing: 10%;
    }

.containerTeam[b-x7xr5v1fsv] {
    display: flex;
    width: 1690px;
    height: 394px;
    max-width: 1690px;
    max-height: 394px;
    margin-bottom: 60px;
    justify-content: space-between;
}

.team[b-x7xr5v1fsv] {
    display: flex;
    justify-content: space-between;
    margin: 60px 0 32px 0;
}

.containerTeamTwo[b-x7xr5v1fsv] {
    width: 1063px;
    max-width: 1063px;
    height: 394px;
    max-height: 394px;
    overflow: hidden;
}

.othersImages[b-x7xr5v1fsv] {
    width: 404px;
    max-width: 404px;
    height: 269px;
    max-height: 269px;
    border-radius: 8px;
}

.firstImage[b-x7xr5v1fsv] {
    width: 567px;
    max-wifth: 567px;
    height: 394px;
    max-height: 394px;
    border-radius: 8px;
}

.imgFactory[b-x7xr5v1fsv]{
    width: 815px;
    height: 308px;
}

.imgFactory img[b-x7xr5v1fsv]{
    width: 100%;
    height: auto;
}

.hero[b-x7xr5v1fsv] {
    display: flex; /* Activamos Flexbox */
    align-items: center; /* Centra verticalmente los elementos */
    justify-content: space-between; /* Espacio entre la parte de texto y el recuadro */
    gap: 2rem; /* Espacio horizontal entre columnas */
    padding: 2rem; /* Márgenes internos opcionales */
}

/* Columna de texto */
.hero-text[b-x7xr5v1fsv] {
    flex: 1; /* Que ocupe el ancho disponible */
}

/* Columna de imagen o recuadro */
.hero-image[b-x7xr5v1fsv] {
    width: 815px; /* Ancho fijo o ajustado */
    height: 308px; /* Alto fijo o ajustado */
    border-radius: 10px;
    background-color: #ccc; /* Simula un recuadro gris */
    /* Podrías usar background-image si quisieras una imagen */
}

.hero2[b-x7xr5v1fsv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: 2rem;
    background-color: red;
}

/* Bloque texto + imagen */
.current-section[b-x7xr5v1fsv] {
    display: flex;
    gap: 2rem; /* Espacio entre columnas */
    padding: 2rem;
}

    .current-section .left-part[b-x7xr5v1fsv] {
        flex: 1; /* Ocupa todo el espacio disponible */
    }

    .current-section .right-part[b-x7xr5v1fsv] {
        width: 400px; /* Ajusta según necesites */
    }

        .current-section .right-part img[b-x7xr5v1fsv] {
            width: 100%;
            height: auto;
            display: block;
        }

/* Cuadrícula de 4 columnas */
.info-cards[b-x7xr5v1fsv] {
    display: flex;
    flex-wrap: wrap; /* Permite que se envuelvan si no caben */
    gap: 2rem;
    padding: 2rem;
}

.card[b-x7xr5v1fsv] {
    flex: 1 1 calc(25% - 2rem); /* Para tener 4 tarjetas por fila, ajusta según el gap */
}

    .card img[b-x7xr5v1fsv] {
        width: 100%;
        height: auto;
        display: block;
        margin-bottom: 1rem;
    }

/* Ajustes responsivos (ejemplo) */
@media (max-width: 768px) {
    .current-section[b-x7xr5v1fsv] {
        flex-direction: column; /* Apila el texto e imagen */
    }

    .info-cards[b-x7xr5v1fsv] {
        grid-template-columns: repeat(2, 1fr); /* 2 columnas en pantallas medianas */
    }
}

@media (max-width: 480px) {
    .info-cards[b-x7xr5v1fsv] {
        grid-template-columns: 1fr; /* 1 columna en pantallas pequeñas */
    }
}


/* _content/PMCWEB/Components/Pages/ArticuloDetalle.razor.rz.scp.css */
/* =================================
   BREADCRUMBS
   ================================= */

.breadcrumb-container[b-mkz7nc7p1i] {
    font-size: 14px;
    margin-left: 2%;
}

.breadcrumb-custom[b-mkz7nc7p1i] {
    display: flex;
    align-items: center;
    padding: 10px 15px;
}

.breadcrumb-home-arrow[b-mkz7nc7p1i] {
    width: 20px;
    height: 20px;
    transform: rotate(180deg);
    margin-right: 10px;
    cursor: pointer;
    transition: transform 0.2s ease;
    filter: brightness(0.3);
}

.breadcrumb[b-mkz7nc7p1i] {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    list-style: none;
    background-color: transparent;
}

.breadcrumb-item[b-mkz7nc7p1i] {
    display: flex;
    align-items: center;
}

    .breadcrumb-item + .breadcrumb-item[b-mkz7nc7p1i]::before {
        content: "/";
        color: #6c757d;
        font-weight: 500;
    }

    .breadcrumb-item a[b-mkz7nc7p1i] {
        color: #000000 !important;
        text-decoration: none;
        font-weight: 400;
        transition: all 0.2s ease-in-out;
        border-radius: 3px;
    }

        /* Efecto hover para los enlaces */
        .breadcrumb-item a:hover[b-mkz7nc7p1i] {
            color: #333333 !important;
            text-decoration: none;
            transform: translateY(-1px) scale(1.05);
        }

    /* Elemento activo (último) - Negro resaltado */
    .breadcrumb-item.active[b-mkz7nc7p1i] {
        color: #000000;
        font-weight: 700;
        font-size: 1.02em;
        text-shadow: 0.5px 0.5px 0px rgba(0,0,0,0.1);
    }


/* =================================
   BADGES
   ================================= */
/* Contenedor principal de badges */
.product-badges[b-mkz7nc7p1i] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: 8%;
    gap: 8px;
    margin-bottom: 0.5rem;
    position: relative;
}

    /* Badge normal */
    .product-badges .badge[b-mkz7nc7p1i] {
        background-color: #FFFFFF;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
        color: black;
        font-size: 11px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        padding: 4px 8px;
        border: none;
        border-radius: 2px;
        line-height: 1;
    }

        /* Badge de referencia */
        .product-badges .badge.referencia[b-mkz7nc7p1i] {
            margin-right: auto;
            justify-content: flex-start;
            padding-left: 0;
            margin-top: 1%;
            font-size: 14px;
            font-weight: 700;
            box-shadow: none;
            border: none;
            background: transparent; /* si quieres sin fondo */
            text-transform: none; /* por si no quieres mayúsculas */
            letter-spacing: normal;
        }


        /* Badge OFERTA - rojo pero más suave */
        .product-badges .badge.bg-danger[b-mkz7nc7p1i] {
            background-color: #dc2626 !important;
            color: white;
        }

        /* Badges secundarios - gris más claro */
        .product-badges .badge.bg-secondary[b-mkz7nc7p1i] {
            background-color: #6b7280 !important;
            color: white;
        }

        /* Badge ECO - verde más suave */
        .product-badges .badge.bg-success[b-mkz7nc7p1i] {
            background-color: #059669 !important;
            color: white;
        }

    /* Botón favorito */
    .product-badges .favorite-icon[b-mkz7nc7p1i] {
        margin-left: 4px;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
        transition: all 0.2s ease;
        border: none !important;
        background: none !important;
        box-shadow: none !important;
    }

        .product-badges .favorite-icon:hover[b-mkz7nc7p1i] {
            transform: scale(1.1);
        }

        .product-badges .favorite-icon:focus[b-mkz7nc7p1i] {
            outline: none;
            box-shadow: none !important;
        }

        /* Estados del corazón */
        .product-badges .favorite-icon.text-danger[b-mkz7nc7p1i] {
            color: #dc2626 !important;
        }

        .product-badges .favorite-icon.text-muted[b-mkz7nc7p1i] {
            color: #6b7280 !important;
        }

            .product-badges .favorite-icon.text-muted:hover[b-mkz7nc7p1i] {
                color: #dc2626 !important;
            }

    /* Spinner para loading */
    .product-badges .spinner-border-sm[b-mkz7nc7p1i] {
        width: 14px;
        height: 14px;
        border-width: 1px;
    }

/* Responsivo - en móviles más compacto */
@media (max-width: 576px) {
    .product-badges[b-mkz7nc7p1i] {
        gap: 6px;
    }

        .product-badges .badge[b-mkz7nc7p1i] {
            font-size: 10px;
            padding: 3px 6px;
        }
}


/* =================================
   GALERÍA DE IMÁGENES CON SCROLL
   ================================= */

.product-image-gallery[b-mkz7nc7p1i] {
    position: relative;
    width: 100%;
}

/* Imagen principal más grande */
.product-main-image-large[b-mkz7nc7p1i] {
    position: relative;
    width: 100%;
    height: 550px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    margin-bottom: 20px;
    overflow: hidden; /* Prevenir scroll interno */
    user-select: none; /* Prevenir selección de texto */
}

.main-product-img[b-mkz7nc7p1i] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: all 0.4s ease;
    filter: brightness(1);
}

    .main-product-img:hover[b-mkz7nc7p1i] {
        transform: scale(1.02);
    }

/* Barra de scroll vertical continua */
.vertical-scroll-bar[b-mkz7nc7p1i] {
    position: absolute;
    right: 15px;
    top: 10%;
    height: 80%;
    width: 3px;
    z-index: 10;
    opacity: 0.7;
    transition: opacity 0.3s ease;
}

    .vertical-scroll-bar:hover[b-mkz7nc7p1i] {
        opacity: 1;
    }

.product-main-image-large:hover .vertical-scroll-bar[b-mkz7nc7p1i] {
    opacity: 1;
}

.scroll-track[b-mkz7nc7p1i] {
    width: 100%;
    height: 100%;
    background: #e0e0e0;
    border-radius: 2px;
    position: relative;
    cursor: pointer;
    transition: background-color 0.2s ease;
    pointer-events: auto !important;
}

    .scroll-track:hover[b-mkz7nc7p1i] {
        background: #d0d0d0;
    }

.scroll-thumb[b-mkz7nc7p1i] {
    position: absolute;
    width: 3px;
    background: #333;
    border-radius: 2px;
    cursor: grab;
    min-height: 25px;
    left: 0;
    z-index: 15;
    pointer-events: auto !important;
    user-select: none;
    touch-action: none;
    transition: background-color 0.15s ease;
}

    .scroll-thumb:hover[b-mkz7nc7p1i] {
        background: #555;
        cursor: grab;
    }

    .scroll-thumb:active[b-mkz7nc7p1i] {
        cursor: grabbing !important;
        background: #111;
    }

/* Miniaturas con scroll horizontal */
.thumbnails-with-scroll[b-mkz7nc7p1i] {
    display: flex;
    gap: 12px;
    justify-content: flex-start;
    margin-top: 15px;
    overflow-x: auto;
    padding: 8px 0;
    scrollbar-width: thin;
    scrollbar-color: #ccc #f1f1f1;
}

    .thumbnails-with-scroll[b-mkz7nc7p1i]::-webkit-scrollbar {
        height: 8px;
    }

    .thumbnails-with-scroll[b-mkz7nc7p1i]::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 4px;
    }

    .thumbnails-with-scroll[b-mkz7nc7p1i]::-webkit-scrollbar-thumb {
        background: #ccc;
        border-radius: 4px;
    }

        .thumbnails-with-scroll[b-mkz7nc7p1i]::-webkit-scrollbar-thumb:hover {
            background: #999;
        }

.thumb-item[b-mkz7nc7p1i] {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
    background: #f8f9fa;
    border-radius: 8px;
    padding: 8px;
    opacity: 0.6;
    filter: grayscale(100%);
}

    .thumb-item:hover[b-mkz7nc7p1i] {
        opacity: 0.8;
        transform: translateY(-2px);
        filter: grayscale(50%);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    .thumb-item.selected[b-mkz7nc7p1i] {
        opacity: 1;
        filter: grayscale(0%);
        background: #fff;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        transform: translateY(-3px);
    }

    .thumb-item img[b-mkz7nc7p1i] {
        width: 100%;
        height: 100%;
        object-fit: contain;
        border-radius: 4px;
    }

/* Navegación de miniaturas */
.thumbnails-navigation-container[b-mkz7nc7p1i] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
}

.thumbnails-limited[b-mkz7nc7p1i] {
    display: flex;
    gap: 12px;
    justify-content: center;
    overflow: hidden;
}

.thumb-nav-btn[b-mkz7nc7p1i] {
    width: 35px;
    height: 35px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

    .thumb-nav-btn:hover:not(:disabled)[b-mkz7nc7p1i] {
        background: #f8f9fa;
        border-color: #007bff;
        color: #007bff;
    }

    .thumb-nav-btn:disabled[b-mkz7nc7p1i] {
        opacity: 0.3;
        cursor: not-allowed;
    }

    .thumb-nav-btn i[b-mkz7nc7p1i] {
        font-size: 14px;
    }

/* Opciones de color minimalistas */
.minimal-color-options[b-mkz7nc7p1i] {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 12px;
}

.minimal-color-option[b-mkz7nc7p1i] {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    background: #f8f9fa;
    border-radius: 6px;
    padding: 4px;
    opacity: 0.6;
    filter: grayscale(100%);
}

    .minimal-color-option:hover[b-mkz7nc7p1i] {
        opacity: 0.8;
        transform: scale(1.05);
        filter: grayscale(50%);
    }

    .minimal-color-option.selected[b-mkz7nc7p1i] {
        opacity: 1;
        filter: grayscale(0%);
        background: #fff;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
        transform: scale(1.1);
    }

    .minimal-color-option img[b-mkz7nc7p1i] {
        width: 100%;
        height: 100%;
        object-fit: contain;
        border-radius: 2px;
    }

/* Responsive para galería con scroll */
@media (max-width: 768px) {
    .product-main-image-large[b-mkz7nc7p1i] {
        height: 400px;
        margin-bottom: 15px;
    }

    .vertical-scroll-bar[b-mkz7nc7p1i] {
        right: 10px;
        width: 5px;
    }

    .thumbnails-with-scroll[b-mkz7nc7p1i] {
        gap: 8px;
        margin-top: 12px;
    }

    .thumb-item[b-mkz7nc7p1i] {
        width: 60px;
        height: 60px;
        padding: 6px;
    }

    .minimal-color-option[b-mkz7nc7p1i] {
        width: 45px;
        height: 45px;
    }
}

@media (max-width: 480px) {
    .product-main-image-large[b-mkz7nc7p1i] {
        height: 300px;
        margin-bottom: 12px;
    }

    .vertical-scroll-bar[b-mkz7nc7p1i] {
        right: 8px;
        width: 5px;
    }

    .thumbnails-with-scroll[b-mkz7nc7p1i] {
        gap: 6px;
    }

    .thumb-item[b-mkz7nc7p1i] {
        width: 50px;
        height: 50px;
        padding: 4px;
    }

    .minimal-color-option[b-mkz7nc7p1i] {
        width: 40px;
        height: 40px;
    }
}

/* =================================
   ESTILOS ORIGINALES DEL PRODUCTO
   ================================= */

.product-title[b-mkz7nc7p1i] {
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    line-height: 1.3;
    color: #2c3e50;
}

.favorite-icon[b-mkz7nc7p1i] {
    cursor: pointer;
    transition: color 0.2s;
}

    .favorite-icon:hover[b-mkz7nc7p1i] {
        color: #dc3545;
    }

.product-price[b-mkz7nc7p1i] {
    padding: 0.8rem 0;
    border-bottom: 1px solid #eee;
    display: flex;
    align-items: center;
}

.current-price[b-mkz7nc7p1i] {
    font-size: 1.6rem;
    font-weight: 800;
    color: #dc3545;
    margin-right: 15px;
    display: inline-block;
    margin-bottom: 0;
}

.original-price[b-mkz7nc7p1i] {
    font-size: 1.2rem;
    color: #95a5a6;
    text-decoration: line-through;
    font-weight: 700;
}

.countdown-timer[b-mkz7nc7p1i] {
    display: flex;
    gap: 20px;
    margin-top: 20px;
    justify-content: flex-start;
}

.countdown-block[b-mkz7nc7p1i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 60px;
    background: #f8f9fa;
    border-radius: 8px;
    padding: 12px 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.countdown-value[b-mkz7nc7p1i] {
    font-size: 1.8rem;
    font-weight: 800;
    color: #2c3e50;
    background: transparent;
    padding: 0;
    min-width: auto;
    text-align: center;
    line-height: 1;
}

.countdown-label[b-mkz7nc7p1i] {
    font-size: 0.75rem;
    margin-top: 8px;
    color: #7f8c8d;
    text-align: center;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Estilos de color ya definidos arriba como minimal-color-options */

.product[b-mkz7nc7p1i] {
    width: 46%;
    padding-left: 5%;
}

.product-description[b-mkz7nc7p1i] {
    margin-top: 2rem;
    padding: 1.2rem 0;
}

    .product-description p[b-mkz7nc7p1i] {
        font-size: 1rem;
        line-height: 1.6;
        color: #5a6c7d;
        margin: 0;
    }

.product-specs[b-mkz7nc7p1i] {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.spec-item[b-mkz7nc7p1i] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #f0f0f0;
}

    .spec-item h6[b-mkz7nc7p1i] {
        font-weight: 600;
        color: #2c3e50;
        margin-top: 2rem;
        margin-bottom: 0.8rem;
        font-size: 1.6rem;
    }

    .spec-item p[b-mkz7nc7p1i] {
        color: #7f8c8d;
        margin: 0;
        font-size: 0.95rem;
    }

.product-actions[b-mkz7nc7p1i] {
    margin-top: 2.5rem;
    margin-bottom: 2rem;
}

.offer-countdown[b-mkz7nc7p1i] {
    margin-top: 3rem;
    margin-bottom: 2rem;
    border-radius: 12px;
}

    .offer-countdown p[b-mkz7nc7p1i] {
        font-size: 1.5rem;
        font-weight: 600;
        color: #2c3e50;
        margin-bottom: 1rem;
    }

.product-badges[b-mkz7nc7p1i] {
    margin-bottom: 1.5rem;
    margin-right: 1%;
}

    .product-badges .badge[b-mkz7nc7p1i] {
        font-size: 0.8rem;
        font-weight: 600;
        padding: 0.5rem 1rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

.product-stock[b-mkz7nc7p1i] {
    margin-top: 2rem;
    padding: 1rem;
    border-radius: 8px;
    border-top: 1px solid #f0f0f0;
}

.productos-medidas-title[b-mkz7nc7p1i] {
    font-size: 2rem;
}

.productos-medidas-datos[b-mkz7nc7p1i] {
    font-size: 14px;
}

.product-stock span[b-mkz7nc7p1i] {
    font-weight: 500;
    color: #2c3e50;
}

.rating[b-mkz7nc7p1i] {
    color: #f39c12;
}

    .rating span[b-mkz7nc7p1i] {
        color: #7f8c8d;
        font-size: 0.9rem;
        margin-left: 0.5rem;
    }

.container-fluid[b-mkz7nc7p1i] {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.row[b-mkz7nc7p1i] {
    align-items: flex-start;
}

.col-md-6[b-mkz7nc7p1i] {
    padding: 0 2rem;
}

/* Contenedor de botones */
.buttons-container[b-mkz7nc7p1i] {
    display: flex;
    gap: 16px;
    width: 100%;
    margin-top: 1.5rem;
}

/* Botón Añadir (verde sólido) */
.btn-add-to-cart[b-mkz7nc7p1i] {
    background-color: #3CAA36;
    color: white;
    font-weight: 600;
    padding: 14px 30px;
    border-radius: 8px;
    font-size: 16px;
    flex: 1;
    transition: all 0.3s ease;
    border: 2px solid #3CAA36;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: "Nunito Sans", Helvetica;
}

    .btn-add-to-cart:hover:not(:disabled)[b-mkz7nc7p1i] {
        background-color: #2d8a2b;
        border-color: #2d8a2b;
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(60, 170, 54, 0.3);
    }

    .btn-add-to-cart:disabled[b-mkz7nc7p1i] {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* Botón Comprar (borde verde, fondo blanco) */
.btn-buy-now[b-mkz7nc7p1i] {
    background-color: #FFFFFF;
    color: #3CAA36;
    font-weight: 600;
    padding: 14px 30px;
    border-radius: 8px;
    font-size: 16px;
    flex: 1;
    transition: all 0.3s ease;
    border: 2px solid #3CAA36;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: "Nunito Sans", Helvetica;
}

    .btn-buy-now:hover:not(:disabled)[b-mkz7nc7p1i] {
        background-color: #f0f9ef;
        border-color: #2d8a2b;
        color: #2d8a2b;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(60, 170, 54, 0.2);
    }

    .btn-buy-now:disabled[b-mkz7nc7p1i] {
        opacity: 0.6;
        cursor: not-allowed;
    }

.color-dot[b-mkz7nc7p1i] {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
    border: 1px solid #ddd;
}

    .color-dot.active[b-mkz7nc7p1i] {
        border: 2px solid #000;
    }

.product-tabs .nav-link[b-mkz7nc7p1i] {
    color: #495057;
    font-weight: 500;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid transparent;
}

    .product-tabs .nav-link.active[b-mkz7nc7p1i] {
        color: #2c3e50;
        font-weight: 600;
        border-bottom-color: #2c3e50;
    }

    .product-tabs .nav-link:not(.active):hover[b-mkz7nc7p1i] {
        border-bottom-color: #ddd;
    }

.product-tabs .tab-content[b-mkz7nc7p1i] {
    background: #fff;
}

.related-products-slider[b-mkz7nc7p1i] {
    display: flex;
    overflow-x: auto;
    padding-bottom: 20px;
    gap: 15px;
}

    .related-products-slider .product-item[b-mkz7nc7p1i] {
        width: 220px;
        min-width: 220px;
        border: 1px solid #eee;
        border-radius: 4px;
        padding: 15px;
        position: relative;
    }

    .related-products-slider .product-image[b-mkz7nc7p1i] {
        height: 150px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 10px;
    }

        .related-products-slider .product-image img[b-mkz7nc7p1i] {
            max-height: 100%;
            max-width: 100%;
            object-fit: contain;
        }

/* =================================
   PRODUCTOS RELACIONADOS 
   ================================= */

/* Variables CSS para productos relacionados */
:root[b-mkz7nc7p1i] {
    --negro: rgba(33, 33, 33, 1);
    --blanco: rgba(255, 255, 255, 1);
    --primario: rgba(60, 170, 54, 1);
    --secundario: rgba(107, 152, 156, 1);
    --terciario: rgba(133, 149, 126, 1);
    --alternativo: rgba(253, 214, 35, 1);
    --alternativo-oscuro: rgba(236, 198, 27, 1);
    --gris-10: rgba(245, 245, 245, 1);
    --gris-20: rgba(238, 238, 238, 1);
    --gris-30: rgba(224, 224, 224, 1);
    --gris-40: rgba(189, 189, 189, 1);
    --gris-50: rgba(158, 158, 158, 1);
    --gris-60: rgba(117, 117, 117, 1);
    --oferta-50: rgba(255, 84, 73, 1);
    --oferta-60: rgba(222, 55, 48, 1);
    --dark-green-buttons: rgba(58, 79, 57, 1);
    --black-fonts-headings: rgba(45, 46, 46, 1);
}

/* Section: Home Body 3 - Adaptado para productos relacionados */
.home-body-3[b-mkz7nc7p1i] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 50px;
    padding: 60px 0 80px;
    position: relative;
    width: 100%;
    background-color: var(--blanco);
    margin-top: 3rem;
}

.frame-5[b-mkz7nc7p1i] {
    position: relative;
    width: 503px;
    height: 75px;
}

.title_relacionados[b-mkz7nc7p1i] {
    position: absolute;
    top: -1px;
    left: 8%;
    font-family: "Nunito Sans", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 40px;
    letter-spacing: 0;
    line-height: normal;
}

.vector-3[b-mkz7nc7p1i] {
    position: absolute;
    width: 504px;
    height: 1px;
    top: 74px;
    left: 0;
    object-fit: cover;
}

.frame-6[b-mkz7nc7p1i] {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding: 10px 0px;
    position: relative;
    margin-top: 50px;
}

.flechas-sliders[b-mkz7nc7p1i] {
    position: relative;
    width: 24px;
    height: 24px;
    cursor: pointer;
    transition: transform 0.3s ease;
    margin: 1%;
}

    .flechas-sliders:hover[b-mkz7nc7p1i] {
        transform: scale(1.1);
    }

.frame-7[b-mkz7nc7p1i] {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

/* Tarjetas de producto */
.card-producto[b-mkz7nc7p1i],
.card-producto-2[b-mkz7nc7p1i],
.card-producto-3[b-mkz7nc7p1i] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    padding: 0px 0px 10px 20px;
    position: relative;
    flex: 0 0 auto;
    margin-top: -1.00px;
    margin-bottom: -1.00px;
    border-left-width: 1px;
    border-left-style: solid;
    border-color: var(--gris-30);
    cursor: pointer;
    transition: transform 0.3s ease;
}

    .card-producto:hover[b-mkz7nc7p1i],
    .card-producto-2:hover[b-mkz7nc7p1i],
    .card-producto-3:hover[b-mkz7nc7p1i] {
        transform: translateY(-5px);
    }

.card-producto[b-mkz7nc7p1i] {
    margin-left: -1.00px;
}

.card-producto-3[b-mkz7nc7p1i] {
    margin-right: -1.00px;
}

.frame-wrapper[b-mkz7nc7p1i],
.frame-9[b-mkz7nc7p1i],
.frame-10[b-mkz7nc7p1i],
.frame-11[b-mkz7nc7p1i],
.frame-12[b-mkz7nc7p1i] {
    position: relative;
    width: 300px;
    height: 300px;
    background-size: cover;
    background-position: 50% 50%;
    border-radius: 8px;
    overflow: hidden;
}

.frame-8[b-mkz7nc7p1i] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    position: relative;
    top: 20px;
    left: 20px;
}

/* Etiquetas de producto */
.grupo[b-mkz7nc7p1i],
.grupo-2[b-mkz7nc7p1i],
.grupo-3[b-mkz7nc7p1i],
.grupo-4[b-mkz7nc7p1i],
.grupo-5[b-mkz7nc7p1i] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 2px 7px;
    position: relative;
    flex: 0 0 auto;
    border-radius: 2px;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
}

.grupo[b-mkz7nc7p1i] {
    background-color: var(--oferta-50);
}

.grupo-2[b-mkz7nc7p1i] {
    background-color: #fdd623;
}

.grupo-3[b-mkz7nc7p1i] {
    background-color: #ffffff;
}

.grupo-4[b-mkz7nc7p1i] {
    background-color: #686aad;
}

.grupo-5[b-mkz7nc7p1i] {
    background-color: #52b0ad;
}

.new-wrapper[b-mkz7nc7p1i] {
    background-color: var(--primario);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 2px 7px;
    position: relative;
    flex: 0 0 auto;
    border-radius: 2px;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
}

.new[b-mkz7nc7p1i],
.new-2[b-mkz7nc7p1i],
.new-3[b-mkz7nc7p1i] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: "Nunito Sans", Helvetica;
    font-weight: 700;
    font-size: 10px;
    text-align: center;
    letter-spacing: 0;
    line-height: normal;
}

.new[b-mkz7nc7p1i] {
    color: var(--negro);
}

.new-2[b-mkz7nc7p1i] {
    color: #141414;
}

.new-3[b-mkz7nc7p1i] {
    color: var(--negro);
}

/* Información de producto */
.pack-info-text[b-mkz7nc7p1i] {
    display: flex;
    width: 300px;
    align-items: flex-end;
    justify-content: space-between;
    padding: 0px 20px;
    position: relative;
    flex: 0 0 auto;
}

.info-producto[b-mkz7nc7p1i] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    position: relative;
    flex: 0 0 auto;
    max-width: 75%;
}

/* Opciones de color */
.redondas[b-mkz7nc7p1i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    position: relative;
    flex: 0 0 auto;
}

.redonda[b-mkz7nc7p1i],
.ellipse-wrapper[b-mkz7nc7p1i] {
    position: relative;
    width: 23px;
    height: 23px;
}

.redonda[b-mkz7nc7p1i] {
    border-radius: 11.5px;
    border: 1px dashed;
    border-color: #000000;
}

.ellipse[b-mkz7nc7p1i],
.ellipse-2[b-mkz7nc7p1i],
.ellipse-3[b-mkz7nc7p1i],
.ellipse-4[b-mkz7nc7p1i] {
    position: relative;
    width: 15px;
    height: 15px;
    border-radius: 7.5px;
}

.ellipse[b-mkz7nc7p1i] {
    top: 3px;
    left: 3px;
    background-color: #010101;
}

.ellipse-2[b-mkz7nc7p1i] {
    top: 4px;
    left: 4px;
    background-color: #ffffff;
    border: 1px solid;
    border-color: var(--gris-60);
}

.ellipse-3[b-mkz7nc7p1i] {
    top: 4px;
    left: 4px;
    background-color: #ffd600;
}

.ellipse-4[b-mkz7nc7p1i] {
    top: 4px;
    left: 4px;
    background-color: #3a37bd;
}

.div-wrapper[b-mkz7nc7p1i] {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 2px;
    position: relative;
    flex: 0 0 auto;
}

.text-wrapper-4[b-mkz7nc7p1i] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: "Nunito Sans", Helvetica;
    font-weight: 700;
    color: var(--negro);
    font-size: 14px;
    text-align: center;
    letter-spacing: 0px;
    line-height: normal;
}

.text-wrapper-5[b-mkz7nc7p1i] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans", Helvetica;
    font-weight: 400;
    color: var(--negro);
    font-size: 16px;
    letter-spacing: 0px;
    line-height: normal;
}

/* Precios */
.price[b-mkz7nc7p1i] {
    display: inline-flex;
    align-items: flex-end;
    gap: 12px;
    position: relative;
    flex: 0 0 auto;
}

.text-wrapper-6[b-mkz7nc7p1i] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: "Nunito Sans", Helvetica;
    font-weight: 700;
    color: var(--oferta-60);
    font-size: 20px;
    letter-spacing: 0;
    line-height: normal;
}

.text-wrapper-7[b-mkz7nc7p1i] {
    position: relative;
    width: fit-content;
    font-family: "Nunito Sans", Helvetica;
    font-weight: 400;
    color: var(--gris-50);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
    text-decoration: line-through;
}

.text-wrapper-8[b-mkz7nc7p1i] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: "Nunito Sans", Helvetica;
    font-weight: 700;
    color: var(--negro);
    font-size: 20px;
    letter-spacing: 0;
    line-height: normal;
}

/* Botón añadir al carrito */
.boton[b-mkz7nc7p1i] {
    width: 65px;
    height: 65px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    border: 1px solid;
    border-color: var(--primario);
    cursor: pointer;
    transition: all 0.3s ease;
}

    .boton:hover[b-mkz7nc7p1i] {
        background-color: var(--primario);
    }

        .boton:hover .iconos-2[b-mkz7nc7p1i] {
            filter: brightness(0) invert(1);
        }

.iconos-2[b-mkz7nc7p1i] {
    position: absolute;
    width: 23px;
    height: 24px;
    top: 19px;
    left: 20px;
    transition: all 0.3s ease;
}

/* Estilos para el carrusel de productos relacionados */
.loader-container[b-mkz7nc7p1i] {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 300px;
}

#relatedProductCarousel[b-mkz7nc7p1i] {
    transition: all 0.5s ease;
}

/* Estilos para el carrusel de productos con desplazamiento horizontal */
.carousel-container[b-mkz7nc7p1i] {
    overflow: hidden;
    width: 100%;
}

.carousel-track[b-mkz7nc7p1i] {
    display: flex;
    transition: transform 0.5s ease;
}

/* Animación para añadir al carrito */
@keyframes addedToCart-b-mkz7nc7p1i {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}

.boton.added[b-mkz7nc7p1i] {
    animation: addedToCart-b-mkz7nc7p1i 0.5s ease;
    background-color: var(--primario);
}

    .boton.added .iconos-2[b-mkz7nc7p1i] {
        filter: brightness(0) invert(1);
    }

/* Responsive para productos relacionados */
@media (max-width: 1600px) {
    .home-body-3[b-mkz7nc7p1i] {
        padding-left: 50px;
        padding-right: 50px;
    }

    .frame-7[b-mkz7nc7p1i] {
        flex-wrap: wrap;
        gap: 20px;
        justify-content: center;
    }
}

@media (max-width: 1200px) {
    .card-producto[b-mkz7nc7p1i],
    .card-producto-2[b-mkz7nc7p1i],
    .card-producto-3[b-mkz7nc7p1i] {
        border: 1px solid var(--gris-30);
        margin: 10px;
    }
}

@media (max-width: 768px) {
    .home-body-3[b-mkz7nc7p1i] {
        padding: 20px;
    }

    .text-wrapper-3[b-mkz7nc7p1i] {
        font-size: 30px;
    }

    .frame-wrapper[b-mkz7nc7p1i],
    .frame-9[b-mkz7nc7p1i],
    .frame-10[b-mkz7nc7p1i],
    .frame-11[b-mkz7nc7p1i],
    .frame-12[b-mkz7nc7p1i] {
        width: 250px;
        height: 250px;
    }

    .pack-info-text[b-mkz7nc7p1i] {
        width: 250px;
    }
}


@media (max-width: 768px) {
    .countdown-timer[b-mkz7nc7p1i] {
        justify-content: center;
        gap: 15px;
    }

    .countdown-block[b-mkz7nc7p1i] {
        min-width: 50px;
        padding: 10px 6px;
    }

    .countdown-value[b-mkz7nc7p1i] {
        font-size: 1.5rem;
    }

    .product-title[b-mkz7nc7p1i] {
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }

    .current-price[b-mkz7nc7p1i] {
        font-size: 2rem;
    }

    .col-md-6[b-mkz7nc7p1i] {
        padding: 0 1rem;
    }

    .container-fluid[b-mkz7nc7p1i] {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }
    
    /* Botones en móvil - apilados verticalmente */
    .buttons-container[b-mkz7nc7p1i] {
        flex-direction: column;
        gap: 12px;
    }
    
    .btn-add-to-cart[b-mkz7nc7p1i],
    .btn-buy-now[b-mkz7nc7p1i] {
        width: 100%;
        padding: 12px 20px;
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .buttons-container[b-mkz7nc7p1i] {
        gap: 10px;
    }
    
    .btn-add-to-cart[b-mkz7nc7p1i],
    .btn-buy-now[b-mkz7nc7p1i] {
        padding: 10px 16px;
        font-size: 13px;
        letter-spacing: 0.3px;
    }
}
/* _content/PMCWEB/Components/Pages/BajaCuenta.razor.rz.scp.css */
.cancelar-cuenta[b-aizzohm61j] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .cancelar-cuenta .frame[b-aizzohm61j] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        align-self: stretch;
        width: 100%;
        position: relative;
        flex: 0 0 auto;
    }

    .cancelar-cuenta .titulo[b-aizzohm61j] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .cancelar-cuenta .CESTA[b-aizzohm61j] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .cancelar-cuenta .iconos[b-aizzohm61j] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 19px;
        left: 0;
    }

    .cancelar-cuenta .div[b-aizzohm61j] {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 30px;
        align-self: stretch;
        width: 100%;
        position: relative;
        flex: 0 0 auto;
    }

    .cancelar-cuenta .div-wrapper[b-aizzohm61j] {
        display: flex;
        align-items: center;
        gap: 30px;
        align-self: stretch;
        width: 100%;
        position: relative;
        flex: 0 0 auto;
    }

    .cancelar-cuenta .text-wrapper[b-aizzohm61j] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: #000000;
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        white-space: nowrap;
        font-style: var(--headline-large-font-style);
    }

    .cancelar-cuenta .frame-2[b-aizzohm61j] {
        display: flex;
        flex-direction: column;
        width: 410px;
        align-items: center;
        gap: 50px;
        position: relative;
        flex: 0 0 auto;
    }

    .cancelar-cuenta .p[b-aizzohm61j] {
        position: relative;
        align-self: stretch;
        margin-top: -1px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--texto-negro-suave);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .cancelar-cuenta .boton[b-aizzohm61j] {
        display: flex;
        flex-direction: column;
        text-decoration: none;
        width: 442px;
        height: 59px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        margin-left: -16px;
        margin-right: -16px;
        background-color: var(--primario);
        border-radius: 6px;
        overflow: hidden;
    }

    .cancelar-cuenta .boton:hover[b-aizzohm61j]{
        cursor: pointer;
    }

    .cancelar-cuenta .state-layer[b-aizzohm61j] {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
    }

    .cancelar-cuenta .label-text[b-aizzohm61j] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--blanco);
        padding-bottom: 0px;
        margin-bottom: 0px;
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }
/* _content/PMCWEB/Components/Pages/CanalEtico.razor.rz.scp.css */
.etico[b-0tcrtw6m1x] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .etico .frame[b-0tcrtw6m1x] {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .etico .titulo[b-0tcrtw6m1x] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .etico .cesta[b-0tcrtw6m1x] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .etico .iconos[b-0tcrtw6m1x] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 19px;
        left: 0;
    }

    .etico .contenido[b-0tcrtw6m1x] {
        flex-direction: column;
        align-items: flex-start;
        gap: 75px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .etico .frame-2[b-0tcrtw6m1x] {
        align-items: flex-start;
        gap: 100px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .etico .frame-3[b-0tcrtw6m1x] {
        flex-direction: column;
        align-items: flex-start;
        gap: 60px;
        flex: 1;
        flex-grow: 1;
        display: flex;
        position: relative;
    }

    .etico .frame-4[b-0tcrtw6m1x] {
        flex-direction: column;
        align-items: flex-start;
        gap: 40px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .etico .text-wrapper[b-0tcrtw6m1x] {
        position: relative;
        align-self: stretch;
        margin-top: -1px;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: #000000;
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        font-style: var(--headline-large-font-style);
    }

    .etico .p[b-0tcrtw6m1x] {
        position: relative;
        align-self: stretch;
        font-family: "Nunito Sans-Regular", Helvetica;
        font-weight: 400;
        color: transparent;
        font-size: 14px;
        letter-spacing: 0.25px;
        line-height: 20px;
    }

    .etico .span[b-0tcrtw6m1x] {
        color: #000000;
        letter-spacing: var(--body-medium-letter-spacing);
        font-family: var(--body-medium-font-family);
        font-style: var(--body-medium-font-style);
        font-weight: var(--body-medium-font-weight);
        line-height: var(--body-medium-line-height);
        font-size: var(--body-medium-font-size);
    }

    .etico .text-wrapper-2[b-0tcrtw6m1x] {
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #3caa36;
        letter-spacing: 0.04px;
    }

    .etico .text-wrapper-3[b-0tcrtw6m1x] {
        color: #3caa36;
        letter-spacing: var(--body-medium-letter-spacing);
        font-family: var(--body-medium-font-family);
        font-style: var(--body-medium-font-style);
        font-weight: var(--body-medium-font-weight);
        line-height: var(--body-medium-line-height);
        font-size: var(--body-medium-font-size);
    }

    .etico .frame-wrapper[b-0tcrtw6m1x] {
        align-items: flex-start;
        flex: 1;
        align-self: stretch;
        flex-grow: 1;
        background-color: var(--blanco);
        border-radius: 15px;
        border: 1px solid;
        border-color: var(--terciario);
        display: flex;
        position: relative;
    }

    .etico .frame-5[b-0tcrtw6m1x] {
        flex-direction: column;
        align-items: flex-start;
        gap: 50px;
        padding: 50px;
        flex: 1;
        flex-grow: 1;
        display: flex;
        position: relative;
    }

    .etico .frame-6[b-0tcrtw6m1x] {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 0px 0px 20px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-color: var(--grisgris-40);
        display: flex;
        position: relative;
    }

    .etico .text-wrapper-4[b-0tcrtw6m1x] {
        position: relative;
        align-self: stretch;
        margin-top: -1px;
        font-family: var(--headline-small-font-family);
        font-weight: var(--headline-small-font-weight);
        color: #000000;
        font-size: var(--headline-small-font-size);
        letter-spacing: var(--headline-small-letter-spacing);
        line-height: var(--headline-small-line-height);
        font-style: var(--headline-small-font-style);
    }

    .etico .text-wrapper-5[b-0tcrtw6m1x] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .etico .text-wrapper-6[b-0tcrtw6m1x] {
        position: relative;
        align-self: stretch;
        margin-top: -1px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: var(--black-fonts-headings);
        font-size: 16px;
        letter-spacing: 0.50px;
        line-height: 24px;
    }

    .etico .text-wrapper-7[b-0tcrtw6m1x] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-medium-font-family);
        font-weight: var(--body-medium-font-weight);
        color: #000000;
        font-size: var(--body-medium-font-size);
        letter-spacing: var(--body-medium-letter-spacing);
        line-height: var(--body-medium-line-height);
        font-style: var(--body-medium-font-style);
    }

    .etico .image[b-0tcrtw6m1x] {
        position: relative;
        align-self: stretch;
        margin-left: -20px;
        width: 400px;
        object-fit: cover;
    }

    .etico .boton-wrapper[b-0tcrtw6m1x] {
        flex-direction: column;
        align-items: center;
        gap: 10px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .etico .boton[b-0tcrtw6m1x] {
        display: flex;
        flex-direction: column;
        width: 509px;
        height: 54px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        background-color: var(--primario);
        border-radius: 6px;
        overflow: hidden;
    }

    .etico .state-layer[b-0tcrtw6m1x] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .etico .label-text[b-0tcrtw6m1x] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--blanco);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }
/* _content/PMCWEB/Components/Pages/Catalogos.razor.rz.scp.css */
.catalogo[b-sojffnkuda] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .catalogo .frame[b-sojffnkuda] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-end;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .catalogo .ttulo[b-sojffnkuda] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .catalogo .CESTA[b-sojffnkuda] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .catalogo .iconos[b-sojffnkuda] {
        position: absolute;
        top: 19px;
        left: 0;
        width: 24px;
        height: 24px;
    }

    .catalogo .div[b-sojffnkuda] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .catalogo .frame-2[b-sojffnkuda] {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        position: relative;
        flex: 0 0 auto;
    }

    .catalogo .img[b-sojffnkuda] {
        position: relative;
        width: 24px;
        height: 24px;
    }

    .catalogo .vista[b-sojffnkuda] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--black-900);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        white-space: nowrap;
        font-style: var(--body-large-font-style);
    }

    .catalogo .frame-3[b-sojffnkuda] {
        display: flex;
        height: 320px;
        align-items: flex-end;
        justify-content: space-between;
        position: relative;
        align-self: stretch;
        width: 100%;
    }

    .catalogo .component[b-sojffnkuda] {
        display: flex;
        flex-direction: column;
        width: 320px;
        align-items: flex-start;
        justify-content: flex-end;
        gap: 20px;
        position: relative;
    }

    .catalogo .cat-general[b-sojffnkuda] {
        position: relative;
        width: 320px;
        height: 240px;
        object-fit: cover;
    }

    .catalogo .frame-4[b-sojffnkuda] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .catalogo .text-wrapper[b-sojffnkuda] {
        position: relative;
        align-self: stretch;
        margin-top: -1.00px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: var(--black-fonts-headings);
        font-size: 16px;
        letter-spacing: 0.50px;
        line-height: 24px;
    }

    .catalogo .text-wrapper-2[b-sojffnkuda] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-small-font-family);
        font-weight: var(--body-small-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--body-small-font-size);
        letter-spacing: var(--body-small-letter-spacing);
        line-height: var(--body-small-line-height);
        font-style: var(--body-small-font-style);
    }

    .catalogo .boton[b-sojffnkuda] {
        display: flex;
        flex-direction: column;
        width: 592px;
        height: 52px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        background-color: var(--blanco);
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--alternativo-oscuro);
    }

    .catalogo .state-layer[b-sojffnkuda] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .catalogo .label-text[b-sojffnkuda] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--negro);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
        text-decoration: none;
    }
/* _content/PMCWEB/Components/Pages/Cesta.razor.rz.scp.css */
/* ============================================
   CESTA - PÁGINA DE CARRITO DE COMPRAS
   Diseño EXACTO según Figma - Width 1920px
   ============================================ */

/* Container principal - EXACTO como Figma */
.cesta-page-wrapper[b-c3i2g6uvtr] {
    background: white;
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
}

/* SECCIÓN SUPERIOR: Lista de productos */
.cesta-productos-section[b-c3i2g6uvtr] {
    background: white;
    padding: 0 115px 30px;
    display: flex;
    flex-direction: column;
}

/* Header "CESTA" - centrado */
.cesta-header[b-c3i2g6uvtr] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 20px 0;
    width: 100%;
}

.cesta-title[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #000000;
    margin: 0;
    white-space: pre;
}

/* Headers de columnas */
.cesta-table-header[b-c3i2g6uvtr] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0 0 20px 0;
    padding-right: 44px;
    border-bottom: 1px solid #000000;
    width: 100%;
}

.header-producto[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #000000;
    white-space: pre;
}

.header-derecha[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    gap: 81px;
}

.header-grupo[b-c3i2g6uvtr] {
    display: flex;
    gap: 114px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #000000;
    white-space: pre;
}

.header-precio[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.precio-label[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #000000;
}

.sin-iva[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.4px;
    color: #9E9E9E;
}

/* Item del carrito - EXACTO como Figma */
.cesta-item[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    gap: 20px;
    height: 90px;
    border-bottom: 1px dashed #E0E0E0;
    width: 100%;
}

.item-imagen[b-c3i2g6uvtr] {
    width: 80px;
    height: 80px;
    border-radius: 14px;
    object-fit: cover;
    flex-shrink: 0;
    cursor: pointer;
}

.item-content[b-c3i2g6uvtr] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.item-info[b-c3i2g6uvtr] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 885px;
    flex-shrink: 0;
}

.item-titulo[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #000000;
    margin: 0;
    cursor: pointer;
    min-width: 100%;
    width: min-content;
}

.item-badges[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.item-referencia[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    font-size: 16px;
    color: #000000;
    white-space: pre;
}

/* Badges del producto */
.badge[b-c3i2g6uvtr] {
    padding: 2px 7px;
    border-radius: 2px;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 10px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 8px;
}

.badge-nuevo[b-c3i2g6uvtr] {
    background: white;
    color: #121212;
}

.badge-oferta[b-c3i2g6uvtr] {
    background: #FF5449;
    color: white;
}

.badge-regalo[b-c3i2g6uvtr] {
    background: #52B0AD;
    color: white;
}

.badge-eco[b-c3i2g6uvtr] {
    background: #3CAA36;
    color: white;
}

.badge-reembolso[b-c3i2g6uvtr] {
    background: #FDD623;
    color: #141414;
}

.badge-homologado[b-c3i2g6uvtr] {
    background: #B052A1;
    color: white;
}

/* Contador de cantidad - EXACTO como Figma */
.item-cantidad-control[b-c3i2g6uvtr] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 46px;
    flex-shrink: 0;
    gap: 10px;
}

.contador-background[b-c3i2g6uvtr] {
    width: 128.269px;
    height: 46px;
    background: #F5F5F5;
    border-radius: 8px;
    position: absolute;
    flex-shrink: 0;
}

.contador-pack[b-c3i2g6uvtr] {
    position: absolute;
    left: 12.27px;
    top: 12px;
    width: 104px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.btn-menos[b-c3i2g6uvtr],
.btn-mas[b-c3i2g6uvtr] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
}

.btn-menos[b-c3i2g6uvtr] {
    width: 20.667px;
    height: 20px;
}

.btn-mas[b-c3i2g6uvtr] {
    width: 20px;
    height: 20px;
}

.btn-menos img[b-c3i2g6uvtr],
.btn-mas img[b-c3i2g6uvtr] {
    width: 100%;
    height: 100%;
    display: block;
}

.cantidad-valor[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #121212;
    text-align: center;
    white-space: pre;
}

/* Icono de stock */
.item-stock-icon[b-c3i2g6uvtr] {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    overflow: hidden;
    position: relative;
}

/* Acciones y precios */
.item-acciones[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    gap: 73px;
    justify-content: flex-end;
    flex-shrink: 0;
}

.btn-ver-stock[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    flex-shrink: 0;
}

.btn-ver-stock img[b-c3i2g6uvtr] {
    width: 24px;
    height: 24px;
}

.btn-ver-stock span[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #000000;
    text-align: right;
    white-space: pre;
}

.item-precios[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    gap: 40px;
    justify-content: flex-end;
    flex-shrink: 0;
}

.precio-box[b-c3i2g6uvtr] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: flex-start;
    justify-content: center;
    width: 66px;
    flex-shrink: 0;
}

.precio-actual[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #000000;
    text-align: right;
    white-space: pre;
}

.precio-tachado[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #9E9E9E;
    text-decoration: line-through;
}

.btn-eliminar[b-c3i2g6uvtr] {
    width: 24px;
    height: 24px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    position: relative;
}

.btn-eliminar img[b-c3i2g6uvtr] {
    width: 100%;
    height: 100%;
}

/* SECCIÓN INFERIOR: Botones, búsqueda y totales */
.cesta-inferior-section[b-c3i2g6uvtr] {
    background: white;
    padding: 0 115px 50px;
    display: flex;
    gap: 100px;
    align-items: flex-start;
}

/* Lado izquierdo - crece */
.cesta-inferior-izquierda[b-c3i2g6uvtr] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Fila de botones y búsqueda */
.cesta-acciones-fila[b-c3i2g6uvtr] {
    display: flex;
    gap: 50px;
    align-items: flex-start;
    width: 100%;
}

.acciones-botones[b-c3i2g6uvtr] {
    display: flex;
    justify-content: space-between;
    padding-bottom: 25px;
    width: 440px;
    flex-shrink: 0;
}

.btn-seguir-comprando[b-c3i2g6uvtr],
.btn-anadir-lista[b-c3i2g6uvtr] {
    width: 210px;
    height: 40px;
    background: white;
    border: 1px solid #3CAA36;
    border-radius: 6px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.15px;
    text-align: center;
    color: #3CAA36;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.btn-anadir-lista[b-c3i2g6uvtr] {
    border-color: #ECC61B;
    color: #212121;
}

.acciones-buscar[b-c3i2g6uvtr] {
    flex: 1;
    min-width: 0;
    display: flex;
    gap: 20px;
    align-items: center;
    padding-bottom: 25px;
}

.input-buscar-wrapper[b-c3i2g6uvtr] {
    flex: 1;
    min-width: 0;
    display: flex;
    height: 100%;
}

.input-buscar-producto[b-c3i2g6uvtr] {
    flex: 1;
    min-width: 0;
    height: 100%;
    background: #F5F5F5;
    border: none;
    border-radius: 6px;
    padding: 0 16px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    font-size: 18px;
    color: #121212;
}

.input-buscar-producto[b-c3i2g6uvtr]::placeholder {
    color: #9E9E9E;
}

.btn-anadir-producto[b-c3i2g6uvtr] {
    height: 40px;
    background: white;
    border: 1px solid #3CAA36;
    border-radius: 6px;
    padding: 0 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.15px;
    color: #3CAA36;
    cursor: pointer;
    flex-shrink: 0;
}

/* Productos recomendados */
.productos-interes[b-c3i2g6uvtr] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.productos-interes-header[b-c3i2g6uvtr] {
    padding-bottom: 20px;
    padding-right: 44px;
    border-bottom: 1px solid #000000;
    height: 42px;
    display: flex;
    align-items: flex-start;
}

.productos-interes-header h3[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #000000;
    margin: 0;
    white-space: pre;
}

.productos-interes-carrusel[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.carrusel-btn[b-c3i2g6uvtr] {
    width: 24px;
    height: 24px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    position: relative;
}

.carrusel-btn img[b-c3i2g6uvtr] {
    width: 100%;
    height: 100%;
}

.carrusel-items[b-c3i2g6uvtr] {
    display: flex;
    gap: 20px;
    flex-shrink: 0;
}

.producto-recomendado[b-c3i2g6uvtr] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    width: 170px;
    flex-shrink: 0;
}

.producto-img[b-c3i2g6uvtr] {
    width: 170px;
    height: 170px;
    border-radius: 14px;
    object-fit: cover;
    position: relative;
}

.producto-info-rec[b-c3i2g6uvtr] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 143px;
    flex-shrink: 0;
}

.producto-nombre-rec[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #141718;
    margin: 0;
    width: 100%;
}

.producto-precios-rec[b-c3i2g6uvtr] {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    width: 100%;
}

.precio-actual-rec[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: #121212;
}

.precio-tachado-rec[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #9E9E9E;
    text-decoration: line-through;
}

.btn-anadir-rec[b-c3i2g6uvtr] {
    position: absolute;
    left: 111px;
    top: 111px;
    width: 43px;
    height: 43px;
    background: white;
    border: 1px solid #ECC61B;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    gap: 8px;
}

.btn-anadir-rec img[b-c3i2g6uvtr] {
    width: 24px;
    height: 24px;
}

/* PANEL LATERAL: Totales */
.cesta-totales-panel[b-c3i2g6uvtr] {
    display: flex;
    flex-direction: column;
    gap: 35px;
    align-self: stretch;
    width: 592px;
    flex-shrink: 0;
}

.totales-box[b-c3i2g6uvtr] {
    background: #F5F5F5;
    border-radius: 8px;
    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.25);
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: center;
    justify-content: center;
    width: 100%;
    flex-shrink: 0;
}

.total-linea[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.15px;
    color: #141414;
}

.total-label[b-c3i2g6uvtr] {
    width: 236px;
    flex-shrink: 0;
}

.total-valor[b-c3i2g6uvtr] {
    width: 129.83px;
    flex-shrink: 0;
    text-align: right;
}

.total-separador[b-c3i2g6uvtr] {
    height: 0;
    width: 100%;
    position: relative;
    flex-shrink: 0;
}

.total-separador-linea[b-c3i2g6uvtr] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: -1px;
    border-top: 1px solid #212121;
}

.total-final[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: #141414;
}

.total-label-final[b-c3i2g6uvtr] {
    width: 236px;
    flex-shrink: 0;
}

.total-valor-final[b-c3i2g6uvtr] {
    width: 129.83px;
    flex-shrink: 0;
    text-align: right;
}

/* Botones de acción del panel */
.totales-acciones[b-c3i2g6uvtr] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    flex-shrink: 0;
}

.totales-acciones-grupo1[b-c3i2g6uvtr] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
    flex-shrink: 0;
}

.btn-continuar[b-c3i2g6uvtr] {
    width: 100%;
    height: 54px;
    background: #3CAA36;
    border: none;
    border-radius: 6px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.15px;
    color: white;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    gap: 8px;
    flex-shrink: 0;
}

.totales-acciones-grupo2[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
    flex-shrink: 0;
}

.btn-ahorro-info[b-c3i2g6uvtr] {
    flex: 1;
    min-width: 0;
    height: 52px;
    background: white;
    border: 1px solid #3CAA36;
    border-radius: 6px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.15px;
    color: #3CAA36;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    gap: 8px;
    flex-shrink: 0;
}

.btn-ayuda[b-c3i2g6uvtr] {
    height: 52px;
    background: white;
    border: 1px solid #ECC61B;
    border-radius: 6px;
    padding: 0 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.15px;
    color: #212121;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    gap: 8px;
    flex-shrink: 0;
}

/* Carrito vacío */
.cesta-vacia[b-c3i2g6uvtr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 20px;
    gap: 20px;
}

.cesta-vacia-icon[b-c3i2g6uvtr] {
    width: 120px;
    height: 120px;
    opacity: 0.3;
}

.cesta-vacia h2[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: #121212;
    margin: 0;
}

.cesta-vacia p[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #9E9E9E;
    margin: 0;
}

/* Loading */
.cesta-loading[b-c3i2g6uvtr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 100px 20px;
    gap: 20px;
}

.spinner[b-c3i2g6uvtr] {
    width: 50px;
    height: 50px;
    border: 4px solid #F5F5F5;
    border-top: 4px solid #3CAA36;
    border-radius: 50%;
    animation: spin-b-c3i2g6uvtr 1s linear infinite;
}

@keyframes spin-b-c3i2g6uvtr {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.cesta-loading p[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #9E9E9E;
}

/* Responsive */
@media (max-width: 1440px) {
    .cesta-productos-section[b-c3i2g6uvtr],
    .cesta-inferior-section[b-c3i2g6uvtr] {
        padding-left: 60px;
        padding-right: 60px;
    }
}

@media (max-width: 1200px) {
    .cesta-inferior-section[b-c3i2g6uvtr] {
        flex-direction: column;
        gap: 40px;
    }

    .cesta-totales-panel[b-c3i2g6uvtr] {
        width: 100%;
    }

    .cesta-acciones-fila[b-c3i2g6uvtr] {
        flex-direction: column;
        gap: 20px;
    }

    .acciones-botones[b-c3i2g6uvtr] {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .cesta-productos-section[b-c3i2g6uvtr],
    .cesta-inferior-section[b-c3i2g6uvtr] {
        padding-left: 20px;
        padding-right: 20px;
    }

    .cesta-table-header[b-c3i2g6uvtr] {
        display: none;
    }

    .cesta-item[b-c3i2g6uvtr] {
        flex-direction: column;
        height: auto;
        padding: 20px 0;
        gap: 15px;
        align-items: flex-start;
    }

    .item-content[b-c3i2g6uvtr] {
        flex-direction: column;
        width: 100%;
        gap: 15px;
    }

    .item-info[b-c3i2g6uvtr] {
        width: 100%;
    }

    .item-acciones[b-c3i2g6uvtr] {
        width: 100%;
        justify-content: space-between;
    }

    .acciones-botones[b-c3i2g6uvtr] {
        flex-direction: column;
        gap: 10px;
    }

    .btn-seguir-comprando[b-c3i2g6uvtr],
    .btn-anadir-lista[b-c3i2g6uvtr] {
        width: 100%;
    }

    .carrusel-items[b-c3i2g6uvtr] {
        gap: 10px;
    }

    .producto-recomendado[b-c3i2g6uvtr] {
        width: 140px;
    }

    .producto-img[b-c3i2g6uvtr] {
        width: 140px;
        height: 140px;
    }
}

/* ============================================
   BUSCADOR DINÁMICO - DROPDOWN DE SUGERENCIAS
   ============================================ */

/* Wrapper del input con posición relativa para el dropdown */
.input-buscar-wrapper[b-c3i2g6uvtr] {
    position: relative;
    flex: 1;
}

/* Dropdown de sugerencias */
.search-suggestions-dropdown[b-c3i2g6uvtr] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    max-height: 400px;
    overflow-y: auto;
    z-index: 1000;
    margin-top: 4px;
}

/* Item individual de sugerencia */
.search-suggestion-item[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    cursor: pointer;
    border-bottom: 1px solid #F5F5F5;
    transition: background-color 0.2s ease;
}

.search-suggestion-item:last-child[b-c3i2g6uvtr] {
    border-bottom: none;
}

.search-suggestion-item:hover[b-c3i2g6uvtr] {
    background-color: #FFF8E1;
}

/* Imagen de la sugerencia */
.suggestion-img[b-c3i2g6uvtr] {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 4px;
    flex-shrink: 0;
}

/* Información del producto en sugerencia */
.suggestion-info[b-c3i2g6uvtr] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    overflow: hidden;
}

.suggestion-referencia[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 12px;
    color: #666666;
    text-transform: uppercase;
}

.suggestion-descripcion[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #000000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.suggestion-precio[b-c3i2g6uvtr] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.suggestion-precio .precio-valor[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: #000000;
}

.suggestion-precio .stock-badge[b-c3i2g6uvtr] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 11px;
    color: #4CAF50;
    background: #E8F5E9;
    padding: 2px 8px;
    border-radius: 12px;
}

/* Spinner pequeño para el botón */
.spinner-small[b-c3i2g6uvtr] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid #FFF;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin-b-c3i2g6uvtr 0.6s linear infinite;
}

@keyframes spin-b-c3i2g6uvtr {
    to { transform: rotate(360deg); }
}

/* Scrollbar personalizado para el dropdown */
.search-suggestions-dropdown[b-c3i2g6uvtr]::-webkit-scrollbar {
    width: 8px;
}

.search-suggestions-dropdown[b-c3i2g6uvtr]::-webkit-scrollbar-track {
    background: #F5F5F5;
    border-radius: 4px;
}

.search-suggestions-dropdown[b-c3i2g6uvtr]::-webkit-scrollbar-thumb {
    background: #CCCCCC;
    border-radius: 4px;
}

.search-suggestions-dropdown[b-c3i2g6uvtr]::-webkit-scrollbar-thumb:hover {
    background: #999999;
}
/* _content/PMCWEB/Components/Pages/CondicionesVenta.razor.rz.scp.css */
.venta[b-nbm7xua8m3] {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .venta .frame[b-nbm7xua8m3] {
        gap: 30px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .venta .titulo[b-nbm7xua8m3] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .venta .cesta[b-nbm7xua8m3] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .venta .iconos[b-nbm7xua8m3] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 19px;
        left: 0;
    }

    .venta .contenido[b-nbm7xua8m3] {
        gap: 60px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .venta .frame-2[b-nbm7xua8m3] {
        gap: 40px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
        width: 85%;
        flex: 0 0 auto;
    }

    .venta .text-wrapper[b-nbm7xua8m3] {
        position: relative;
        align-self: stretch;
        margin-top: -1px;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: #000000;
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        font-style: var(--headline-large-font-style);
    }

    .venta .p[b-nbm7xua8m3] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-medium-font-family);
        font-weight: var(--body-medium-font-weight);
        color: #000000;
        font-size: var(--body-medium-font-size);
        letter-spacing: var(--body-medium-letter-spacing);
        line-height: var(--body-medium-line-height);
        font-style: var(--body-medium-font-style);
    }

    .venta .text-wrapper-2[b-nbm7xua8m3] {
        position: relative;
        align-self: stretch;
        margin-top: -1px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0.15px;
        line-height: 24px;
    }

    .venta .text-wrapper-3[b-nbm7xua8m3] {
        position: relative;
        align-self: stretch;
        margin-top: -1px;
        font-family: var(--body-medium-font-family);
        font-weight: var(--body-medium-font-weight);
        color: #000000;
        font-size: var(--body-medium-font-size);
        letter-spacing: var(--body-medium-letter-spacing);
        line-height: var(--body-medium-line-height);
        font-style: var(--body-medium-font-style);
    }

    .venta .frame-3[b-nbm7xua8m3] {
        gap: 10px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .venta .frame-4[b-nbm7xua8m3] {
        display: flex;
        align-items: flex-start;
        gap: 20px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .venta .img[b-nbm7xua8m3] {
        position: relative;
        flex: 0 0 auto;
    }

    .venta .text-wrapper-4[b-nbm7xua8m3] {
        position: relative;
        flex: 1;
        margin-top: -5px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }
/* _content/PMCWEB/Components/Pages/ConsultaPedidos.razor.rz.scp.css */
.consulta-pedidos[b-n4bi0yd8s7] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.consulta-pedidos .frame[b-n4bi0yd8s7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.consulta-pedidos .titulo[b-n4bi0yd8s7] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.consulta-pedidos h2[b-n4bi0yd8s7] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.consulta-pedidos .iconos[b-n4bi0yd8s7] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.consulta-pedidos .div[b-n4bi0yd8s7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.consulta-pedidos .text-wrapper[b-n4bi0yd8s7] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.consulta-pedidos .boton[b-n4bi0yd8s7] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.consulta-pedidos .boton:hover[b-n4bi0yd8s7] {
    background-color: #80C87C;
}

.consulta-pedidos .state-layer[b-n4bi0yd8s7] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.consulta-pedidos .label-text[b-n4bi0yd8s7] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.consulta-pedidos .frame-2[b-n4bi0yd8s7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 75px;
    align-self: stretch;
    width: 100%;
    background-color: var(--grisgris-10);
    border-radius: 15px;
}

.consulta-pedidos .frame-3[b-n4bi0yd8s7] {
    display: flex;
    padding-bottom: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.consulta-pedidos .text-wrapper-2[b-n4bi0yd8s7] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
}

.consulta-pedidos .frame-4[b-n4bi0yd8s7] {
    display: flex;
    align-items: center;
    gap: 100px;
    align-self: stretch;
}

.consulta-pedidos .frame-5[b-n4bi0yd8s7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    flex: 1 0 0;
}

.consulta-pedidos .frame-6[b-n4bi0yd8s7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
    border-bottom: 1px solid #d3d3d3;
}

.consulta-pedidos .text-wrapper-3[b-n4bi0yd8s7] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

.consulta-pedidos .frame-7[b-n4bi0yd8s7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

[b-n4bi0yd8s7] .consulta-pedidos .input {
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    display: -webkit-box;
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    overflow: hidden;
    padding: 17px 16px;
    position: relative;
    text-overflow: ellipsis;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

[b-n4bi0yd8s7] .consulta-pedidos input::placeholder {
    color: #888;
}

[b-n4bi0yd8s7] .consulta-pedidos input:focus {
    border: 2px solid #28a745;
    outline: none;
}

.consulta-pedidos .frame-8[b-n4bi0yd8s7] {
    display: flex;
    padding: 20px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.consulta-pedidos .input-2[b-n4bi0yd8s7] {
    appearance: none;
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    padding: 17px 16px;
    padding-right: 50px;
    position: relative;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.consulta-pedidos .input-2:focus[b-n4bi0yd8s7] {
    border: 2px solid #3CAA36 !important;
    outline: none !important;
}

.consulta-pedidos .arrow[b-n4bi0yd8s7] {
    position: absolute;
    right: 16px;
    top: 50%;
    width: 15px;
    height: 15px;
    transform: translateY(-50%) rotate(0deg);
    transition: transform 0.3s ease;
}

.consulta-pedidos .select-wrapper[b-n4bi0yd8s7] {
    position: relative;
    width: 100%;
}

.consulta-pedidos .select-wrapper:focus-within .arrow[b-n4bi0yd8s7] {
    transform: translateY(-50%) rotate(90deg);
}

.consulta-pedidos .frame-9[b-n4bi0yd8s7] {
    display: flex;
    padding-top: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.consulta-pedidos .state-layer-wrapper[b-n4bi0yd8s7] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.consulta-pedidos .state-layer-wrapper:hover[b-n4bi0yd8s7] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.consulta-pedidos .state-layer-wrapper:hover .label-text-2[b-n4bi0yd8s7] {
    color: var(--blanco);
}

.consulta-pedidos .label-text-2[b-n4bi0yd8s7] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.consulta-pedidos .alert p[b-n4bi0yd8s7] {
    margin-bottom: 0;
}

.consulta-pedidos .tabla-wrapper[b-n4bi0yd8s7] {
    padding: 15px;
    border-radius: 20px;
    width: 100%;
}

.consulta-pedidos .tabla-container[b-n4bi0yd8s7] {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

.consulta-pedidos .tabla-mejorada[b-n4bi0yd8s7] {
    width: 100%;
    border-collapse: separate;
    font-family: var(--body-large-font-family, sans-serif);
    font-size: 16px;
    padding: 0;
}

.consulta-pedidos .tabla-mejorada tbody tr:not(:last-child) td[b-n4bi0yd8s7] {
    border-bottom: 1px solid #d3d3d3;
}

.consulta-pedidos .tabla-mejorada thead[b-n4bi0yd8s7] {
    color: #000000;
    font-weight: bold;
    position: relative;
}

.consulta-pedidos .tabla-mejorada thead[b-n4bi0yd8s7]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000;
}

.consulta-pedidos .tabla-mejorada th[b-n4bi0yd8s7],
.consulta-pedidos .tabla-mejorada td[b-n4bi0yd8s7] {
    padding: 10px;
    min-width: 100px;
    text-align: center;
}

.consulta-pedidos .tabla-mejorada .th1[b-n4bi0yd8s7] {
    min-width: 110px;
    width: 110px;
}

.consulta-pedidos .tabla-mejorada .th2[b-n4bi0yd8s7], .consulta-pedidos .tabla-mejorada .th3[b-n4bi0yd8s7], .consulta-pedidos .tabla-mejorada .th5[b-n4bi0yd8s7], .consulta-pedidos .tabla-mejorada .th6[b-n4bi0yd8s7] {
    min-width: 180px;
    width: 180px;
}

.consulta-pedidos .tabla-mejorada .th4[b-n4bi0yd8s7] {
    min-width: 350px;
    width: 350px;
}

.consulta-pedidos .tabla-mejorada .th7[b-n4bi0yd8s7] {
    min-width: 100px;
    width: 100px;
}

.consulta-pedidos .tabla-mejorada th .subheader[b-n4bi0yd8s7] {
    font-size: 0.8em; /* Ajusta el tamaño según lo necesites */
    color: #888888; /* Color gris */
}

.consulta-pedidos .tabla-mejorada td[b-n4bi0yd8s7] {
    min-width: 100px;
    margin-top: 20px;
}

.consulta-pedidos .tabla-mejorada td[b-n4bi0yd8s7] {
    min-width: 100px;
    margin-top: 20px;
}

.consulta-pedidos .tabla-mejorada .td4[b-n4bi0yd8s7] {
    min-width: 350px;
}

.consulta-pedidos .tabla-mejorada .td5[b-n4bi0yd8s7], .consulta-pedidos .tabla-mejorada .td6[b-n4bi0yd8s7] {
    text-align: right;
}

.consulta-pedidos .tabla-mejorada .td7 .td-content[b-n4bi0yd8s7] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.consulta-pedidos .tabla-mejorada th[b-n4bi0yd8s7] {
    min-width: 100px;
}

.consulta-pedidos .state-layer-wrapper-2[b-n4bi0yd8s7] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.consulta-pedidos .state-layer-wrapper-2:hover[b-n4bi0yd8s7] {
    background-color: var(--primario);
    cursor: pointer;
}

.consulta-pedidos .state-layer-wrapper-2:hover .label-text-3[b-n4bi0yd8s7] {
    color: var(--blanco);
}

.consulta-pedidos .label-text-3[b-n4bi0yd8s7] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.consulta-pedidos .img[b-n4bi0yd8s7] {
    position: relative;
    width: 24px;
    height: 24px;
}

.consulta-pedidos .spinner-border[b-n4bi0yd8s7] {
    color: var(--blanco);
}

.page-blocker[b-n4bi0yd8s7] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-n4bi0yd8s7] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/Contacto.razor.rz.scp.css */
/* RESET BÁSICO */
*[b-vle6erbvvn] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ESTILOS GENERALES */
body[b-vle6erbvvn] {
    font-family: sans-serif;
    color: #333;
}

/* ENCABEZADO */
header[b-vle6erbvvn] {
    text-align: center;
    padding: 1rem;
    border-bottom: 1px solid #ddd;
}

    header h1[b-vle6erbvvn] {
        font-size: 1.5rem;
    }

/* SECCIÓN DEL MAPA */
.map-section[b-vle6erbvvn] {
    width: 100%;
    max-height: 400px;
    overflow: hidden;
}

/* CONTENEDOR PRINCIPAL */
.contact-container[b-vle6erbvvn] {
    display: flex;
    flex-wrap: wrap;
    margin: 2rem auto;
    max-width: 1200px;
    padding: 0 1rem;
}

/* COLUMNA IZQUIERDA: FORMULARIO */
.contact-left[b-vle6erbvvn] {
    flex: 1 1 500px;
    margin-right: 2rem;
}

    .contact-left h2[b-vle6erbvvn] {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .contact-left p[b-vle6erbvvn] {
        margin-bottom: 1rem;
        line-height: 1.4;
    }

form[b-vle6erbvvn] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-row[b-vle6erbvvn] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

    .form-row input[b-vle6erbvvn],
    .form-row textarea[b-vle6erbvvn] {
        flex: 1;
        padding: 0.8rem;
        font-size: 1rem;
        border: 1px solid #ccc;
        border-radius: 6px;
        background-color: #F5F5F5;
    }

        .form-row input:focus[b-vle6erbvvn],
        .form-row textarea:focus[b-vle6erbvvn] {
            outline: none;
            border: 1px solid #3CAA36;
            box-shadow: 0 0 0 1px #3CAA36;
            background-color: #fefefe;
        }

form button[b-vle6erbvvn] {
    background-color: #2BA84A;
    color: #fff;
    border: none;
    padding: 0.8rem;
    cursor: pointer;
    font-size: 1rem;
    border-radius: 6px;
}

    form button:hover[b-vle6erbvvn] {
        background-color: #24913f;
    }

/* COLUMNA DERECHA: SEDES estilo FAQ */
.contact-right[b-vle6erbvvn] {
    flex: 1 1 300px;
    margin-top: 2rem;
}

.faq[b-vle6erbvvn] {
    list-style: none;
    padding: 0;
}

.faq-item[b-vle6erbvvn] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.faq-question[b-vle6erbvvn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-answer[b-vle6erbvvn] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

.faq-item.open[b-vle6erbvvn] {
    border-bottom: 2px solid #3CAA36;
}

.arrow[b-vle6erbvvn] {
    transition: transform 0.3s ease;
}

.rotate[b-vle6erbvvn] {
    transform: rotate(90deg);
}

/* Estilos adicionales para el sistema de correos */
.alert[b-vle6erbvvn] {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

.alert-success[b-vle6erbvvn] {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.alert-danger[b-vle6erbvvn] {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.text-danger[b-vle6erbvvn] {
    color: #dc3545;
    font-size: 12px;
    margin-top: 4px;
    display: block;
}

.privacy-section[b-vle6erbvvn] {
    margin: 1rem 0;
    padding: 1rem;
    background-color: #f8f9fa;
    border-radius: 4px;
}

.form-check[b-vle6erbvvn] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.form-check-input[b-vle6erbvvn] {
    width: auto !important;
    margin: 0;
}

.form-check-label[b-vle6erbvvn] {
    margin: 0;
    font-size: 14px;
}

.spinner-border[b-vle6erbvvn] {
    width: 1rem;
    height: 1rem;
    border: 0.15em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spinner-border-animation-b-vle6erbvvn 0.75s linear infinite;
    display: inline-block;
    margin-right: 8px;
}

@keyframes spinner-border-animation-b-vle6erbvvn {
    to {
        transform: rotate(360deg);
    }
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .contact-container[b-vle6erbvvn] {
        flex-direction: column;
    }

    .contact-left[b-vle6erbvvn], .contact-right[b-vle6erbvvn] {
        margin-right: 0;
        margin-top: 1rem;
    }
}
/* _content/PMCWEB/Components/Pages/ContactoIntegra.razor.rz.scp.css */
/* ===== Estilos Base ===== */
body[b-hslcd6puwo] {
    margin: 0;
    font-family: 'Segoe UI', sans-serif;
    background-color: #ffffff;
    color: #111;
}

.container[b-hslcd6puwo] {
    display: flex;
    flex-wrap: wrap;
    padding: 40px;
    gap: 40px;
    justify-content: center;
}

.contact-form[b-hslcd6puwo] {
    flex: 1 1 500px;
    max-width: 800px;
}

    .contact-form h1[b-hslcd6puwo] {
        font-size: 24px;
        margin-bottom: 10px;
    }

    .contact-form p[b-hslcd6puwo] {
        color: #555;
        font-size: 14px;
        margin-bottom: 24px;
    }

form input[b-hslcd6puwo],
form textarea[b-hslcd6puwo] {
    width: 100%;
    max-width: 100%;
    padding: 16px;
    margin-bottom: 16px;
    border: none;
    background: #f5f5f5;
    font-size: 14px;
    border-radius: 6px;
    resize: none;
}

.form-row[b-hslcd6puwo] {
    display: flex;
    gap: 16px;
}

    .form-row input[b-hslcd6puwo] {
        flex: 1;
    }

.form-footer[b-hslcd6puwo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
}

.confirmation[b-hslcd6puwo] {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #333;
}

.check[b-hslcd6puwo] {
    color: #3CAA36;
    margin-right: 8px;
    font-size: 16px;
}

button[type="submit"][b-hslcd6puwo] {
    background-color: #3CAA36;
    color: white;
    width: 40%;
    border: none;
    padding: 14px 36px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: bold;
    font-size: 14px;
}

.info-panel[b-hslcd6puwo] {
    flex: 1 1 300px;
    max-width: 400px;
    padding-top: 40px;
}

    .info-panel .main-text[b-hslcd6puwo] {
        font-size: 16px;
        font-weight: 500;
        margin-bottom: 12px;
    }

    .info-panel .sub-text[b-hslcd6puwo] {
        font-size: 14px;
        color: #555;
        margin-bottom: 16px;
    }

    .info-panel hr[b-hslcd6puwo] {
        border: none;
        border-top: 1px solid #ccc;
        margin: 20px 0;
    }

.contact-email[b-hslcd6puwo] {
    font-size: 14px;
    color: #000;
    margin-bottom: 8px;
}

.slogan[b-hslcd6puwo] {
    font-size: 13px;
    color: #999;
}

form input:focus[b-hslcd6puwo],
form textarea:focus[b-hslcd6puwo] {
    outline: none;
    border: 1px solid #3CAA36;
    box-shadow: 0 0 0 1px #3CAA36;
    background-color: #fefefe;
}

/* Estilos adicionales para el sistema de correos */
.alert[b-hslcd6puwo] {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

.alert-success[b-hslcd6puwo] {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.alert-danger[b-hslcd6puwo] {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.text-danger[b-hslcd6puwo] {
    color: #dc3545;
    font-size: 12px;
    margin-top: 4px;
    display: block;
}

.privacy-section[b-hslcd6puwo] {
    margin: 20px 0;
    padding: 15px;
    background-color: #f8f9fa;
    border-radius: 4px;
}

.form-check[b-hslcd6puwo] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 10px;
}

.form-check:last-child[b-hslcd6puwo] {
    margin-bottom: 0;
}

.form-check-input[b-hslcd6puwo] {
    width: auto !important;
    margin: 0;
    margin-top: 2px;
}

.form-check-label[b-hslcd6puwo] {
    margin: 0;
    font-size: 13px;
    line-height: 1.4;
}

.spinner-border[b-hslcd6puwo] {
    width: 1rem;
    height: 1rem;
    border: 0.15em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spinner-border-animation-b-hslcd6puwo 0.75s linear infinite;
    display: inline-block;
    margin-right: 8px;
}

@keyframes spinner-border-animation-b-hslcd6puwo {
    to {
        transform: rotate(360deg);
    }
}

/* ===== Media Queries ===== */

/* Para pantallas medianas (máximo 1200px) */
@media (max-width: 1200px) {
    .container[b-hslcd6puwo] {
        padding: 30px;
        gap: 30px;
    }

    .contact-form[b-hslcd6puwo] {
        flex: 1 1 400px;
        max-width: 700px;
    }

    .info-panel[b-hslcd6puwo] {
        flex: 1 1 250px;
        max-width: 350px;
        padding-top: 30px;
    }

    button[type="submit"][b-hslcd6puwo] {
        width: 45%;
    }
}

/* Para tablet y pantallas pequeñas (máximo 768px) */
@media (max-width: 768px) {
    .container[b-hslcd6puwo] {
        padding: 20px;
        gap: 20px;
    }
    /* Se mantiene el orden; si es necesario, ambos bloques pasan a ocupar el 100% */
    .contact-form[b-hslcd6puwo],
    .info-panel[b-hslcd6puwo] {
        flex: 1 1 100%;
        max-width: 100%;
    }

    button[type="submit"][b-hslcd6puwo] {
        width: 100%;
    }
}

/* Para móviles (máximo 480px) */
@media (max-width: 480px) {
    .contact-form h1[b-hslcd6puwo] {
        font-size: 20px;
    }

    .contact-form p[b-hslcd6puwo],
    .info-panel .main-text[b-hslcd6puwo],
    .info-panel .sub-text[b-hslcd6puwo],
    .contact-email[b-hslcd6puwo],
    .slogan[b-hslcd6puwo] {
        font-size: 12px;
    }

    form input[b-hslcd6puwo],
    form textarea[b-hslcd6puwo] {
        padding: 12px;
        font-size: 12px;
    }

    button[type="submit"][b-hslcd6puwo] {
        padding: 12px 24px;
        font-size: 12px;
    }
}
/* _content/PMCWEB/Components/Pages/Crear_Cuenta.razor.rz.scp.css */
*[b-0p54apbgns] {
    box-sizing: border-box;
}

body[b-0p54apbgns] {
    font-family: Arial, sans-serif;
    background: #fff;
    color: #333;
    margin: 0;
    padding: 20px;
}

.container[b-0p54apbgns] {
    max-width: 940px;
    margin: 0 auto;
    padding: 20px;
}

.form-header[b-0p54apbgns] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

    .form-header h1[b-0p54apbgns] {
        font-size: 2em;
        margin: 0;
    }

.logo[b-0p54apbgns] {
    height: 60px;
    width: 60px;
}

.form-grid[b-0p54apbgns] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
/* Hacer que ciertos elementos abarquen las dos columnas */
.full-width-field[b-0p54apbgns], .radio-group[b-0p54apbgns], .address-toggle[b-0p54apbgns] {
    grid-column: span 2;
}
/* Estilos para inputs, selects y textarea */
input[b-0p54apbgns], select[b-0p54apbgns], textarea[b-0p54apbgns] {
    width: 100%;
    padding: 12px;
    border: 1px solid #F5F5F5;
    border-radius: 6px;
    background: #F5F5F5;
    font-size: 1em;
    font-family: inherit;
}

    input[b-0p54apbgns]::placeholder, textarea[b-0p54apbgns]::placeholder {
        color: #888;
    }

    input:focus[b-0p54apbgns], select:focus[b-0p54apbgns], textarea:focus[b-0p54apbgns] {
        
        border: 2px solid #28a745;
        outline: none;
    }


select[b-0p54apbgns] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #f9f9f9;
    padding-right: 30px; /* espacio para la flecha del select */
}

    select option[disabled][b-0p54apbgns] {
        color: #aaa;
    }
/* Grupo de botones de radio (Empresa/Particular) */
.radio-group[b-0p54apbgns] {
    display: flex;
    align-items: center;
}

.radio-option[b-0p54apbgns] {
    margin-right: 20px;
    cursor: pointer;
}

    .radio-option input[b-0p54apbgns] {
        display: none;
    }

.custom-radio[b-0p54apbgns] {
    width: 12px;
    height: 12px;
    border: 2px solid #28a745;
    border-radius: 50%;
    display: inline-block;
    margin-right: 8px;
    position: relative;
    top: -1px; /* ajusta alineación vertical */
}

.radio-option input:checked + .custom-radio[b-0p54apbgns] {
    background: #28a745;
}
/* Checkboxes (términos y newsletter) */
.checkbox-option[b-0p54apbgns] {
    display: block;
    margin-bottom: 10px;
    cursor: pointer;
}

    .checkbox-option input[b-0p54apbgns] {
        display: none;
    }

.custom-check[b-0p54apbgns] {
    width: 16px;
    height: 16px;
    border: 2px solid #ccc;
    border-radius: 3px;
    display: inline-block;
    margin-right: 8px;
    position: relative;
    top: 2px;
}

.checkbox-option input:checked + .custom-check[b-0p54apbgns] {
    background: #28a745;
    border-color: #28a745;
}

    .checkbox-option input:checked + .custom-check[b-0p54apbgns]::after {
        content: '✔';
        color: #fff;
        font-size: 12px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

/* Opción de dirección de entrega diferente */
.address-toggle[b-0p54apbgns] {
    display: block;
    cursor: pointer;
}

    .address-toggle input[b-0p54apbgns] {
        display: none;
    }

    .address-toggle .custom-check[b-0p54apbgns] {
        width: 16px;
        height: 16px;
        border: none;
        display: inline-block;
        margin-right: 8px;
        position: relative;
        top: 2px;
    }

        .address-toggle .custom-check[b-0p54apbgns]::before {
            content: '↻';
            color: #777;
            font-size: 16px;
            display: inline-block;
            text-align: center;
        }

    .address-toggle input:checked + .custom-check[b-0p54apbgns]::before {
        color: #28a745;
    }
.bottom-section[b-0p54apbgns] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    heig
    align-items: start;
    margin: 20px 0;
    padding-top: 20px;
    border-top: 1px solid #ddd;
}

    .bottom-section textarea[b-0p54apbgns] {
        height: 100px; 
        resize: vertical;
    }

/* Contenedor para los checkboxes, para que queden lado a lado */
.terms-newsletter[b-0p54apbgns] {
    display: table-column;
    gap: 20px;
    align-items: center;
}


.terms-section[b-0p54apbgns] {
    padding-left: 20px;
}

.duo-select[b-0p54apbgns] {
    display: flex;
    gap: 20px;
}

.duo-select select[b-0p54apbgns] {
    flex: 1;
}

/* Botón enviar */
.submit-btn[b-0p54apbgns] {
    display: block;
    width: 100%;
    padding: 15px;
    background: #28a745;
    color: #fff;
    font-size: 1em;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: bold;
    text-align: center;
}

    .submit-btn:hover[b-0p54apbgns] {
        background: #25963a;
    }

/* Responsivo: una columna en pantallas pequeñas */
@media (max-width: 600px) {
    .form-grid[b-0p54apbgns] {
        grid-template-columns: 1fr;
    }

    .bottom-section[b-0p54apbgns] {
        grid-template-columns: 1fr;
    }

    .terms-section[b-0p54apbgns] {
        padding-left: 0;
        margin-top: 20px;
    }

    .form-header[b-0p54apbgns] {
        flex-wrap: wrap;
        text-align: center;
    }

        .form-header h1[b-0p54apbgns] {
            flex: 1 0 100%;
            margin-bottom: 10px;
        }

    .logo[b-0p54apbgns] {
        flex: 1 0 100%;
    }

    .logo[b-0p54apbgns], .form-header h1[b-0p54apbgns] {
        text-align: center;
    }
}

@media (max-width: 600px) {
    .form-grid[b-0p54apbgns] {
        grid-template-columns: 1fr;
    }
}
/* _content/PMCWEB/Components/Pages/DatosEmpresa.razor.rz.scp.css */
.datos-de-empresa[b-84q0ey029b] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.datos-de-empresa .frame[b-84q0ey029b] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.datos-de-empresa .titulo[b-84q0ey029b] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.datos-de-empresa h2[b-84q0ey029b] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.datos-de-empresa .iconos[b-84q0ey029b] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.datos-de-empresa .div[b-84q0ey029b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.datos-de-empresa .text-wrapper[b-84q0ey029b] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.datos-de-empresa .boton[b-84q0ey029b] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

    .datos-de-empresa .boton:hover[b-84q0ey029b] {
        background-color: #80C87C;
    }

.datos-de-empresa .state-layer[b-84q0ey029b] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.datos-de-empresa .label-text[b-84q0ey029b] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.datos-de-empresa .frame-2[b-84q0ey029b] {
    background-color: var(--grisgris-10);
    border-radius: 15px;
    align-items: flex-start;
    align-self: stretch;
    display: flex;
    flex: 0 0 auto;
    gap: 50px;
    justify-content: center;
    padding: 75px 0px;
    position: relative;
    width: 100%;
}

.datos-de-empresa .frame-3[b-84q0ey029b] {
    align-items: flex-start;
    display: inline-flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 10px;
    position: relative;
    width: 750px;
}

.datos-de-empresa .frame-4[b-84q0ey029b] {
    align-items: center;
    align-self: stretch;
    display: flex;
    gap: 30px;
    height: 59px;
    justify-content: center;
    position: relative;
    width: 100%;
}

.datos-de-empresa .text-wrapper-2[b-84q0ey029b] {
    position: relative;
    align-self: stretch;
    width: 350px;
    margin-top: -0.50px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 16px;
    text-align: right;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.datos-de-empresa .text-wrapper-3[b-84q0ey029b] {
    position: relative;
    width: 350px;
    font-family: "Nunito Sans";
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 16px;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.datos-de-empresa .text-wrapper-4[b-84q0ey029b] {
    position: relative;
    width: 225px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 16px;
    text-align: right;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.datos-de-empresa .input[b-84q0ey029b] {
    display: flex;
    width: 350px;
    height: 59px;
    align-items: center;
    justify-content: space-between;
    padding: 17px 16px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
}

.datos-de-empresa .input-2[b-84q0ey029b] {
    background-color: var(--blanco);
    border: none;
    border-radius: 6px;
    color: var(--negro);
    display: -webkit-box;
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    max-width: 350px;
    overflow: hidden;
    padding: 17px 16px;
    position: relative;
    text-overflow: ellipsis;
    width: 350px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.datos-de-empresa input[b-84q0ey029b]::placeholder {
    color: #888;
}

.datos-de-empresa input:focus[b-84q0ey029b] {
    border: 2px solid #28a745;
    outline: none;
}

.datos-de-empresa .input-3[b-84q0ey029b] {
    appearance: none;
    background-color: var(--blanco);
    border: none;
    border-radius: 6px;
    color: var(--negro);
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    max-width: 350px;
    padding: 17px 16px;
    padding-right: 50px;
    position: relative;
    width: 350px;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.datos-de-empresa .input-3:focus[b-84q0ey029b] {
    border: 2px solid #3CAA36 !important;
    outline: none !important;
}

.datos-de-empresa .arrow[b-84q0ey029b] {
    position: absolute;
    right: 16px;
    top: 50%;
    width: 15px;
    height: 15px;
    transform: translateY(-50%) rotate(0deg); /* Estado por defecto */
    transition: transform 0.3s ease;
}

.datos-de-empresa .select-wrapper[b-84q0ey029b] {
    position: relative;
}

    .datos-de-empresa .select-wrapper:focus-within .arrow[b-84q0ey029b] {
        transform: translateY(-50%) rotate(90deg);
    }

.datos-de-empresa .img[b-84q0ey029b] {
    position: relative;
    width: 11.5px;
    height: 6.5px;
    margin-right: -0.75px;
    margin-left: -0.75px;
}

.datos-de-empresa .debemos-actualizar[b-84q0ey029b] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 22px;
    text-align: center;
    letter-spacing: 0;
    line-height: 28px;
}

.datos-de-empresa .span[b-84q0ey029b] {
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #2d2e2e;
    font-size: 22px;
    letter-spacing: 0;
    line-height: 28px;
}

.datos-de-empresa .text-wrapper-5[b-84q0ey029b] {
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
}

.datos-de-empresa .state-layer-wrapper[b-84q0ey029b] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.datos-de-empresa .label-text-2[b-84q0ey029b] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.datos-de-empresa .state-layer-wrapper:hover[b-84q0ey029b] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

    .datos-de-empresa .state-layer-wrapper:hover .label-text-2[b-84q0ey029b] {
        color: var(--blanco);
    }

.datos-de-empresa .alert p[b-84q0ey029b] {
    margin-bottom: 0;
}

.datos-de-empresa .spinner-border[b-84q0ey029b] {
    color: var(--blanco);
}

.page-blocker[b-84q0ey029b] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-84q0ey029b] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/DireccionesEntrega.razor.rz.scp.css */
.direcciones-de-entrega[b-wbf58dg7bh] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.direcciones-de-entrega .frame[b-wbf58dg7bh] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.direcciones-de-entrega .titulo[b-wbf58dg7bh] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.direcciones-de-entrega h2[b-wbf58dg7bh] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.direcciones-de-entrega .iconos[b-wbf58dg7bh] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.direcciones-de-entrega .div[b-wbf58dg7bh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.direcciones-de-entrega .text-wrapper[b-wbf58dg7bh] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.direcciones-de-entrega .boton[b-wbf58dg7bh] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

    .direcciones-de-entrega .boton:hover[b-wbf58dg7bh] {
        background-color: #80C87C;
    }

.direcciones-de-entrega .state-layer[b-wbf58dg7bh] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.direcciones-de-entrega .label-text[b-wbf58dg7bh] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.direcciones-de-entrega .frame-2[b-wbf58dg7bh] {
    background-color: var(--grisgris-10);
    border-radius: 15px;
    display: block;
    position: relative;
    width: 100%;
}

.direcciones-de-entrega .frame-3[b-wbf58dg7bh] {
    align-items: flex-start;
    align-self: stretch;
    display: flex;
    flex: 0 0 auto;
    gap: 50px;
    justify-content: center;
    padding: 0px;
    position: relative;
    width: 100%;
}

.direcciones-de-entrega .frame-3.row1[b-wbf58dg7bh] {
    padding-top: 75px;
}

.direcciones-de-entrega .frame-3.row2[b-wbf58dg7bh] {
    padding-bottom: 75px;
    padding-top: 10px;
}

.direcciones-de-entrega .frame-4[b-wbf58dg7bh] {
    align-items: flex-start;
    display: inline-flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 10px;
    position: relative;
    width: 750px;
}

.direcciones-de-entrega .frame-5[b-wbf58dg7bh] {
    align-items: center;
    align-self: stretch;
    display: flex;
    gap: 30px;
    height: 59px;
    justify-content: center;
    position: relative;
    width: 100%;
}

.direcciones-de-entrega .text-wrapper-2[b-wbf58dg7bh] {
    position: relative;
    align-self: stretch;
    width: 350px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 16px;
    text-align: right;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin: 17px 0px;
}

.direcciones-de-entrega .text-wrapper-3[b-wbf58dg7bh] {
    position: relative;
    width: 350px;
    font-family: "Nunito Sans";
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 16px;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.direcciones-de-entrega .text-wrapper-4[b-wbf58dg7bh] {
    position: relative;
    width: 125px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 16px;
    text-align: right;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.direcciones-de-entrega .text-wrapper-5[b-wbf58dg7bh] {
    position: relative;
    width: 350px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 16px;
    text-align: left;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.direcciones-de-entrega .input[b-wbf58dg7bh] {
    appearance: none;
    background-color: var(--blanco);
    border: none;
    border-radius: 6px;
    color: var(--negro);
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    padding: 17px 16px;
    position: relative;
    max-width: 350px;
    width: 350px;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.direcciones-de-entrega .input.big[b-wbf58dg7bh] {
    max-width: 1150px;
    width: 1150px;
}

.direcciones-de-entrega input[b-wbf58dg7bh]::placeholder {
    color: #888;
}

.direcciones-de-entrega input:focus[b-wbf58dg7bh] {
    border: 2px solid #28a745;
    outline: none;
}

.direcciones-de-entrega .component[b-wbf58dg7bh] {
    width: 100%;
}

.direcciones-de-entrega .text-wrapper-6[b-wbf58dg7bh] {
    position: relative;
    width: 100%;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 16px;
    text-align: left;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.direcciones-de-entrega .direcciones-box[b-wbf58dg7bh] {
    width: 100%;
    max-height: 150px;
    overflow-y: auto;
    overflow-x: hidden;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)); /* 2 columnas por defecto */
    gap: 8px 12px;
    padding: 8px;
    box-sizing: border-box;
    justify-items: center;
    align-content: start;
    scrollbar-width: thin;
}

/* Si el contenedor es lo bastante ancho, pasa a 3 columnas */
@media (min-width: 900px) {
    .direcciones-de-entrega .direcciones-box[b-wbf58dg7bh] {
        grid-template-columns: repeat(3, minmax(0, 1fr)); /* 3 columnas máximo */
    }
}

.direcciones-de-entrega .direccion-item[b-wbf58dg7bh] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: left;
    padding: 6px 8px;
    background: #fff;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.2;
    min-height: 36px;
    font-family: var(--label-large-font-family);
    font-weight: var(--label-large-font-weight);
    color: #000000;
    font-size: var(--label-large-font-size);
    letter-spacing: var(--label-large-letter-spacing);
    line-height: var(--label-large-line-height);
    font-style: var(--label-large-font-style);
}

    .direcciones-de-entrega .direccion-item span[b-wbf58dg7bh] {
        width: 100%;
    }

.direcciones-de-entrega .img[b-wbf58dg7bh] {
    position: relative;
    width: 11.5px;
    height: 6.5px;
    margin-right: -0.75px;
    margin-left: -0.75px;
}

.direcciones-de-entrega .debemos-actualizar[b-wbf58dg7bh] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 22px;
    text-align: center;
    letter-spacing: 0;
    line-height: 28px;
}

.direcciones-de-entrega .span[b-wbf58dg7bh] {
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #2d2e2e;
    font-size: 22px;
    letter-spacing: 0;
    line-height: 28px;
}

.direcciones-de-entrega .text-wrapper-7[b-wbf58dg7bh] {
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
}

.direcciones-de-entrega .state-layer-wrapper[b-wbf58dg7bh] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.direcciones-de-entrega .label-text-2[b-wbf58dg7bh] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.direcciones-de-entrega .state-layer-wrapper:hover[b-wbf58dg7bh] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

    .direcciones-de-entrega .state-layer-wrapper:hover .label-text-2[b-wbf58dg7bh] {
        color: var(--blanco);
    }

.direcciones-de-entrega .alert p[b-wbf58dg7bh] {
    margin-bottom: 0;
}

.direcciones-de-entrega .spinner-border[b-wbf58dg7bh] {
    color: var(--blanco);
}

.page-blocker[b-wbf58dg7bh] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-wbf58dg7bh] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/DireccionFacturacion.razor.rz.scp.css */
.datos-de-facturacion[b-44e8vfwoyt] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.datos-de-facturacion .frame[b-44e8vfwoyt] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.datos-de-facturacion .ttulo[b-44e8vfwoyt] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.datos-de-facturacion h2[b-44e8vfwoyt] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.datos-de-facturacion .iconos[b-44e8vfwoyt] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.datos-de-facturacion .div[b-44e8vfwoyt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.datos-de-facturacion .text-wrapper[b-44e8vfwoyt] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.datos-de-facturacion .state-layer[b-44e8vfwoyt] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.datos-de-facturacion .label-text[b-44e8vfwoyt] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.datos-de-facturacion .label-text-2[b-44e8vfwoyt] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.datos-de-facturacion .frame-2[b-44e8vfwoyt] {
    background-color: var(--grisgris-10);
    border-radius: 15px;
    align-items: flex-start;
    align-self: stretch;
    display: flex;
    flex: 0 0 auto;
    gap: 50px;
    justify-content: center;
    padding: 75px 0px;
    position: relative;
    width: 100%;
}

.datos-de-facturacion .frame-3[b-44e8vfwoyt] {
    align-items: flex-start;
    display: inline-flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 10px;
    position: relative;
    width: 750px;
}

.datos-de-facturacion .frame-4[b-44e8vfwoyt] {
    align-items: center;
    align-self: stretch;
    display: flex;
    gap: 30px;
    height: 59px;
    justify-content: center;
    position: relative;
    width: 100%;
}

.datos-de-facturacion .text-wrapper-3[b-44e8vfwoyt] {
    position: relative;
    width: 350px;
    font-family: "Nunito Sans";
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 16px;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.datos-de-facturacion .text-wrapper-4[b-44e8vfwoyt] {
    position: relative;
    width: 150px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 16px;
    text-align: right;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.datos-de-facturacion .debemos-actualizar[b-44e8vfwoyt] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 22px;
    text-align: center;
    letter-spacing: 0;
    line-height: 28px;
}

.datos-de-facturacion .span[b-44e8vfwoyt] {
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #2d2e2e;
    font-size: 22px;
    letter-spacing: 0;
    line-height: 28px;
}

.datos-de-facturacion .text-wrapper-5[b-44e8vfwoyt] {
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
}

.datos-de-facturacion .state-layer-wrapper[b-44e8vfwoyt] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.datos-de-facturacion .state-layer-wrapper:hover[b-44e8vfwoyt] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.datos-de-facturacion .state-layer-wrapper:hover .label-text-2[b-44e8vfwoyt] {
    color: var(--blanco);
}
/* _content/PMCWEB/Components/Pages/FAQIntegra.razor.rz.scp.css */
body[b-8ybcla37sl] {
    margin: 0;
    font-family: 'Segoe UI', sans-serif;
    background: #ffffff;
    color: #000000;
}

.container[b-8ybcla37sl] {
    display: flex;
    min-height: 100vh;
}

.sidebar[b-8ybcla37sl] {
    flex: 1;
    padding: 40px;
}

    .sidebar h2[b-8ybcla37sl] {
        font-size: 20px;
        margin-bottom: 16px;
    }

    .sidebar p[b-8ybcla37sl] {
        font-size: 14px;
        color: #444;
    }

    .sidebar a[b-8ybcla37sl] {
        color: #1d9e63;
        text-decoration: none;
    }

.faq[b-8ybcla37sl] {
    flex: 2;
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.faq-item[b-8ybcla37sl] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.checklist[b-8ybcla37sl] {
    list-style: none;
    padding-left: 0;
    margin-top: 10px;
}

.checklist li[b-8ybcla37sl] {
    position: relative;
    padding-left: 24px;
    margin-bottom: 10px;
    color: #444;
    font-size: 14px;
    line-height: 1.4;
}

.checklist li[b-8ybcla37sl]::before {
    content: "✔";
    position: absolute;
    left: 0;
    top: 0;
    color: #3CAA36;
    font-weight: bold;
    font-size: 16px;
}


.faq-question[b-8ybcla37sl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-item.open[b-8ybcla37sl] {
    border-bottom: 2px solid #3CAA36;
}


.arrow[b-8ybcla37sl] {
    transition: transform 0.3s ease;
}

.rotate[b-8ybcla37sl] {
    transform: rotate(180deg);
}

.faq-answer[b-8ybcla37sl] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

    .faq-answer p[b-8ybcla37sl] {
        margin: 0;
        padding: 10px 0;
    }
/* _content/PMCWEB/Components/Pages/FAQsPMC.razor.rz.scp.css */
body[b-n9dqk5w4ev] {
    margin: 0;
    font-family: 'Segoe UI', sans-serif;
    background: #ffffff;
    color: #000000;
}

.container[b-n9dqk5w4ev] {
    display: flex;
    min-height: 100vh;
}

.sidebar[b-n9dqk5w4ev] {
    flex: 1;
    padding: 40px;
}

    .sidebar h2[b-n9dqk5w4ev] {
        font-size: 20px;
        margin-bottom: 16px;
    }

    .sidebar p[b-n9dqk5w4ev] {
        font-size: 14px;
        color: #444;
    }

    .sidebar a[b-n9dqk5w4ev] {
        color: #1d9e63;
        text-decoration: none;
    }

.faq[b-n9dqk5w4ev] {
    flex: 2;
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.faq-item[b-n9dqk5w4ev] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.checklist[b-n9dqk5w4ev] {
    list-style: none;
    padding-left: 0;
    margin-top: 10px;
}

.checklist li[b-n9dqk5w4ev] {
    position: relative;
    padding-left: 24px;
    margin-bottom: 10px;
    color: #444;
    font-size: 14px;
    line-height: 1.4;
}

.checklist li[b-n9dqk5w4ev]::before {
    content: "✔";
    position: absolute;
    left: 0;
    top: 0;
    color: #3CAA36;
    font-weight: bold;
    font-size: 16px;
}


.faq-question[b-n9dqk5w4ev] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-item.open[b-n9dqk5w4ev] {
    border-bottom: 2px solid #3CAA36;
}


.arrow[b-n9dqk5w4ev] {
    transition: transform 0.3s ease;
}

.rotate[b-n9dqk5w4ev] {
    transform: rotate(180deg);
}

.faq-answer[b-n9dqk5w4ev] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

    .faq-answer p[b-n9dqk5w4ev] {
        margin: 0;
        padding: 10px 0;
    }
/* _content/PMCWEB/Components/Pages/GestionPresupuesto.razor.rz.scp.css */
.gestion-presupuestos[b-b42sx49xir] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.gestion-presupuestos .frame[b-b42sx49xir] {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /*center;*/
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.gestion-presupuestos .titulo[b-b42sx49xir] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.gestion-presupuestos h2[b-b42sx49xir] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.gestion-presupuestos .iconos[b-b42sx49xir] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.gestion-presupuestos .div[b-b42sx49xir] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.gestion-presupuestos .text-wrapper[b-b42sx49xir] {
    color: #000000;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
}

.gestion-presupuestos .boton[b-b42sx49xir] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.gestion-presupuestos .boton:hover[b-b42sx49xir] {
    background-color: #80C87C;
}

.gestion-presupuestos .state-layer[b-b42sx49xir] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.gestion-presupuestos textarea[b-b42sx49xir] {
    background-color: var(--grisgris-10);
    color: #000000;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 18px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    width: 100%;
    height: 205px;
    padding: 17px 16px;
    border: none;
    overflow-y: auto;
    scrollbar-width: thin;
}

.gestion-presupuestos textarea[b-b42sx49xir]::placeholder {
    color: #888;
}

.gestion-presupuestos textarea:focus[b-b42sx49xir] {
    border: 2px solid #28a745;
    outline: none;
}

.gestion-presupuestos .label-text[b-b42sx49xir] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.gestion-presupuestos .p[b-b42sx49xir] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: var(--label-large-font-family);
    font-weight: var(--label-large-font-weight);
    color: #000000;
    font-size: var(--label-large-font-size);
    letter-spacing: var(--label-large-letter-spacing);
    line-height: var(--label-large-line-height);
    white-space: nowrap;
    font-style: var(--label-large-font-style);
}

.gestion-presupuestos .state-layer-wrapper[b-b42sx49xir] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.gestion-presupuestos .state-layer-wrapper:hover[b-b42sx49xir] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.gestion-presupuestos .state-layer-wrapper:hover .label-text-2[b-b42sx49xir] {
    color: var(--blanco);
}

.gestion-presupuestos .label-text-2[b-b42sx49xir] {
    color: var(--primario);
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.gestion-presupuestos .span[b-b42sx49xir] {
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #2d2e2e;
    font-size: 22px;
    letter-spacing: 0;
    line-height: 28px;
}

.gestion-presupuestos .label-text-2[b-b42sx49xir] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.gestion-presupuestos .alert p[b-b42sx49xir] {
    margin-bottom: 0;
}

.gestion-presupuestos .spinner-border[b-b42sx49xir] {
    color: var(--blanco);
}

.page-blocker[b-b42sx49xir] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-b42sx49xir] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/HistoricoDetallado.razor.rz.scp.css */
.historico-detallado[b-q09glwltp3] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.historico-detallado .frame[b-q09glwltp3] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.historico-detallado .titulo[b-q09glwltp3] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.historico-detallado h2[b-q09glwltp3] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.historico-detallado .iconos[b-q09glwltp3] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.historico-detallado .div[b-q09glwltp3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.historico-detallado .text-wrapper[b-q09glwltp3] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.historico-detallado .boton[b-q09glwltp3] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.historico-detallado .boton:hover[b-q09glwltp3] {
    background-color: #80C87C;
}

.historico-detallado .state-layer[b-q09glwltp3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.historico-detallado .label-text[b-q09glwltp3] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.historico-detallado .frame-2[b-q09glwltp3] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 75px;
    align-self: stretch;
    width: 100%;
    background-color: var(--grisgris-10);
    border-radius: 15px;
}

.historico-detallado .frame-3[b-q09glwltp3] {
    display: flex;
    padding-bottom: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.historico-detallado .text-wrapper-2[b-q09glwltp3] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
}

.historico-detallado .frame-4[b-q09glwltp3] {
    display: flex;
    align-items: center;
    gap: 100px;
    align-self: stretch;
}

.historico-detallado .frame-5[b-q09glwltp3] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    flex: 1 0 0;
}

.historico-detallado .frame-6[b-q09glwltp3] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
    border-bottom: 1px solid #d3d3d3;
}

.historico-detallado .text-wrapper-3[b-q09glwltp3] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

.historico-detallado .frame-7[b-q09glwltp3] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

[b-q09glwltp3] .historico-detallado .input {
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    display: -webkit-box;
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    overflow: hidden;
    padding: 17px 16px;
    position: relative;
    text-overflow: ellipsis;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

[b-q09glwltp3] .historico-detallado input::placeholder {
    color: #888;
}

[b-q09glwltp3] .historico-detallado input:focus {
    border: 2px solid #28a745;
    outline: none;
}

.historico-detallado .frame-8[b-q09glwltp3] {
    display: flex;
    padding: 20px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.historico-detallado .input-2[b-q09glwltp3] {
    appearance: none;
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    padding: 17px 16px;
    padding-right: 50px;
    position: relative;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.historico-detallado .input-2:focus[b-q09glwltp3] {
    border: 2px solid #3CAA36 !important;
    outline: none !important;
}

.historico-detallado .arrow[b-q09glwltp3] {
    position: absolute;
    right: 16px;
    top: 50%;
    width: 15px;
    height: 15px;
    transform: translateY(-50%) rotate(0deg);
    transition: transform 0.3s ease;
}

.historico-detallado .select-wrapper[b-q09glwltp3]{
    position: relative;
    width: 100%;
}

.historico-detallado .select-wrapper:focus-within .arrow[b-q09glwltp3] {
    transform: translateY(-50%) rotate(90deg);
}

.historico-detallado .frame-9[b-q09glwltp3] {
    display: flex;
    padding-top: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.historico-detallado .state-layer-wrapper[b-q09glwltp3] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.historico-detallado .state-layer-wrapper:hover[b-q09glwltp3] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.historico-detallado .state-layer-wrapper:hover .label-text-2[b-q09glwltp3] {
    color: var(--blanco);
}

.historico-detallado .label-text-2[b-q09glwltp3] {

    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);

}

.historico-detallado .alert p[b-q09glwltp3] {
    margin-bottom: 0;
}

.historico-detallado .spinner-border[b-q09glwltp3] {
    color: var(--blanco);
}

.page-blocker[b-q09glwltp3] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-q09glwltp3] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/HistoricoEntregas.razor.rz.scp.css */
.historico-entregas[b-bvg7t50fe5] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.historico-entregas .frame[b-bvg7t50fe5] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.historico-entregas .titulo[b-bvg7t50fe5] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.historico-entregas h2[b-bvg7t50fe5] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.historico-entregas .iconos[b-bvg7t50fe5] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.historico-entregas .div[b-bvg7t50fe5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.historico-entregas .text-wrapper[b-bvg7t50fe5] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.historico-entregas .boton[b-bvg7t50fe5] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.historico-entregas .boton:hover[b-bvg7t50fe5] {
    background-color: #80C87C;
}

.historico-entregas .state-layer[b-bvg7t50fe5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.historico-entregas .label-text[b-bvg7t50fe5] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.historico-entregas .frame-2[b-bvg7t50fe5] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 75px;
    align-self: stretch;
    width: 100%;
    background-color: var(--grisgris-10);
    border-radius: 15px;
}

.historico-entregas .frame-3[b-bvg7t50fe5] {
    display: flex;
    padding-bottom: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.historico-entregas .text-wrapper-2[b-bvg7t50fe5] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
}

.historico-entregas .frame-4[b-bvg7t50fe5] {
    display: flex;
    align-items: center;
    gap: 100px;
    align-self: stretch;
}

.historico-entregas .frame-5[b-bvg7t50fe5] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    flex: 1 0 0;
}

.historico-entregas .frame-6[b-bvg7t50fe5] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
    border-bottom: 1px solid #d3d3d3;
}

.historico-entregas .text-wrapper-3[b-bvg7t50fe5] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

.historico-entregas .frame-7[b-bvg7t50fe5] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

[b-bvg7t50fe5] .historico-entregas .input {
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    display: -webkit-box;
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    overflow: hidden;
    padding: 17px 16px;
    position: relative;
    text-overflow: ellipsis;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

[b-bvg7t50fe5] .historico-entregas input::placeholder {
    color: #888;
}

[b-bvg7t50fe5] .historico-entregas input:focus {
    border: 2px solid #28a745;
    outline: none;
}

.historico-entregas .frame-8[b-bvg7t50fe5] {
    display: flex;
    padding: 20px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.historico-entregas .input-2[b-bvg7t50fe5] {
    appearance: none;
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    padding: 17px 16px;
    padding-right: 50px;
    position: relative;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.historico-entregas .input-2:focus[b-bvg7t50fe5] {
    border: 2px solid #3CAA36 !important;
    outline: none !important;
}

.historico-entregas .arrow[b-bvg7t50fe5] {
    position: absolute;
    right: 16px;
    top: 50%;
    width: 15px;
    height: 15px;
    transform: translateY(-50%) rotate(0deg);
    transition: transform 0.3s ease;
}

.historico-entregas .select-wrapper[b-bvg7t50fe5] {
    position: relative;
    width: 100%;
}

.historico-entregas .select-wrapper:focus-within .arrow[b-bvg7t50fe5] {
    transform: translateY(-50%) rotate(90deg);
}

.historico-entregas .frame-9[b-bvg7t50fe5] {
    display: flex;
    padding-top: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.historico-entregas .state-layer-wrapper[b-bvg7t50fe5] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.historico-entregas .state-layer-wrapper:hover[b-bvg7t50fe5] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.historico-entregas .state-layer-wrapper:hover .label-text-2[b-bvg7t50fe5] {
    color: var(--blanco);
}

.historico-entregas .label-text-2[b-bvg7t50fe5] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.historico-entregas .alert p[b-bvg7t50fe5] {
    margin-bottom: 0;
}

.historico-entregas .tabla-wrapper[b-bvg7t50fe5] {
    padding: 15px;
    border-radius: 20px;
    width: 100%;
}

.historico-entregas .tabla-container[b-bvg7t50fe5] {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

.historico-entregas .tabla-mejorada[b-bvg7t50fe5] {
    width: 100%;
    border-collapse: separate;
    font-family: var(--body-large-font-family, sans-serif);
    font-size: 16px;
    padding: 0;
}

.historico-entregas .tabla-mejorada tbody tr:not(:last-child) td[b-bvg7t50fe5] {
    border-bottom: 1px solid #d3d3d3;
}

.historico-entregas .tabla-mejorada thead[b-bvg7t50fe5] {
    color: #000000;
    font-weight: bold;
    position: relative;
}

.historico-entregas .tabla-mejorada thead[b-bvg7t50fe5]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000;
}

.historico-entregas .tabla-mejorada th[b-bvg7t50fe5],
.historico-entregas .tabla-mejorada td[b-bvg7t50fe5] {
    padding: 10px;
    min-width: 140px;
    max-width: 140px;
    width: 140px;
    text-align: center;
}

.historico-entregas .tabla-mejorada .th1[b-bvg7t50fe5] {
    text-align: left;
    min-width: 500px;
    width: 100%;
}

.historico-entregas .tabla-mejorada .th5[b-bvg7t50fe5] {
    min-width: 300px;
    max-width: 300px;
}

.historico-entregas .tabla-mejorada th .subheader[b-bvg7t50fe5] {
    font-size: 0.8em; /* Ajusta el tamaño según lo necesites */
    color: #888888; /* Color gris */
}

.historico-entregas .tabla-mejorada .td1[b-bvg7t50fe5] {
    min-width: 500px;
    width: 100%;
}

.historico-entregas .tabla-mejorada .td1 .td-content[b-bvg7t50fe5] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
}

.historico-entregas .tabla-mejorada .td1 img[b-bvg7t50fe5] {
    height: 100px;
    width: 100px;
}

.historico-entregas .tabla-mejorada .td1 .producto-info[b-bvg7t50fe5] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
}

.historico-entregas .tabla-mejorada .td1 .descripcion[b-bvg7t50fe5] {
    color: var(--negro);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.historico-entregas .tabla-mejorada .td1 .referencia[b-bvg7t50fe5] {
    color: var(--negro);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}

.historico-entregas .tabla-mejorada .td5 .td-content[b-bvg7t50fe5] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 25px;
}

.historico-entregas .state-layer-wrapper-2[b-bvg7t50fe5] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.historico-entregas .state-layer-wrapper-2:hover[b-bvg7t50fe5] {
    background-color: var(--primario);
    cursor: pointer;
}

.historico-entregas .state-layer-wrapper-2:hover .label-text-3[b-bvg7t50fe5] {
    color: var(--blanco);
}

.historico-entregas .label-text-3[b-bvg7t50fe5] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.historico-entregas .img[b-bvg7t50fe5] {
    position: relative;
    width: 24px;
    height: 24px;
}

.historico-entregas .spinner-border[b-bvg7t50fe5] {
    color: var(--blanco);
}

.page-blocker[b-bvg7t50fe5] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-bvg7t50fe5] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/HistoricoProductos.razor.rz.scp.css */
.historico-productos[b-8rddnquumf] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.historico-productos .frame[b-8rddnquumf] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.historico-productos .titulo[b-8rddnquumf] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.historico-productos h2[b-8rddnquumf] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.historico-productos .iconos[b-8rddnquumf] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.historico-productos .div[b-8rddnquumf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.historico-productos .text-wrapper[b-8rddnquumf] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.historico-productos .boton[b-8rddnquumf] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

    .historico-productos .boton:hover[b-8rddnquumf] {
        background-color: #80C87C;
    }

.historico-productos .state-layer[b-8rddnquumf] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.historico-productos .label-text[b-8rddnquumf] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.historico-productos .frame-2[b-8rddnquumf] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 75px;
    align-self: stretch;
    width: 100%;
    background-color: var(--grisgris-10);
    border-radius: 15px;
}

.historico-productos .frame-3[b-8rddnquumf] {
    display: flex;
    padding-bottom: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.historico-productos .text-wrapper-2[b-8rddnquumf] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
}

.historico-productos .frame-4[b-8rddnquumf] {
    display: flex;
    align-items: center;
    gap: 100px;
    align-self: stretch;
}

.historico-productos .frame-5[b-8rddnquumf] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    flex: 1 0 0;
}

.historico-productos .frame-6[b-8rddnquumf] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
    border-bottom: 1px solid #d3d3d3;
}

.historico-productos .text-wrapper-3[b-8rddnquumf] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

.historico-productos .frame-7[b-8rddnquumf] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

[b-8rddnquumf] .historico-productos .input {
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    display: -webkit-box;
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    overflow: hidden;
    padding: 17px 16px;
    position: relative;
    text-overflow: ellipsis;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

[b-8rddnquumf] .historico-productos input::placeholder {
    color: #888;
}

[b-8rddnquumf] .historico-productos input:focus {
    border: 2px solid #28a745;
    outline: none;
}

.historico-productos .frame-8[b-8rddnquumf] {
    display: flex;
    padding: 20px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.historico-productos .input-2[b-8rddnquumf] {
    appearance: none;
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    padding: 17px 16px;
    padding-right: 50px;
    position: relative;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.historico-productos .input-2:focus[b-8rddnquumf] {
    border: 2px solid #3CAA36 !important;
    outline: none !important;
}

.historico-productos .arrow[b-8rddnquumf] {
    position: absolute;
    right: 16px;
    top: 50%;
    width: 15px;
    height: 15px;
    transform: translateY(-50%) rotate(0deg);
    transition: transform 0.3s ease;
}

.historico-productos .select-wrapper[b-8rddnquumf] {
    position: relative;
    width: 100%;
}

.historico-productos .select-wrapper:focus-within .arrow[b-8rddnquumf] {
    transform: translateY(-50%) rotate(90deg);
}

.historico-productos .frame-9[b-8rddnquumf] {
    display: flex;
    padding-top: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.historico-productos .state-layer-wrapper[b-8rddnquumf] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.historico-productos .state-layer-wrapper:hover[b-8rddnquumf] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

    .historico-productos .state-layer-wrapper:hover .label-text-2[b-8rddnquumf] {
        color: var(--blanco);
        }

.historico-productos .label-text-2[b-8rddnquumf] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.historico-productos .alert p[b-8rddnquumf] {
    margin-bottom: 0;
}

.historico-productos .tabla-wrapper[b-8rddnquumf] {
    padding: 15px;
    border-radius: 20px;
    width: 100%;
}

.historico-productos .tabla-container[b-8rddnquumf] {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

.historico-productos .tabla-mejorada[b-8rddnquumf] {
    width: 100%;
    border-collapse: separate;
    font-family: var(--body-large-font-family, sans-serif);
    font-size: 16px;
    padding: 0;
}

.historico-productos .tabla-mejorada tbody tr:not(:last-child) td[b-8rddnquumf] {
    border-bottom: 1px solid #d3d3d3;
}

.historico-productos .tabla-mejorada thead[b-8rddnquumf] {
    color: #000000;
    font-weight: bold;
    position: relative;
}

.historico-productos .tabla-mejorada thead[b-8rddnquumf]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000;
}

.historico-productos .tabla-mejorada th[b-8rddnquumf],
.historico-productos .tabla-mejorada td[b-8rddnquumf] {
    padding: 10px;
    min-width: 140px;
    max-width: 140px;
    width: 140px;
    text-align: center;
}

.historico-productos .tabla-mejorada .th1[b-8rddnquumf] {
    text-align: left;
    min-width: 500px;
    width: 100%;
}

.historico-productos .tabla-mejorada .th3[b-8rddnquumf] {
    min-width: 300px;
    max-width: 300px;
}

.historico-productos .tabla-mejorada th .subheader[b-8rddnquumf] {
    font-size: 0.8em; /* Ajusta el tamaño según lo necesites */
    color: #888888; /* Color gris */
}

.historico-productos .tabla-mejorada .td1[b-8rddnquumf] {
    min-width: 500px;
    width: 100%;
}

.historico-productos .tabla-mejorada .td1 .td-content[b-8rddnquumf] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
}

.historico-productos .tabla-mejorada .td1 img[b-8rddnquumf] {
    height: 100px;
    width: 100px;
}

.historico-productos .tabla-mejorada .td1 .producto-info[b-8rddnquumf] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
}

.historico-productos .tabla-mejorada .td1 .descripcion[b-8rddnquumf] {
    color: var(--negro);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.historico-productos .tabla-mejorada .td1 .referencia[b-8rddnquumf] {
    color: var(--negro);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}

.historico-productos .tabla-mejorada .td3 .td-content[b-8rddnquumf] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 25px;
}

.historico-productos .state-layer-wrapper-2[b-8rddnquumf] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.historico-productos .state-layer-wrapper-2:hover[b-8rddnquumf] {
    background-color: var(--primario);
    cursor: pointer;
}

.historico-productos .state-layer-wrapper-2:hover .label-text-3[b-8rddnquumf] {
    color: var(--blanco);
}

.historico-productos .label-text-3[b-8rddnquumf] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.historico-productos .img[b-8rddnquumf] {
    position: relative;
    width: 24px;
    height: 24px;
}

.historico-productos .spinner-border[b-8rddnquumf] {
    color: var(--blanco);
}

.page-blocker[b-8rddnquumf] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-8rddnquumf] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/Home.razor.rz.scp.css */
/* ============================================= */
/* VARIABLES CSS */
/* ============================================= */
.new-home[b-1x2m0jbkfu] {
    --negro: #212121;
    --blanco: #FFFFFF;
    --primario: #3CAA36;
    --secundario: #6B989C;
    --terciario: #85957E;
    --alternativo: #FDD623;
    --alternativo-oscuro: #ECC61B;
    --gris-10: #F5F5F5;
    --gris-20: #EEEEEE;
    --gris-30: #E0E0E0;
    --gris-40: #BDBDBD;
    --gris-50: #9E9E9E;
    --gris-60: #757575;
    --oferta-50: #FF5449;
    --oferta-60: #DE3730;
    --dark-green-buttons: #3A4F39;
    --black-fonts-headings: #2D2E2E;
    --primary-10: #EBF6EB;
}

/* ============================================= */
/* ESTILOS GENERALES */
/* ============================================= */
.new-home[b-1x2m0jbkfu] {
    font-family: 'Nunito Sans', sans-serif;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    width: 100%;
    background-color: var(--blanco);
}

/* ============================================= */
/* SECCIÓN 1: BANNERS PRINCIPALES (Home Body 1) */
/* ============================================= */
.home-body-1[b-1x2m0jbkfu] {
    height: 560px;
    position: relative;
    width: 100%;
    display: flex;
    background-color: var(--blanco);
    overflow: hidden;
    margin-bottom: 30px; /* CORREGIDO: Agregar espacio después de los banners */
    padding: 0 115px; /* CORREGIDO: Padding lateral consistente */
    gap: 14px; /* Gap entre banner grande y el resto */
}

.banner-gran[b-1x2m0jbkfu] {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    position: relative; /* CORREGIDO: Ya no es absolute */
    flex-shrink: 0; /* No encogerse */
}

.sin-titulo[b-1x2m0jbkfu] {
    position: relative;
    width: 838px;
    height: 560px;
    border-radius: 14px;
    overflow: hidden;
}

    .sin-titulo img[b-1x2m0jbkfu] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 14px;
    }

.frame-2[b-1x2m0jbkfu] {
    display: flex;
    width: 838px;
    align-items: flex-end;
    justify-content: center;
    gap: 14px;
    position: relative; /* CORREGIDO: Ya no es absolute */
    flex-shrink: 0; /* No encogerse */
}

.banner-medium[b-1x2m0jbkfu] {
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    gap: 14px;
    position: relative;
    flex: 0 0 auto;
}

.renting-sharp-mesa[b-1x2m0jbkfu] {
    position: relative;
    width: 412px;
    height: 560px;
    object-fit: cover;
    border-radius: 14px;
}

.frame-3[b-1x2m0jbkfu] {
    display: inline-flex;
    flex-direction: column;
    height: 560px;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    position: relative;
    flex: 0 0 auto;
}

.banner-peque[b-1x2m0jbkfu] {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    position: relative;
    flex: 0 0 auto;
}

.img-2[b-1x2m0jbkfu] {
    position: relative;
    width: 412px;
    height: 273px;
    object-fit: cover;
    border-radius: 14px;
}

/* ============================================= */
/* SECCIÓN 2: CATEGORÍAS (Home Body 2) */
/* ============================================= */
.home-body-2[b-1x2m0jbkfu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 115px; /* CORREGIDO: Sin gap, usamos margin en el contenido */
    width: 100%;
    background-color: var(--blanco);
    position: relative;
}

    /* LÍNEA GRIS DECORATIVA SUPERIOR */
    .home-body-2[b-1x2m0jbkfu]::before {
        content: '';
        position: absolute;
        top: 28px; /* Al inicio del padding */
        left: 115px;
        width: 503px;
        height: 2px;
        background: linear-gradient(90deg, #E0E0E0 0%, transparent 100%);
    }

.frame-4[b-1x2m0jbkfu] {
    display: flex;
    width: 1690px;
    align-items: flex-start;
    justify-content: space-between;
    position: relative;
    flex: 0 0 auto;
    margin-top: 50px; /* CORREGIDO: Espacio después de la línea (2px línea + 48px margen) */
}

.banner-material-de[b-1x2m0jbkfu],
.banner-categoria[b-1x2m0jbkfu] {
    display: flex;
    flex-direction: column;
    width: 412px;
    height: 203px;
    align-items: center;
    justify-content: space-between;
    position: relative;
    cursor: pointer;
    transition: transform 0.3s ease;
}

    .banner-material-de:hover[b-1x2m0jbkfu],
    .banner-categoria:hover[b-1x2m0jbkfu] {
        transform: translateY(-5px);
    }

.img-3[b-1x2m0jbkfu] {
    position: relative;
    width: 412px;
    height: 161px;
    object-fit: cover;
    border-radius: 14px;
}

.text-wrapper-2[b-1x2m0jbkfu] {
    position: relative;
    width: 412px;
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 24px;
    letter-spacing: 0;
    line-height: 32px;
    text-align: left;
}

/* ============================================= */
/* SECCIÓN 3: PRODUCTOS DESTACADOS (Home Body 3) */
/* ============================================= */
.home-body-3[b-1x2m0jbkfu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 50px;
    padding: 60px 115px 80px;
    position: relative;
    width: 100%;
    background-color: var(--blanco);
}

.frame-5[b-1x2m0jbkfu] {
    position: relative;
    width: 503px;
    height: 75px;
}

.text-wrapper-3[b-1x2m0jbkfu] {
    position: absolute;
    top: 0;
    left: 0;
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 700;
    color: #000000;
    font-size: 40px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.vector-3[b-1x2m0jbkfu] {
    position: absolute;
    width: 503px;
    height: 1px;
    top: 75px;
    left: 0;
    background: linear-gradient(90deg, #E0E0E0 0%, transparent 100%);
}

/* CORREGIDO: Más espacio entre las flechas y el carrusel */
.frame-6[b-1x2m0jbkfu] {
    display: flex;
    width: 1837px; /* Ancho específico de Figma */
    align-items: center;
    justify-content: center;
    gap: 20px; /* Gap específico de Figma entre flechas y contenido */
    padding: 10px 0px;
    position: relative;
    align-self: center; /* Centrar el contenedor */
}

.carousel-btn[b-1x2m0jbkfu] {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
    flex-shrink: 0; /* No permitir que las flechas se encojan */
}

    .carousel-btn:hover[b-1x2m0jbkfu] {
        transform: scale(1.1);
    }

    .carousel-btn:first-child img[b-1x2m0jbkfu] {
        transform: scaleX(-1);
    }

.img-4[b-1x2m0jbkfu] {
    width: 24px;
    height: 24px;
    cursor: pointer;
}

/* CORREGIDO: Ancho específico del contenedor de carrusel */
.frame-7[b-1x2m0jbkfu] {
    width: 1690px; /* Ancho exacto de Figma */
    overflow: hidden;
    position: relative;
}

.carousel-container[b-1x2m0jbkfu] {
    overflow: hidden;
    width: 100%;
}

.carousel-track[b-1x2m0jbkfu] {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}

    .carousel-track[b-1x2m0jbkfu]::-webkit-scrollbar {
        display: none; /* Chrome/Safari */
    }

/* ============================================= */
/* TARJETAS DE PRODUCTO */
/* ============================================= */
.card-producto[b-1x2m0jbkfu] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 0px 0px 10px 20px; /* CORREGIDO: padding left 20px solo, no right */
    position: relative;
    flex: 0 0 auto;
    border-left: 1px solid var(--gris-30); /* LÍNEA GRIS MÁS VISIBLE */
    cursor: pointer;
    transition: transform 0.3s ease;
    min-width: 300px;
    max-width: 300px; /* Asegurar ancho fijo */
}

    /* CORREGIDO: El primero NO tiene borde izquierdo */
    .card-producto:first-child[b-1x2m0jbkfu] {
        border-left: none;
        padding-left: 0;
    }

    .card-producto:hover[b-1x2m0jbkfu] {
        transform: translateY(-5px);
    }

.frame-wrapper[b-1x2m0jbkfu] {
    position: relative;
    width: 300px;
    height: 300px;
    border-radius: 14px;
    overflow: hidden;
}

.product-image-wrapper[b-1x2m0jbkfu] {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    border-radius: 14px;
    position: relative;
}

.frame-8[b-1x2m0jbkfu] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    position: absolute;
    top: 20px;
    left: 20px;
}

/* Badges/Etiquetas */
.grupo[b-1x2m0jbkfu] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 2px 7px;
    position: relative;
    flex: 0 0 auto;
    border-radius: 2px;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
}

.grupo-oferta[b-1x2m0jbkfu] {
    background-color: var(--oferta-50);
}

.grupo-eco[b-1x2m0jbkfu] {
    background-color: var(--primario);
}

.badge-text[b-1x2m0jbkfu] {
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 700;
    font-size: 10px;
    text-align: center;
    letter-spacing: 0;
    line-height: normal;
    color: var(--blanco);
    white-space: nowrap;
}

/* Badge de Stock */
.grupo-stock[b-1x2m0jbkfu] {
    background-color: var(--primary-10);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 2px 7px;
    position: absolute;
    top: 20px;
    right: 20px;
    border-radius: 2px;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
    width: 59px; /* Ancho fijo de Figma */
    justify-content: flex-end;
}

.stock-dot[b-1x2m0jbkfu] {
    width: 9px;
    height: 9px;
    background-color: var(--primario);
    border-radius: 50%;
}

.stock-text[b-1x2m0jbkfu] {
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 700;
    font-size: 10px;
    text-align: center;
    letter-spacing: 0;
    line-height: normal;
    color: #000000;
}

/* Información del producto */
.pack-info-text[b-1x2m0jbkfu] {
    display: flex;
    width: 300px;
    align-items: flex-end;
    justify-content: space-between;
    padding: 0px 20px 0px 0px; /* Padding right para el botón */
    position: relative;
    flex: 0 0 auto;
}

.info-producto[b-1x2m0jbkfu] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    position: relative;
    flex: 0 0 auto;
    max-width: 215px;
}

/* Selector de colores */
.redondas[b-1x2m0jbkfu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    position: relative;
    flex: 0 0 auto;
}

.redonda[b-1x2m0jbkfu] {
    width: 23px;
    height: 23px;
    border-radius: 50%;
    cursor: pointer;
    transition: transform 0.2s ease;
    position: relative;
}

    .redonda:hover[b-1x2m0jbkfu] {
        transform: scale(1.1);
    }

.redonda-negra[b-1x2m0jbkfu] {
    background-color: #010101;
    border: 1px dashed #000000;
}

.redonda-blanca[b-1x2m0jbkfu] {
    background-color: #ffffff;
    border: 1px solid var(--gris-60);
}

.redonda-amarilla[b-1x2m0jbkfu] {
    background-color: #ffd600;
}

.redonda-azul[b-1x2m0jbkfu] {
    background-color: #3a37bd;
}

.colors-more[b-1x2m0jbkfu] {
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 700;
    color: var(--negro);
    font-size: 14px;
    text-align: center;
    letter-spacing: 0px;
    line-height: normal;
}

.text-wrapper-5[b-1x2m0jbkfu] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 400;
    color: #141718;
    font-size: 16px;
    letter-spacing: 0px;
    line-height: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Precios */
.price[b-1x2m0jbkfu] {
    display: inline-flex;
    align-items: flex-end;
    gap: 12px;
    position: relative;
    flex: 0 0 auto;
}

.text-wrapper-6[b-1x2m0jbkfu] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 700;
    color: var(--oferta-60);
    font-size: 20px;
    letter-spacing: 0;
    line-height: normal;
}

.text-wrapper-7[b-1x2m0jbkfu] {
    position: relative;
    width: fit-content;
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 400;
    color: var(--gris-50);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
    text-decoration: line-through;
}

.text-wrapper-8[b-1x2m0jbkfu] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 700;
    color: var(--negro);
    font-size: 20px;
    letter-spacing: 0;
    line-height: normal;
}

/* Botón añadir al carrito */
.boton[b-1x2m0jbkfu] {
    width: 65px;
    height: 65px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    border: 1px solid var(--primario);
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .boton:hover[b-1x2m0jbkfu] {
        background-color: var(--primario);
    }

        .boton:hover .iconos-2[b-1x2m0jbkfu] {
            filter: brightness(0) invert(1);
        }

.iconos-2[b-1x2m0jbkfu] {
    width: 23px;
    height: 24px;
    transition: all 0.3s ease;
}

@keyframes addedToCart-b-1x2m0jbkfu {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}

.boton.added[b-1x2m0jbkfu] {
    animation: addedToCart-b-1x2m0jbkfu 0.5s ease;
    background-color: var(--primario);
}

    .boton.added .iconos-2[b-1x2m0jbkfu] {
        filter: brightness(0) invert(1);
    }

/* ============================================= */
/* SECCIÓN 4: MEJORES MARCAS (Home Body 4) */
/* ============================================= */
.home-body-4[b-1x2m0jbkfu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 50px;
    padding: 60px 115px 0px;
    position: relative;
    width: 100%;
    background-color: var(--blanco);
}

    /* CORREGIDO: Mismo ancho que productos para consistencia */
    .home-body-4 .frame-6[b-1x2m0jbkfu] {
        width: 1837px; /* Ancho específico de Figma */
        align-self: center;
    }

.brands-track[b-1x2m0jbkfu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0; /* Sin gap, justificación space-between */
    width: 1690px;
}

    .brands-track img[b-1x2m0jbkfu] {
        object-fit: contain;
        filter: grayscale(100%);
        opacity: 0.7;
        transition: all 0.3s ease;
    }

        .brands-track img:hover[b-1x2m0jbkfu] {
            filter: grayscale(0%);
            opacity: 1;
            transform: scale(1.05);
        }

/* Tamaños específicos de Figma para cada logo */
.logo-hp[b-1x2m0jbkfu] {
    width: 50px;
    height: 50px;
}

.logo-sharp[b-1x2m0jbkfu] {
    width: 103px;
    height: 14px;
}

.logo-navigator[b-1x2m0jbkfu] {
    width: 106px;
    height: 33px;
}

.element[b-1x2m0jbkfu] {
    width: 63.46px;
    height: 33px;
}

.logo-pilot[b-1x2m0jbkfu] {
    width: 108.6px;
    height: 30px;
}

.logo-fellowes[b-1x2m0jbkfu] {
    width: 122.18px;
    height: 28px;
}

.logo-poly-polycom[b-1x2m0jbkfu] {
    width: 107px;
    height: 50px;
}

.logo-petrus-azul[b-1x2m0jbkfu] {
    width: 99px;
    height: 33px;
}

.LOGO-EDDING[b-1x2m0jbkfu] {
    width: 132px;
    height: 33px;
}

.logo-bic[b-1x2m0jbkfu] {
    width: 101.64px;
    height: 33px;
}

/* ============================================= */
/* SECCIÓN 5: SERVICIOS (Home Body 5) */
/* ============================================= */
.home-body-5[b-1x2m0jbkfu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 48px;
    padding: 28px 115px 74px;
    flex: 0 0 auto;
    position: relative;
    width: 100%;
    background-color: var(--blanco);
}

.banner-servicio[b-1x2m0jbkfu] {
    position: relative;
    width: 412px;
    height: 560px;
    background-size: cover;
    background-position: 50% 50%;
    border-radius: 14px;
    cursor: pointer;
    transition: transform 0.3s ease;
    overflow: hidden;
}

    .banner-servicio:hover[b-1x2m0jbkfu] {
        transform: translateY(-10px);
    }

    .banner-servicio img[b-1x2m0jbkfu] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 14px;
    }

/* ============================================= */
/* SECCIÓN 6: PRE-FOOTER (Ventajas) */
/* ============================================= */
.pre-footer[b-1x2m0jbkfu] {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    padding: 50px 115px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--blanco);
}

.frame-13[b-1x2m0jbkfu] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    position: relative;
    flex: 0 0 auto;
}

.frame-14[b-1x2m0jbkfu] {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
    position: relative;
    flex: 0 0 auto;
}

.text-wrapper-9[b-1x2m0jbkfu] {
    position: relative;
    width: 217px;
    margin-top: -1.00px;
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-weight: 600;
    color: var(--gris-40);
    font-size: 14px;
    letter-spacing: 0.10px;
    line-height: 20px;
    font-style: normal;
}

.line-2[b-1x2m0jbkfu] {
    position: relative;
    align-self: stretch;
    width: 1px;
    background-color: var(--gris-30);
}

/* ============================================= */
/* NO PRODUCTS MESSAGE */
/* ============================================= */
.no-products-msg[b-1x2m0jbkfu] {
    font-family: "Nunito Sans", Helvetica, sans-serif;
    font-size: 16px;
    color: var(--gris-50);
    text-align: center;
    padding: 40px;
}

/* ============================================= */
/* RESPONSIVE DESIGN */
/* ============================================= */
@media (max-width: 1920px) {
    /* Ya no es necesario definir padding aquí, ya está en las reglas base */
}

@media (max-width: 1600px) {
    .home-body-1[b-1x2m0jbkfu],
    .home-body-2[b-1x2m0jbkfu],
    .home-body-3[b-1x2m0jbkfu],
    .home-body-4[b-1x2m0jbkfu],
    .home-body-5[b-1x2m0jbkfu],
    .pre-footer[b-1x2m0jbkfu] {
        padding-left: 50px;
        padding-right: 50px;
    }

    .frame-4[b-1x2m0jbkfu],
    .frame-7[b-1x2m0jbkfu],
    .brands-track[b-1x2m0jbkfu] {
        width: 100%;
        flex-wrap: wrap;
        gap: 20px;
        justify-content: center;
    }

    /* Ajustar también el frame-6 en responsive */
    .frame-6[b-1x2m0jbkfu] {
        width: 100% !important;
    }
}

@media (max-width: 1200px) {
    .home-body-1[b-1x2m0jbkfu] {
        height: auto;
        flex-direction: column;
        gap: 20px;
        padding: 20px 50px;
    }

    .banner-gran[b-1x2m0jbkfu],
    .frame-2[b-1x2m0jbkfu] {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .sin-titulo[b-1x2m0jbkfu],
    .renting-sharp-mesa[b-1x2m0jbkfu],
    .img-2[b-1x2m0jbkfu] {
        width: 100%;
        max-width: 800px;
    }

    .card-producto[b-1x2m0jbkfu] {
        border: 1px solid var(--gris-30);
        margin: 10px;
        padding: 0 20px 10px 20px;
    }
}

@media (max-width: 768px) {
    .home-body-2[b-1x2m0jbkfu],
    .home-body-3[b-1x2m0jbkfu],
    .home-body-4[b-1x2m0jbkfu],
    .home-body-5[b-1x2m0jbkfu],
    .pre-footer[b-1x2m0jbkfu] {
        padding: 20px;
    }

        .home-body-2[b-1x2m0jbkfu]::before {
            left: 20px;
        }

    .text-wrapper-3[b-1x2m0jbkfu] {
        font-size: 30px;
    }

    .pre-footer[b-1x2m0jbkfu] {
        flex-direction: column;
        gap: 20px;
    }

    .line-2[b-1x2m0jbkfu] {
        display: none;
    }

    .frame-6[b-1x2m0jbkfu] {
        gap: 10px;
        width: 100% !important;
    }

    .carousel-btn[b-1x2m0jbkfu] {
        width: 40px;
        height: 40px;
    }
}
/* _content/PMCWEB/Components/Pages/Homologados.razor.rz.scp.css */
.homologados[b-68vpiexwlf] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.homologados .frame[b-68vpiexwlf] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    position: relative;
}

.homologados .titulo[b-68vpiexwlf] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.homologados h2[b-68vpiexwlf] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.homologados .iconos[b-68vpiexwlf] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.homologados .div[b-68vpiexwlf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    position: relative;
}

.homologados .frame-2[b-68vpiexwlf] {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 30px;
    align-self: stretch;
    flex: 0 0 auto;
    position: relative;
}

.homologados .text-wrapper[b-68vpiexwlf] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.homologados .component[b-68vpiexwlf] {
    display: inline-flex;
    align-items: flex-end;
    gap: 22px;
    position: relative;
    flex: 0 0 auto;
}

.homologados .line[b-68vpiexwlf] {
    position: relative;
    width: 300px;
    height: 1px;
    object-fit: cover;
}

.homologados .frame-wrapper[b-68vpiexwlf] {
    display: inline-flex;
    align-items: flex-start;
    gap: 10px;
    position: relative;
    flex: 0 0 auto;
}

.homologados .img[b-68vpiexwlf] {
    position: relative;
    width: 24.02px;
    height: 24.02px;
}

.homologados .frame-wrapper img[b-68vpiexwlf] {
    rotate: 90deg;
}

.homologados .input-buscar-producto[b-68vpiexwlf] {
    position: absolute;
    left: 24px;
    top: 50%;
    transform: translateY(-50%);
    right: 24px;
    border: none;
    outline: none;
    background: transparent;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.25px;
    color: #2D2E2E;
    padding: 0;
}

.homologados .boton[b-68vpiexwlf] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.homologados .boton:hover[b-68vpiexwlf] {
    background-color: #80C87C;
}

.homologados .state-layer[b-68vpiexwlf] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.homologados .label-text[b-68vpiexwlf] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.homologados .label-text-2[b-68vpiexwlf] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.homologados .alert p[b-68vpiexwlf] {
    margin-bottom: 0;
}

.homologados .state-layer-wrapper[b-68vpiexwlf] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.homologados .state-layer-wrapper:hover[b-68vpiexwlf] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.homologados .state-layer-wrapper:hover .label-text-2[b-68vpiexwlf] {
    color: var(--blanco);
}

.homologados .tabla-wrapper[b-68vpiexwlf] {
    padding: 15px;
    border-radius: 20px;
    width: 100%;
}

.homologados .tabla-container[b-68vpiexwlf] {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

.homologados .tabla-mejorada[b-68vpiexwlf] {
    width: 100%;
    border-collapse: separate;
    font-family: var(--body-large-font-family, sans-serif);
    font-size: 16px;
    padding: 0;
}

.homologados .tabla-mejorada tbody tr:not(:last-child) td[b-68vpiexwlf] {
    border-bottom: 1px solid #d3d3d3;
}

.homologados .tabla-mejorada thead[b-68vpiexwlf] {
    color: #000000;
    font-weight: bold;
    position: relative;
}

.homologados .tabla-mejorada thead[b-68vpiexwlf]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000;
}

.homologados .tabla-mejorada th[b-68vpiexwlf],
.homologados .tabla-mejorada td[b-68vpiexwlf] {
    padding: 10px;
    min-width: 180px;
    max-width: 180px;
    width: 180px;
    text-align: center;
}

.homologados .tabla-mejorada .th1[b-68vpiexwlf] {
    text-align: left;
    min-width: 500px;
    width: 100%;
}

.homologados .tabla-mejorada .th2[b-68vpiexwlf] {
    min-width: 200px;
    max-width: 200px;
}

.homologados .tabla-mejorada .th3[b-68vpiexwlf] {
    min-width: 100px;
    max-width: 100px;
}

.homologados .tabla-mejorada .th6[b-68vpiexwlf] {
    min-width: 300px;
    max-width: 300px;
}

.homologados .tabla-mejorada th .subheader[b-68vpiexwlf] {
    font-size: 0.8em; /* Ajusta el tamaño según lo necesites */
    color: #888888; /* Color gris */
}

.homologados .tabla-mejorada .td1[b-68vpiexwlf] {
    min-width: 500px;
    width: 100%;
}

.homologados .tabla-mejorada .td1 .td-content[b-68vpiexwlf] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
}

.homologados .tabla-mejorada .td1 img[b-68vpiexwlf] {
    height: 100px;
    width: 100px;
}

.homologados .tabla-mejorada .td1 .producto-info[b-68vpiexwlf] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
}

.homologados .tabla-mejorada .td1 .descripcion[b-68vpiexwlf] {
    color: var(--negro);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.homologados .tabla-mejorada .td1 .referencia[b-68vpiexwlf] {
    color: var(--negro);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}

.homologados .tabla-mejorada .td6 .td-content[b-68vpiexwlf] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 25px;
}

.homologados .state-layer-wrapper-2[b-68vpiexwlf] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.homologados .state-layer-wrapper-2:hover[b-68vpiexwlf] {
    background-color: var(--primario);
    cursor: pointer;
}

.homologados .state-layer-wrapper-2:hover .label-text-3[b-68vpiexwlf] {
    color: var(--blanco);
}

.homologados .label-text-3[b-68vpiexwlf] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.homologados .img[b-68vpiexwlf] {
    position: relative;
    width: 24px;
    height: 24px;
}

.homologados .spinner-border[b-68vpiexwlf] {
    color: var(--blanco);
}

.page-blocker[b-68vpiexwlf] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-68vpiexwlf] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/Integra.razor.rz.scp.css */
.integra[b-llfm6qu22n] {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    gap: 4.6875rem;
    padding: 0rem 7.1875rem 6.25rem;
    position: relative;
    background-color: #ffffff;
    overflow: hidden;
}

    .integra .rectangle[b-llfm6qu22n] {
        position: absolute;
        width: 120rem;
        height: 59.375rem;
        top: 125rem;
        left: 0;
        background-color: var(--secundario);
    }

    .integra .div[b-llfm6qu22n] {
        position: absolute;
        width: 43.9375rem;
        height: 53.9375rem;
        top: 16.6875rem;
        left: 87.5rem;
        background-color: var(--primaryprimary-20);
        border-radius: 0.9375rem;
    }

    .integra .frame[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.875rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .ttulo[b-llfm6qu22n] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 1.25rem 0rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .CESTA[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        margin-top: -0.0625rem;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 1rem;
        letter-spacing: 0;
        line-height: normal;
    }

    .integra .iconos[b-llfm6qu22n] {
        position: absolute;
        width: 1.5rem;
        height: 1.5rem;
        top: 1.1875rem;
        left: 0;
    }

    .integra .frame-2[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4.6875rem;
        padding: 0rem 0rem 4.6875rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .frame-3[b-llfm6qu22n] {
        display: flex;
        align-items: flex-end;
        gap: 4.6875rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .frame-4[b-llfm6qu22n] {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4.6875rem;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .frame-wrapper[b-llfm6qu22n] {
        width: 100%;
        /* O, si prefieres usar propiedades de flex: */
        align-self: stretch;
    }

    .integra .frame-5[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 2.5rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .text-wrapper[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        margin-top: -0.0625rem;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: #000000;
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        font-style: var(--headline-large-font-style);
    }

    .integra .p[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-medium-font-family);
        font-weight: var(--body-medium-font-weight);
        color: #000000;
        font-size: var(--body-medium-font-size);
        letter-spacing: var(--body-medium-letter-spacing);
        line-height: var(--body-medium-line-height);
        font-style: var(--body-medium-font-style);
    }

    .integra .frame-6[b-llfm6qu22n] {
        display: inline-flex;
        align-items: center;
        gap: 6.25rem;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .frame-7[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        width: 31rem;
        align-items: center;
        justify-content: space-between;
        position: relative;
        align-self: stretch;
    }

    .integra .frame-8[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        width: 31rem;
        align-items: center;
        gap: 0.625rem;
        padding: 1.5625rem;
        position: relative;
        flex: 0 0 auto;
        background-color: var(--primaryprimary-10);
        border-radius: 0.9375rem;
        box-shadow: var(--2);
    }

    .integra .text-wrapper-2[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        margin-top: -0.0625rem;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 1.375rem;
        letter-spacing: 0;
        line-height: 1.75rem;
        white-space: nowrap;
    }

    .integra .frame-9[b-llfm6qu22n] {
        display: inline-flex;
        align-items: center;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .text-wrapper-3[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        font-family: var(--body-medium-font-family);
        font-weight: var(--body-medium-font-weight);
        color: #000000;
        font-size: var(--body-medium-font-size);
        letter-spacing: var(--body-medium-letter-spacing);
        line-height: var(--body-medium-line-height);
        white-space: nowrap;
        font-style: var(--body-medium-font-style);
    }

    .integra .img[b-llfm6qu22n] {
        position: relative;
        width: 1.5rem;
        height: 1.5rem;
    }

    .integra .frame-10[b-llfm6qu22n] {
        display: inline-flex;
        align-items: center;
        gap: 0.3125rem;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .alternativa-centro[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 400;
        color: #000000;
        font-size: 0.6875rem;
        letter-spacing: 0.03125rem;
        line-height: 1rem;
        white-space: nowrap;
    }

    .integra .span[b-llfm6qu22n] {
        font-weight: 700;
        letter-spacing: 0.00375rem;
    }

    .integra .text-wrapper-4[b-llfm6qu22n] {
        font-weight: var(--label-small-font-weight);
        letter-spacing: var(--label-small-letter-spacing);
        font-family: var(--label-small-font-family);
        font-style: var(--label-small-font-style);
        line-height: var(--label-small-line-height);
        font-size: var(--label-small-font-size);
    }

    .integra .text-wrapper-5[b-llfm6qu22n] {
        letter-spacing: 0.00375rem;
    }

    .integra .frame-11[b-llfm6qu22n] {
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .line[b-llfm6qu22n] {
        position: relative;
        width: 0.125rem;
        height: 3.25rem;
    }

    .integra .line-2[b-llfm6qu22n] {
        position: relative;
        width: 15.75rem;
        height: 0.1813rem;
    }

    .integra .frame-12[b-llfm6qu22n] {
        position: relative;
        flex: 0 0 auto;
        margin-bottom: -0.0625rem;
        margin-left: 0.3975rem;
        margin-right: 0.3975rem;
    }

    .integra .frame-13[b-llfm6qu22n] {
        display: inline-flex;
        align-items: center;
        gap: 4.6875rem;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .frame-14[b-llfm6qu22n] {
        display: inline-flex;
        gap: 0.625rem;
        align-items: center;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .iconos-wrapper[b-llfm6qu22n] {
        position: relative;
        width: 2.5625rem;
        height: 2.5625rem;
        background-color: var(--primario);
        border-radius: 1.28125rem;
    }

    .integra .iconos-2[b-llfm6qu22n] {
        position: absolute;
        width: 1.5rem;
        height: 1.5rem;
        top: 0.5625rem;
        left: 0.5625rem;
    }

    .integra .text-wrapper-6[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 1.375rem;
        letter-spacing: 0;
        line-height: 1.75rem;
        white-space: nowrap;
    }

    .integra .img-wrapper[b-llfm6qu22n] {
        position: relative;
        width: 2.5625rem;
        height: 2.5625rem;
        background-color: var(--ofertaoferta-60);
        border-radius: 1.28125rem;
    }

    .integra .img-2[b-llfm6qu22n] {
        position: relative;
        flex: 0 0 auto;
    }

    .integra .frame-15[b-llfm6qu22n] {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .div-wrapper[b-llfm6qu22n] {
        display: inline-flex;
        align-items: center;
        gap: 3.125rem;
        padding: 0.9375rem;
        position: relative;
        flex: 0 0 auto;
        border-radius: 0.5rem;
        border: 0.125rem solid;
        border-color: var(--primario);
    }

    .integra .text-wrapper-7[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        margin-top: -0.125rem;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 1.375rem;
        letter-spacing: 0;
        line-height: 1.75rem;
        white-space: nowrap;
    }

    .integra .frame-16[b-llfm6qu22n] {
        display: inline-flex;
        align-items: center;
        gap: 3.125rem;
        padding: 0.9375rem;
        position: relative;
        flex: 0 0 auto;
        border-radius: 0.5rem;
        border: 0.125rem solid;
        border-color: var(--grisgris-40);
    }

    .integra .arrow[b-llfm6qu22n] {
        position: absolute;
        width: 3.25rem;
        height: 2.3125rem;
        top: 23.75rem;
        left: 32.5625rem;
    }

    .integra .frame-wrapper[b-llfm6qu22n] {
        display: flex;
        width: 31.03125rem;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
        background-color: var(--blanco);
        border-radius: 0.9375rem;
        border: 0.0625rem solid;
        border-color: var(--terciario);
    }

    .integra .frame-17[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 3.125rem;
        padding: 3.125rem;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .integra .frame-18[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.25rem;
        padding: 0rem 0rem 1.25rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom-width: 0.0625rem;
        border-bottom-style: solid;
        border-color: var(--grisgris-40);
    }

    .integra .el-cumplimiento-de[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        margin-top: -0.0625rem;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 400;
        color: var(--black-fonts-headings);
        font-size: 1rem;
        letter-spacing: 0.03125rem;
        line-height: 1.5rem;
    }

    .integra .text-wrapper-8[b-llfm6qu22n] {
        letter-spacing: 0.005rem;
    }

    .integra .text-wrapper-9[b-llfm6qu22n] {
        font-weight: 700;
        letter-spacing: 0.005rem;
    }

    .integra .text-wrapper-10[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        font-family: var(--headline-medium-font-family);
        font-weight: var(--headline-medium-font-weight);
        color: #000000;
        font-size: var(--headline-medium-font-size);
        letter-spacing: var(--headline-medium-letter-spacing);
        line-height: var(--headline-medium-line-height);
        font-style: var(--headline-medium-font-style);
    }

    .integra .text-wrapper-11[b-llfm6qu22n] {
        position: relative;
        bottom: 2.5rem;
        width: 31.25rem;
        align-self: stretch;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .integra .aasjoh[b-llfm6qu22n] {
        position: absolute;
        width: 43.75rem;
        height: 35.875rem;
        top: 8.4375rem;
        left: 68.75rem;
        object-fit: cover;
    }

    .integra .frame-19[b-llfm6qu22n] {
        display: flex;
        align-items: flex-start;
        gap: 6.25rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .frame-20[b-llfm6qu22n] {
        width: 31.03125rem;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
        position: relative;
        align-self: stretch;
    }

    .integra .frame-21[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 3.125rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .text-wrapper-12[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        margin-top: -0.0625rem;
        font-family: var(--headline-medium-font-family);
        font-weight: var(--headline-medium-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--headline-medium-font-size);
        letter-spacing: var(--headline-medium-letter-spacing);
        line-height: var(--headline-medium-line-height);
        font-style: var(--headline-medium-font-style);
    }

    .integra .si-no-se-puede[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 400;
        color: transparent;
        font-size: 1rem;
        letter-spacing: 0.03125rem;
        line-height: 1.5rem;
    }

    .integra .text-wrapper-13[b-llfm6qu22n] {
        color: #000000;
        letter-spacing: var(--body-large-letter-spacing);
        font-family: var(--body-large-font-family);
        font-style: var(--body-large-font-style);
        font-weight: var(--body-large-font-weight);
        line-height: var(--body-large-line-height);
        font-size: var(--body-large-font-size);
    }

    .integra .text-wrapper-14[b-llfm6qu22n] {
        font-weight: 700;
        color: #3caa36;
        letter-spacing: 0.005rem;
    }

    .integra .frame-22[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.625rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .frame-23[b-llfm6qu22n] {
        display: flex;
        align-items: flex-start;
        gap: 1.25rem;
        bottom: 1.875rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .text-wrapper-15[b-llfm6qu22n] {
        position: relative;
        flex: 1;
        margin-top: -0.0625rem;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .integra .boton[b-llfm6qu22n] {
        display: flex;
        height: 3.25rem;
        align-items: center;
        align-self: stretch;
        width: 100%;
        background-color: var(--blanco);
        border: 0.0625rem solid var(--alternativo-oscuro);
        flex-direction: column;
        justify-content: center;
        gap: 0.5rem;
        position: relative;
        border-radius: 0.375rem;
        overflow: hidden;
        transition: background-color 0.3s ease, color 0.3s ease;
        text-decoration: none;
    }

        .integra .boton:hover[b-llfm6qu22n] {
            background-color: var(--alternativo-oscuro);
        }

            .integra .boton:hover .label-text[b-llfm6qu22n] {
                color: #ffffff;
            }

    .integra .state-layer[b-llfm6qu22n] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        padding: 0.625rem 0.5rem;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .integra .label-text[b-llfm6qu22n] {
        color: var(--negro);
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .integra .frame-24[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4.6875rem;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .integra .frame-25[b-llfm6qu22n] {
        flex-direction: column;
        padding: 3.125rem;
        width: 100%;
        flex: 0 0 auto;
        border-color: var(--terciario);
        box-shadow: var(--2);
        display: flex;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
        background-color: var(--blanco);
        border-radius: 0.9375rem;
        border: 0.0625rem solid;
    }

    .integra .frame-26[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.25rem;
        padding: 0rem 0rem 2.5rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom-width: 0.0625rem;
        border-bottom-style: dashed;
        border-color: var(--grisgris-30);
    }

    .integra .text-wrapper-16[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        margin-top: -0.0625rem;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 700;
        color: var(--primario);
        font-size: 1.375rem;
        letter-spacing: 0;
        line-height: 1.75rem;
    }

    .integra .frame-27[b-llfm6qu22n] {
        display: flex;
        justify-content: space-between;
        align-self: stretch;
        width: 100%;
        align-items: center;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .icon-neutro-empresa[b-llfm6qu22n] {
        position: relative;
        width: 2.5rem;
        height: 2.5rem;
    }

    .integra .text-wrapper-17[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        white-space: nowrap;
        font-style: var(--body-large-font-style);
    }

    .integra .arrow-2[b-llfm6qu22n] {
        position: relative;
        width: 3.375rem;
        height: 0.9206rem;
    }

    .integra .frame-28[b-llfm6qu22n] {
        display: flex;
        width: 17.5rem;
        align-items: center;
        justify-content: center;
        gap: 0.625rem;
        padding: 0.625rem 0rem;
        position: relative;
        border-radius: 0.5rem;
        border: 0.0625rem solid;
        border-color: var(--primario);
    }

    .integra .text-wrapper-18[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        margin-top: -0.0625rem;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: #000000;
        font-size: var(--title-medium-font-size);
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        font-style: var(--title-medium-font-style);
    }

    .integra .line-3[b-llfm6qu22n] {
        position: relative;
        width: 2.1875rem;
        height: 0.125rem;
    }

    .integra .line-4[b-llfm6qu22n] {
        position: relative;
        width: 0.1625rem;
        height: 3.875rem;
    }

    .integra .frame-29[b-llfm6qu22n] {
        position: relative;
        width: 1.4375rem;
        margin-top: -0.3975rem;
        margin-bottom: -0.3975rem;
        margin-right: -0.0625rem;
    }

    .integra .frame-30[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        width: 22.625rem;
        align-items: center;
        gap: 2.5rem;
        position: relative;
    }

    .integra .text-wrapper-19[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        margin-top: 0.0625rem;
        top: 1.125rem;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .integra .frame-31[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.25rem;
        padding: 2.5rem 0rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom-width: 0.0625rem;
        border-bottom-style: dashed;
        border-color: var(--grisgris-30);
    }

    .integra .frame-32[b-llfm6qu22n] {
        display: flex;
        width: 24.375rem;
        align-items: center;
        justify-content: space-between;
        position: relative;
    }

    .integra .frame-33[b-llfm6qu22n] {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 2.5rem;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .text-wrapper-20[b-llfm6qu22n] {
        margin-top: -0.0625rem;
        position: relative;
        width: fit-content;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        text-align: right;
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        white-space: nowrap;
        font-style: var(--body-large-font-style);
    }

    .integra .text-wrapper-21[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        text-align: right;
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        white-space: nowrap;
        font-style: var(--body-large-font-style);
    }

    .integra .frame-34[b-llfm6qu22n] {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 3.75rem;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .line-5[b-llfm6qu22n] {
        position: relative;
        width: 0.625rem;
        height: 0.125rem;
        margin-top: -0.125rem;
    }

    .integra .line-6[b-llfm6qu22n] {
        position: relative;
        width: 0.625rem;
        height: 0.125rem;
    }

    .integra .line-7[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        width: 0.1875rem;
    }

    .integra .arrow-3[b-llfm6qu22n] {
        position: relative;
        width: 2.625rem;
        height: 0.9206rem;
        margin-right: -0.0625rem;
    }

    .integra .frame-35[b-llfm6qu22n] {
        display: inline-flex;
        gap: 3.125rem;
        align-items: center;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .arrow-4[b-llfm6qu22n] {
        position: relative;
        width: 4.625rem;
        height: 0.9206rem;
    }

    .integra .frame-36[b-llfm6qu22n] {
        display: flex;
        width: 16.875rem;
        align-items: center;
        justify-content: space-between;
        position: relative;
    }

    .integra .arrow-5[b-llfm6qu22n] {
        position: relative;
        width: 7.625rem;
        height: 0.9206rem;
        margin-right: -0.0625rem;
    }

    .integra .frame-37[b-llfm6qu22n] {
        display: flex;
        width: 25rem;
        align-items: center;
        justify-content: center;
        gap: 0.625rem;
        padding: 0.625rem 0rem;
        position: relative;
        border-radius: 0.5rem;
        border: 0.0625rem solid;
        border-color: var(--primario);
    }

    .integra .text-wrapper-22[b-llfm6qu22n] {
        position: relative;
        width: fit-content;
        margin-top: -0.0625rem;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: #000000;
        font-size: var(--title-medium-font-size);
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .integra .logo-integra-wrapper[b-llfm6qu22n] {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.625rem;
        padding: 0rem 2.25rem 0rem 0.4375rem;
        position: relative;
        flex: 0 0 auto;
    }

    .integra .logo-integra[b-llfm6qu22n] {
        position: relative;
        width: 4.5625rem;
        height: 3.625rem;
    }

    .integra .frame-38[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.25rem;
        padding: 2.5rem 0rem 0rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .arrow-6[b-llfm6qu22n] {
        position: relative;
        width: 9.25rem;
        height: 0.9206rem;
    }

    .integra .frame-39[b-llfm6qu22n] {
        display: inline-flex;
        align-items: center;
        gap: 1.5625rem;
        padding: 3.125rem;
        position: relative;
        flex: 0 0 auto;
        background-color: var(--blanco);
        border-radius: 0.5rem;
        border: 0.125rem solid;
        border-color: var(--primario);
        box-shadow: var(--2);
    }

    .integra .frame-40[b-llfm6qu22n] {
        position: relative;
        align-self: stretch;
        width: 0.96875rem;
    }

    .integra .component[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        width: 105.625rem;
        align-items: flex-start;
        gap: 3.125rem;
        padding: 3.125rem;
        position: relative;
        flex: 0 0 auto;
        background-color: var(--grisgris-10);
        border-radius: 0.9375rem;
        box-shadow: var(--3);
    }

    .integra .frame-41[b-llfm6qu22n] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 1.5rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .columna[b-llfm6qu22n] {
        align-self: stretch;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.5rem;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .integra .input-wrapper[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .integra .input[b-llfm6qu22n] {
        display: flex;
        align-items: flex-start;
        gap: 0.625rem;
        padding: 1.0625rem 1rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        background-color: var(--blanco);
        border-radius: 0.375rem;
    }

    .integra .poblaci-n[b-llfm6qu22n] {
        position: relative;
        flex: 1;
        margin-top: -0.0625rem;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        color: var(--gris-50);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .integra .columna-2[b-llfm6qu22n] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.5rem;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .integra .emial_medidas_alternativas[b-llfm6qu22n] {
        padding: 1.0625rem 1rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        background-color: var(--blanco);
        border-radius: 0.375rem;
        border: none;
        flex: 1;
        margin-top: -0.0625rem;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        color: var(--gris-50);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .integra .input-trabajadores[b-llfm6qu22n] {
        padding: 1.0625rem 1rem;
        position: relative;
        align-self: stretch;
        width: 100%;
        background-color: var(--blanco);
        border-radius: 0.375rem;
        border: none;
        flex: 1;
        margin-top: -0.0625rem;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        color: var(--gris-50);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

.checkbox-terminos[b-llfm6qu22n] {
    -webkit-appearance: none;
    appearance: none;
    width: 0.9375rem;
    height: 0.9375rem;
    border: 0.0625rem solid #000;
    border-radius: 50%;
    outline: none;
    cursor: pointer;
    vertical-align: middle;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

    .checkbox-terminos:checked[b-llfm6qu22n] {
        background-color: #3caa36;
        border-color: #3caa36;
    }

.integra .frame-42[b-llfm6qu22n] {
    display: flex;
    width: 46.53125rem;
    height: 1.25rem;
    align-items: center;
    gap: 1.25rem;
    position: relative;
}

.integra .component-2[b-llfm6qu22n] {
    position: relative;
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 0.4375rem;
    border: 0.0625rem solid;
    border-color: #000000;
    bottom: 0.5rem;
}

.integra .text-wrapper-23[b-llfm6qu22n] {
    position: relative;
    width: fit-content;
    margin-top: -0.0625rem;
    font-family: var(--label-large-font-family);
    font-weight: var(--label-large-font-weight);
    color: #000000;
    font-size: var(--label-large-font-size);
    letter-spacing: var(--label-large-letter-spacing);
    line-height: var(--label-large-line-height);
    white-space: nowrap;
    font-style: var(--label-large-font-style);
}

.integra .state-layer-wrapper[b-llfm6qu22n] {
    display: flex;
    width: 31.8125rem;
    height: 3.375rem;
    align-items: flex-end;
    background-color: var(--primario);
    flex-direction: column;
    justify-content: center;
    gap: 0.5rem;
    position: relative;
    border-radius: 0.375rem;
    overflow: hidden;
}

.integra .label-text-2[b-llfm6qu22n] {
    position: relative;
    width: fit-content;
    color: green;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.integra .frame-43[b-llfm6qu22n] {
    display: flex;
    align-items: flex-start;
    gap: 2.5rem;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.integra .frame-44[b-llfm6qu22n] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6rem;
    position: relative;
    flex: 1;
    flex-grow: 1;
}

.integra .line-8[b-llfm6qu22n] {
    position: relative;
    align-self: stretch;
    width: 100%;
    height: 0.0625rem;
    margin-top: -0.0625rem;
    object-fit: cover;
}

.integra .n-MERO-DE-EMPLEADOS[b-llfm6qu22n] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans", Helvetica;
    font-weight: 400;
    color: #000000;
    font-size: 1.375rem;
    letter-spacing: 0;
    line-height: 1.75rem;
}

.integra .text-wrapper-24[b-llfm6qu22n] {
    position: relative;
    align-self: stretch;
    font-family: var(--title-large-font-family);
    font-weight: var(--title-large-font-weight);
    color: #000000;
    font-size: var(--title-large-font-size);
    letter-spacing: var(--title-large-letter-spacing);
    line-height: var(--title-large-line-height);
    font-style: var(--title-large-font-style);
}

.integra .text-wrapper-25[b-llfm6qu22n] {
    position: relative;
    align-self: stretch;
    font-family: var(--body-medium-font-family);
    font-weight: var(--body-medium-font-weight);
    color: var(--grisgris-60);
    font-size: var(--body-medium-font-size);
    letter-spacing: var(--body-medium-letter-spacing);
    line-height: var(--body-medium-line-height);
    font-style: var(--body-medium-font-style);
}

.integra .frame-45[b-llfm6qu22n] {
    display: flex;
    align-items: flex-start;
    gap: 4.6875rem;
    padding: 4.6875rem 0rem 0rem;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.integra .frame-46[b-llfm6qu22n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 3.125rem;
    position: relative;
    flex: 1;
    align-self: stretch;
    flex-grow: 1;
    background-color: var(--blanco);
    border-radius: 0.9375rem;
    box-shadow: var(--2);
}

.integra .text-wrapper-26[b-llfm6qu22n] {
    position: relative;
    width: 14.6369rem;
    font-family: var(--headline-medium-font-family);
    font-weight: var(--headline-medium-font-weight);
    color: #000000;
    font-size: var(--headline-medium-font-size);
    text-align: center;
    letter-spacing: var(--headline-medium-letter-spacing);
    line-height: var(--headline-medium-line-height);
    font-style: var(--headline-medium-font-style);
}

.integra .frame-47[b-llfm6qu22n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 3.125rem;
    position: relative;
    flex: 1;
    flex-grow: 1;
    background-color: var(--blanco);
    border-radius: 0.9375rem;
    box-shadow: var(--2);
}

.integra .text-wrapper-27[b-llfm6qu22n] {
    position: relative;
    width: 14.6369rem;
    margin-top: -0.0625rem;
    font-family: var(--headline-medium-font-family);
    font-weight: var(--headline-medium-font-weight);
    color: #000000;
    font-size: var(--headline-medium-font-size);
    text-align: center;
    letter-spacing: var(--headline-medium-letter-spacing);
    line-height: var(--headline-medium-line-height);
    font-style: var(--headline-medium-font-style);
}

.integra .text-wrapper-28[b-llfm6qu22n] {
    position: relative;
    width: fit-content;
    font-family: var(--body-medium-font-family);
    font-weight: var(--body-medium-font-weight);
    color: #000000;
    font-size: var(--body-medium-font-size);
    text-align: center;
    letter-spacing: var(--body-medium-letter-spacing);
    line-height: var(--body-medium-line-height);
    white-space: nowrap;
    font-style: var(--body-medium-font-style);
}

.integra .frame-48[b-llfm6qu22n] {
    display: flex;
    width: 105.625rem;
    align-items: flex-start;
    gap: 6.25rem;
    position: relative;
    flex: 0 0 auto;
}

.integra .frame-49[b-llfm6qu22n] {
    display: flex;
    align-items: flex-start;
    position: relative;
    flex: 1;
    align-self: stretch;
    flex-grow: 1;
    margin-top: -0.0625rem;
    margin-bottom: -0.0625rem;
    margin-left: -0.0625rem;
    background-color: var(--blanco);
    border-radius: 0.9375rem;
    border: 0.0625rem solid;
    border-color: var(--grisgris-50);
}

.integra .capa-wrapper[b-llfm6qu22n] {
    display: flex;
    flex-direction: column;
    width: 9.375rem;
    align-items: center;
    justify-content: flex-end;
    gap: 0.625rem;
    padding: 3.125rem 0rem 0rem;
    position: relative;
    align-self: stretch;
    background-color: var(--grisgris-30);
    border-radius: 0.9375rem;
}

.integra .capa[b-llfm6qu22n] {
    position: relative;
    width: 7.375rem;
    height: 17.5rem;
}

.integra .overlap-group[b-llfm6qu22n] {
    position: relative;
    height: 17.5rem;
}

.integra .group[b-llfm6qu22n] {
    position: absolute;
    width: 5.5rem;
    height: 5.5rem;
    top: 0;
    left: 1.25rem;
}

.integra .vector[b-llfm6qu22n] {
    position: absolute;
    width: 6.25rem;
    height: 7.4375rem;
    top: 10.0625rem;
    left: 0.5rem;
}

.integra .vector-2[b-llfm6qu22n] {
    position: absolute;
    width: 5.125rem;
    height: 6.8125rem;
    top: 3.8125rem;
    left: 1.4375rem;
}

.integra .vector-3[b-llfm6qu22n] {
    position: absolute;
    width: 3.1875rem;
    height: 5rem;
    top: 6.375rem;
    left: 2.375rem;
}

.integra .vector-4[b-llfm6qu22n] {
    position: absolute;
    width: 1rem;
    height: 0.0625rem;
    top: 6.9375rem;
    left: 4.1875rem;
}

.integra .vector-5[b-llfm6qu22n] {
    position: absolute;
    width: 1rem;
    height: 0.0625rem;
    top: 7.3125rem;
    left: 4.1875rem;
}

.integra .vector-6[b-llfm6qu22n] {
    position: absolute;
    width: 1rem;
    height: 0.0625rem;
    top: 7.625rem;
    left: 4.1875rem;
}

.integra .vector-7[b-llfm6qu22n] {
    position: absolute;
    width: 2.375rem;
    height: 0.1875rem;
    top: 8.6875rem;
    left: 2.8125rem;
}

.integra .b[b-llfm6qu22n] {
    position: absolute;
    width: 4.1875rem;
    height: 1.625rem;
    top: 9.25rem;
    left: 0.625rem;
}

.integra .vector-8[b-llfm6qu22n] {
    position: absolute;
    width: 2.3125rem;
    height: 5.1875rem;
    top: 5rem;
    left: 0;
}

.integra .c[b-llfm6qu22n] {
    position: absolute;
    width: 4.1875rem;
    height: 1.1875rem;
    top: 9.1875rem;
    left: 2.4375rem;
}

.integra .vector-9[b-llfm6qu22n] {
    position: absolute;
    width: 1.875rem;
    height: 5.3125rem;
    top: 5rem;
    left: 5.5rem;
}

.integra .vector-10[b-llfm6qu22n] {
    position: absolute;
    width: 1.125rem;
    height: 1.375rem;
    top: 6.75rem;
    left: 2.6875rem;
}

.integra .vector-11[b-llfm6qu22n] {
    position: absolute;
    width: 0.3125rem;
    height: 0.5rem;
    top: 7.625rem;
    left: 2.6875rem;
}

.integra .vector-12[b-llfm6qu22n] {
    position: absolute;
    width: 0.25rem;
    height: 0.5rem;
    top: 7.625rem;
    left: 3.5625rem;
}

.integra .group-2[b-llfm6qu22n] {
    position: absolute;
    width: 0.75rem;
    height: 0.75rem;
    top: 6.9375rem;
    left: 2.9375rem;
}

.integra .vector-13[b-llfm6qu22n] {
    position: absolute;
    width: 0.8125rem;
    height: 0.6875rem;
    top: 7.4375rem;
    left: 2.875rem;
}

.integra .frame-50[b-llfm6qu22n] {
    padding: 3.125rem;
    flex: 1;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
}

.integra .text-wrapper-29[b-llfm6qu22n] {
    position: relative;
    align-self: stretch;
    margin-top: -0.0625rem;
    font-family: var(--headline-small-font-family);
    font-weight: var(--headline-small-font-weight);
    color: #000000;
    font-size: var(--headline-small-font-size);
    letter-spacing: var(--headline-small-letter-spacing);
    line-height: var(--headline-small-line-height);
    font-style: var(--headline-small-font-style);
}

.integra .boton-2[b-llfm6qu22n] {
    display: inline-flex;
    height: 3.3125rem;
    align-items: center;
    background-color: var(--blanco);
    border: 0.0625rem solid;
    border-color: var(--primario);
    flex-direction: column;
    justify-content: center;
    gap: 0.5rem;
    position: relative;
    border-radius: 0.375rem;
    overflow: hidden;
    text-decoration: none;
}

.integra .label-text-3[b-llfm6qu22n] {
    color: var(--primario);
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.integra .boton-2:hover[b-llfm6qu22n] {
    background-color: #3caa36;
}

    .integra .boton-2:hover .label-text-3[b-llfm6qu22n] {
        color: #ffffff;
    }

.integra .frame-51[b-llfm6qu22n] {
    flex: 1;
    flex-grow: 1;
    margin-top: -0.0625rem;
    margin-bottom: -0.0625rem;
    margin-right: -0.0625rem;
    border-color: var(--primario);
    display: flex;
    align-items: flex-start;
    position: relative;
    align-self: stretch;
    background-color: var(--blanco);
    border-radius: 0.9375rem;
    border: 0.0625rem solid;
}

.integra .frame-52[b-llfm6qu22n] {
    display: flex;
    flex-direction: column;
    width: 9.375rem;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 3.125rem 0rem 0rem;
    position: relative;
    align-self: stretch;
    background-color: var(--primaryprimary-10);
    border-radius: 0.9375rem;
}

.integra .overlap-group-wrapper[b-llfm6qu22n] {
    position: relative;
    width: 7.5rem;
    height: 11.25rem;
}

.integra .overlap-group-2[b-llfm6qu22n] {
    position: relative;
    width: 6.9375rem;
    height: 11.25rem;
    left: 0.5625rem;
}

.integra .vector-14[b-llfm6qu22n] {
    position: absolute;
    width: 6.3125rem;
    height: 6.5rem;
    top: 0;
    left: 0.625rem;
}

.integra .b-2[b-llfm6qu22n] {
    position: absolute;
    width: 1.375rem;
    height: 0.9375rem;
    top: 4.4375rem;
    left: 0.3125rem;
}

.integra .vector-15[b-llfm6qu22n] {
    position: absolute;
    width: 3.125rem;
    height: 2.125rem;
    top: 3.125rem;
    left: 0.625rem;
}

.integra .vector-16[b-llfm6qu22n] {
    position: absolute;
    width: 1.1875rem;
    height: 1.25rem;
    top: 1.3125rem;
    left: 3.3125rem;
}

.integra .group-3[b-llfm6qu22n] {
    position: absolute;
    width: 1.4375rem;
    height: 2.25rem;
    top: 8.625rem;
    left: 3rem;
}

.integra .group-4[b-llfm6qu22n] {
    position: absolute;
    width: 1.4375rem;
    height: 2.125rem;
    top: 9.125rem;
    left: 3.75rem;
}

.integra .vector-17[b-llfm6qu22n] {
    position: absolute;
    width: 2.3125rem;
    height: 3.3125rem;
    top: 4.3125rem;
    left: 2.875rem;
}

.integra .vector-18[b-llfm6qu22n] {
    position: absolute;
    width: 1.8125rem;
    height: 3rem;
    top: 2.25rem;
    left: 2.9375rem;
}

.integra .vector-19[b-llfm6qu22n] {
    position: absolute;
    width: 2.9375rem;
    height: 4.875rem;
    top: 4.8125rem;
    left: 1.8125rem;
}

.integra .vector-20[b-llfm6qu22n] {
    position: absolute;
    width: 3rem;
    height: 5.875rem;
    top: 2.375rem;
    left: 3.75rem;
}

.integra .vector-21[b-llfm6qu22n] {
    position: absolute;
    width: 1rem;
    height: 2.5rem;
    top: 2.5625rem;
    left: 2.875rem;
}

.integra .c-2[b-llfm6qu22n] {
    position: absolute;
    width: 1rem;
    height: 1.375rem;
    top: 4.5625rem;
    left: 5.9375rem;
}

.integra .vector-22[b-llfm6qu22n] {
    position: absolute;
    width: 2.1875rem;
    height: 3.0625rem;
    top: 2.5rem;
    left: 4.5rem;
}

.integra .vector-23[b-llfm6qu22n] {
    position: absolute;
    width: 1.0625rem;
    height: 1.0625rem;
    top: 1.1875rem;
    left: 3.375rem;
}

.integra .vector-24[b-llfm6qu22n] {
    position: absolute;
    width: 1.5rem;
    height: 1.6875rem;
    top: 0.875rem;
    left: 3.375rem;
}

.integra .vector-25[b-llfm6qu22n] {
    position: absolute;
    width: 2.375rem;
    height: 0.0625rem;
    top: 2rem;
    left: 0.25rem;
}

.integra .group-5[b-llfm6qu22n] {
    position: absolute;
    width: 3.0625rem;
    height: 1.0625rem;
    top: 1.25rem;
    left: 0;
}

.integra .vector-26[b-llfm6qu22n] {
    position: absolute;
    width: 2.5625rem;
    height: 0.0625rem;
    top: 4rem;
    left: 0.25rem;
}

.integra .group-6[b-llfm6qu22n] {
    position: absolute;
    width: 2.3125rem;
    height: 1.0625rem;
    top: 3.1875rem;
    left: 0.125rem;
}

.integra .boton-3[b-llfm6qu22n] {
    display: flex;
    height: 3.375rem;
    align-items: center;
    width: 100%;
    background-color: var(--primario);
    flex-direction: column;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 0.375rem;
    overflow: hidden;
    border: none;
    transition: background-color 0.3s ease;
    text-decoration: none;
}

    .integra .boton-3:hover[b-llfm6qu22n] {
        background-color: var(--blanco);
        border: 0.125rem solid #3caa36;
        outline: none;
    }

        .integra .boton-3:hover .label-text-2[b-llfm6qu22n] {
            color: var(--primario);
        }

.integra .arrow-7[b-llfm6qu22n] {
    position: absolute;
    width: 2.3125rem;
    height: 2.375rem;
    top: 46.5625rem;
    left: 50.375rem;
}

.integra .arrow-8[b-llfm6qu22n] {
    position: absolute;
    width: 2.3125rem;
    height: 2.375rem;
    top: 106.875rem;
    left: 50.375rem;
}


/* ================================
   Pantallas grandes (máx-width: 90rem ≈ 1440px)
================================ */
@media (max-width: 90rem) {
    .integra[b-llfm6qu22n] {
        padding: 0rem 5rem 6.25rem;
        gap: 3.125rem;
    }

        .integra .div[b-llfm6qu22n] {
            width: 40rem;
            left: 15rem;
            top: 12rem;
        }
        /* Ajustes en elementos posicionados */
        .integra .rectangle[b-llfm6qu22n] {
            width: 100%;
            top: 10rem;
            /* Se puede ajustar la altura si es necesario */
        }
        /* Layouts internos */
        .integra .frame[b-llfm6qu22n] {
            flex-direction: column;
        }

        .integra .ttulo[b-llfm6qu22n] {
            padding: 1rem 0;
        }
        /* Tipografías */
        .integra .CESTA[b-llfm6qu22n],
        .integra .text-wrapper[b-llfm6qu22n],
        .integra .p[b-llfm6qu22n] {
            font-size: 0.9375rem;
        }
        /* Iconos e imágenes */
        .integra .iconos[b-llfm6qu22n] {
            width: 1.25rem;
            height: 1.25rem;
            top: 1rem;
        }

        .integra .img[b-llfm6qu22n] {
            width: 1.25rem;
            height: 1.25rem;
        }
        /* Contenedores secundarios */
        .integra .frame-2[b-llfm6qu22n] {
            gap: 2.5rem;
            padding-bottom: 3rem;
        }

        .integra .frame-3[b-llfm6qu22n] {
            gap: 2.5rem;
        }

        .integra .frame-4[b-llfm6qu22n] {
            gap: 2.5rem;
        }

        .integra .frame-5[b-llfm6qu22n] {
            gap: 2rem;
        }

        .integra .frame-6[b-llfm6qu22n] {
            gap: 2.5rem;
        }

        .integra .frame-7[b-llfm6qu22n] {
            width: 30rem;
        }

        .integra .frame-8[b-llfm6qu22n] {
            width: 30rem;
            padding: 1rem;
        }
        /* Ajustes en textos secundarios */
        .integra .text-wrapper-2[b-llfm6qu22n] {
            font-size: 1.25rem;
        }

        .integra .text-wrapper-3[b-llfm6qu22n] {
            font-size: 0.875rem;
        }
        /* Espaciados internos */
        .integra .frame-10[b-llfm6qu22n] {
            gap: 0.5rem;
        }

        .integra .alternativa-centro[b-llfm6qu22n] {
            font-size: 0.75rem;
        }

        .integra .text-wrapper-4[b-llfm6qu22n] {
            font-size: 0.75rem;
        }

        .integra .frame-11[b-llfm6qu22n] {
            gap: 1rem;
        }

        .integra .line[b-llfm6qu22n] {
            height: 3rem;
        }

        .integra .line-2[b-llfm6qu22n] {
            width: 15rem;
            height: 0.18rem;
        }

        .integra .frame-12[b-llfm6qu22n] {
            margin-left: 0.5rem;
            margin-right: 0.5rem;
        }

        .integra .frame-13[b-llfm6qu22n] {
            gap: 2rem;
        }

        .integra .frame-14[b-llfm6qu22n] {
            gap: 0.625rem;
        }
        /* Iconos con fondo y bordes */
        .integra .iconos-wrapper[b-llfm6qu22n] {
            width: 2.25rem;
            height: 2.25rem;
            border-radius: 1.125rem;
        }

        .integra .iconos-2[b-llfm6qu22n] {
            width: 1.125rem;
            height: 1.125rem;
            top: 0.5rem;
            left: 0.5rem;
        }

        .integra .text-wrapper-6[b-llfm6qu22n] {
            font-size: 1.125rem;
        }

        .integra .img-wrapper[b-llfm6qu22n] {
            width: 2.25rem;
            height: 2.25rem;
            border-radius: 1.125rem;
        }
        /* Contenedores de interacciones */
        .integra .frame-15[b-llfm6qu22n] {
            padding: 1rem;
        }

        .integra .div-wrapper[b-llfm6qu22n] {
            gap: 2rem;
            padding: 0.75rem;
        }

        .integra .text-wrapper-7[b-llfm6qu22n] {
            font-size: 1.125rem;
        }

        .integra .frame-16[b-llfm6qu22n] {
            gap: 2rem;
            padding: 0.75rem;
        }

        .integra .arrow[b-llfm6qu22n] {
            width: 3rem;
            height: 2.25rem;
            top: 9rem;
            left: 25rem;
        }

        .integra .frame-wrapper[b-llfm6qu22n] {
            width: 30rem;
        }
        /* Contenedores de secciones */
        .integra .frame-17[b-llfm6qu22n] {
            padding: 2rem;
            gap: 2rem;
        }

        .integra .frame-18[b-llfm6qu22n] {
            padding-bottom: 2rem;
            gap: 1.5rem;
        }

        .integra .el-cumplimiento-de[b-llfm6qu22n] {
            font-size: 0.875rem;
        }

        .integra .text-wrapper-10[b-llfm6qu22n] {
            font-size: 1.125rem;
        }

        .integra .text-wrapper-11[b-llfm6qu22n] {
            bottom: 2rem;
            width: 31.25rem;
        }

        .integra .aasjoh[b-llfm6qu22n] {
            width: 30rem;
            height: 22rem;
            top: 8rem;
            left: 20rem;
        }

        .integra .frame-19[b-llfm6qu22n] {
            gap: 2.5rem;
        }

        .integra .frame-20[b-llfm6qu22n] {
            width: 30rem;
        }

        .integra .frame-21[b-llfm6qu22n] {
            gap: 2rem;
        }

        .integra .text-wrapper-12[b-llfm6qu22n] {
            font-size: 1rem;
        }

        .integra .si-no-se-puede[b-llfm6qu22n] {
            font-size: 0.9375rem;
        }

        .integra .text-wrapper-13[b-llfm6qu22n] {
            font-size: 0.9375rem;
        }

        .integra .frame-22[b-llfm6qu22n] {
            gap: 0.625rem;
        }

        .integra .frame-23[b-llfm6qu22n] {
            gap: 1rem;
        }

        .integra .text-wrapper-15[b-llfm6qu22n] {
            font-size: 0.9375rem;
        }
        /* Botones y estados */
        .integra .boton[b-llfm6qu22n] {
            height: 3rem;
            gap: 0.5rem;
        }

        .integra .state-layer[b-llfm6qu22n] {
            padding: 0.625rem 0.5rem;
        }

        .integra .label-text[b-llfm6qu22n] {
            font-size: 1rem;
        }
        /* Secciones internas */
        .integra .frame-24[b-llfm6qu22n] {
            gap: 2rem;
        }

        .integra .frame-25[b-llfm6qu22n] {
            padding: 2rem;
        }

        .integra .frame-26[b-llfm6qu22n] {
            gap: 1rem;
            padding-bottom: 2rem;
        }

        .integra .text-wrapper-16[b-llfm6qu22n] {
            font-size: 1.125rem;
        }

        .integra .frame-27[b-llfm6qu22n] {
            gap: 2rem;
        }

        .integra .icon-neutro-empresa[b-llfm6qu22n] {
            width: 2rem;
            height: 2rem;
        }

        .integra .text-wrapper-17[b-llfm6qu22n] {
            font-size: 1rem;
        }

        .integra .arrow-2[b-llfm6qu22n] {
            width: 3rem;
            height: 1rem;
        }

        .integra .frame-28[b-llfm6qu22n] {
            width: 18rem;
            gap: 0.5rem;
            padding: 0.625rem 0;
        }

        .integra .text-wrapper-18[b-llfm6qu22n] {
            font-size: 1rem;
        }

        .integra .line-3[b-llfm6qu22n] {
            width: 2rem;
        }

        .integra .line-4[b-llfm6qu22n] {
            width: 0.125rem;
            height: 3rem;
        }

        .integra .frame-29[b-llfm6qu22n] {
            margin-top: -0.5rem;
            margin-bottom: -0.5rem;
            margin-right: -0.0625rem;
        }

        .integra .frame-30[b-llfm6qu22n] {
            width: 22rem;
            gap: 2rem;
        }

        .integra .text-wrapper-19[b-llfm6qu22n] {
            margin-top: 0.125rem;
            top: 1rem;
            font-size: 0.9375rem;
        }

        .integra .frame-31[b-llfm6qu22n] {
            gap: 1.5rem;
            padding: 2rem 0;
        }

        .integra .frame-32[b-llfm6qu22n] {
            width: 24rem;
        }

        .integra .frame-33[b-llfm6qu22n] {
            gap: 2rem;
        }

        .integra .text-wrapper-20[b-llfm6qu22n],
        .integra .text-wrapper-21[b-llfm6qu22n] {
            font-size: 0.9375rem;
        }

        .integra .frame-34[b-llfm6qu22n] {
            gap: 3rem;
        }

        .integra .line-5[b-llfm6qu22n],
        .integra .line-6[b-llfm6qu22n] {
            width: 0.625rem;
            height: 0.125rem;
        }

        .integra .line-7[b-llfm6qu22n] {
            width: 0.1875rem;
        }

        .integra .arrow-3[b-llfm6qu22n] {
            width: 2.5rem;
            height: 1rem;
            margin-right: -0.0625rem;
        }

        .integra .frame-35[b-llfm6qu22n] {
            gap: 2rem;
        }

        .integra .arrow-4[b-llfm6qu22n] {
            width: 4rem;
            height: 1rem;
        }

        .integra .frame-36[b-llfm6qu22n] {
            width: 16rem;
        }

        .integra .arrow-5[b-llfm6qu22n] {
            width: 7rem;
            height: 1rem;
            margin-right: -0.0625rem;
        }

        .integra .frame-37[b-llfm6qu22n] {
            width: 25rem;
            gap: 0.5rem;
            padding: 0.625rem;
        }

        .integra .text-wrapper-22[b-llfm6qu22n] {
            font-size: 1rem;
        }

        .integra .logo-integra-wrapper[b-llfm6qu22n] {
            padding: 0rem 2rem 0rem 0.5rem;
            gap: 0.625rem;
        }

        .integra .logo-integra[b-llfm6qu22n] {
            width: 4rem;
            height: 3.125rem;
        }

        .integra .frame-38[b-llfm6qu22n] {
            gap: 1.5rem;
            padding: 2rem 0;
        }

        .integra .arrow-6[b-llfm6qu22n] {
            width: 9rem;
            height: 1rem;
        }

        .integra .frame-39[b-llfm6qu22n] {
            gap: 1rem;
            padding: 2rem;
        }

        .integra .frame-40[b-llfm6qu22n] {
            width: 1rem;
        }

        .integra .component[b-llfm6qu22n] {
            width: 100%;
            gap: 3rem;
            padding: 2rem;
        }

        .integra .frame-41[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .columna[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .input-wrapper[b-llfm6qu22n] {
            gap: 1rem;
        }

        .integra .input[b-llfm6qu22n] {
            padding: 1rem;
            gap: 0.625rem;
        }

        .integra .poblaci-n[b-llfm6qu22n] {
            font-size: 0.875rem;
            margin-top: -0.0625rem;
        }

        .integra .columna-2[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .emial_medidas_alternativas[b-llfm6qu22n],
        .integra .input-trabajadores[b-llfm6qu22n] {
            padding: 1rem;
        }

    .checkbox-terminos[b-llfm6qu22n] {
        width: 0.875rem;
        height: 0.875rem;
        border-width: 0.0625rem;
    }

    .integra .frame-42[b-llfm6qu22n] {
        width: 46.5rem;
        height: 1.25rem;
        gap: 1rem;
    }

    .integra .component-2[b-llfm6qu22n] {
        width: 0.875rem;
        height: 0.875rem;
    }

    .integra .text-wrapper-23[b-llfm6qu22n] {
        font-size: 0.9375rem;
    }

    .integra .state-layer-wrapper[b-llfm6qu22n] {
        width: 31.75rem;
        height: 3rem;
    }

    .integra .label-text-2[b-llfm6qu22n] {
        font-size: 1rem;
    }

    .integra .frame-43[b-llfm6qu22n] {
        gap: 1.5rem;
    }

    .integra .frame-44[b-llfm6qu22n] {
        gap: 3rem;
    }

    .integra .line-8[b-llfm6qu22n] {
        height: 0.125rem;
    }

    .integra .n-MERO-DE-EMPLEADOS[b-llfm6qu22n] {
        font-size: 1rem;
    }

    .integra .text-wrapper-24[b-llfm6qu22n] {
        font-size: 1rem;
    }

    .integra .text-wrapper-25[b-llfm6qu22n] {
        font-size: 0.9375rem;
    }

    .integra .frame-45[b-llfm6qu22n] {
        gap: 3.125rem;
        padding-top: 3.125rem;
    }

    .integra .frame-46[b-llfm6qu22n] {
        padding: 3.125rem;
        gap: 0.625rem;
    }

    .integra .text-wrapper-26[b-llfm6qu22n] {
        width: 14.5rem;
        font-size: 1rem;
    }

    .integra .frame-47[b-llfm6qu22n] {
        padding: 3.125rem;
        gap: 0.625rem;
    }

    .integra .text-wrapper-27[b-llfm6qu22n] {
        width: 14.5rem;
        font-size: 1rem;
    }

    .integra .text-wrapper-28[b-llfm6qu22n] {
        font-size: 0.9375rem;
    }

    .integra .frame-48[b-llfm6qu22n] {
        width: 100%;
        gap: 3.125rem;
    }

    .integra .frame-49[b-llfm6qu22n] {
        margin-top: -0.0625rem;
        margin-bottom: -0.0625rem;
        margin-left: -0.0625rem;
    }

    .integra .capa-wrapper[b-llfm6qu22n] {
        width: 9.375rem;
        padding: 3.125rem 0;
    }

    .integra .capa[b-llfm6qu22n] {
        width: 7rem;
        height: 17.5rem;
    }

    .integra .overlap-group[b-llfm6qu22n] {
        height: 17.5rem;
    }

    .integra .group[b-llfm6qu22n] {
        width: 5.5rem;
        height: 5.5rem;
    }

    .integra .vector[b-llfm6qu22n] {
        width: 6.25rem;
        height: 7.4375rem;
        top: 10rem;
        left: 0.5rem;
    }

    .integra .vector-2[b-llfm6qu22n] {
        width: 5rem;
        height: 6.75rem;
        top: 4rem;
        left: 1.5rem;
    }

    .integra .vector-3[b-llfm6qu22n] {
        width: 3rem;
        height: 5rem;
        top: 6rem;
        left: 2.5rem;
    }

    .integra .vector-4[b-llfm6qu22n] {
        width: 1rem;
        height: 0.0625rem;
        top: 7rem;
        left: 4rem;
    }

    .integra .vector-5[b-llfm6qu22n] {
        width: 1rem;
        height: 0.0625rem;
        top: 7.25rem;
        left: 4rem;
    }

    .integra .vector-6[b-llfm6qu22n] {
        width: 1rem;
        height: 0.0625rem;
        top: 7.5rem;
        left: 4rem;
    }

    .integra .vector-7[b-llfm6qu22n] {
        width: 2.375rem;
        height: 0.1875rem;
        top: 8.75rem;
        left: 2.75rem;
    }

    .integra .b[b-llfm6qu22n] {
        width: 4rem;
        height: 1.625rem;
        top: 9rem;
        left: 0.625rem;
    }

    .integra .vector-8[b-llfm6qu22n] {
        width: 2.25rem;
        height: 5rem;
        top: 5rem;
        left: 0;
    }

    .integra .c[b-llfm6qu22n] {
        width: 4rem;
        height: 1.1875rem;
        top: 9rem;
        left: 2.5rem;
    }

    .integra .vector-9[b-llfm6qu22n] {
        width: 1.875rem;
        height: 5.3125rem;
        top: 5rem;
        left: 5.5rem;
    }

    .integra .vector-10[b-llfm6qu22n] {
        width: 1.125rem;
        height: 1.375rem;
        top: 6.75rem;
        left: 2.6875rem;
    }

    .integra .vector-11[b-llfm6qu22n] {
        width: 0.3125rem;
        height: 0.5rem;
        top: 7.5rem;
        left: 2.6875rem;
    }

    .integra .vector-12[b-llfm6qu22n] {
        width: 0.25rem;
        height: 0.5rem;
        top: 7.5rem;
        left: 3.5rem;
    }

    .integra .group-2[b-llfm6qu22n] {
        width: 0.75rem;
        height: 0.75rem;
        top: 7rem;
        left: 2.9375rem;
    }

    .integra .vector-13[b-llfm6qu22n] {
        width: 0.8125rem;
        height: 0.6875rem;
        top: 7.375rem;
        left: 2.875rem;
    }

    .integra .frame-50[b-llfm6qu22n] {
        padding: 2rem;
    }

    .integra .text-wrapper-29[b-llfm6qu22n] {
        font-size: 0.9375rem;
    }

    .integra .boton-2[b-llfm6qu22n] {
        height: 3.3125rem;
        gap: 0.5rem;
    }

    .integra .label-text-3[b-llfm6qu22n] {
        font-size: 1rem;
    }

    .integra .frame-51[b-llfm6qu22n] {
        margin-top: -0.0625rem;
        margin-bottom: -0.0625rem;
        margin-right: -0.0625rem;
    }

    .integra .frame-52[b-llfm6qu22n] {
        width: 9.375rem;
        padding: 2rem;
    }

    .integra .overlap-group-wrapper[b-llfm6qu22n] {
        width: 7.5rem;
        height: 11.25rem;
    }

    .integra .overlap-group-2[b-llfm6qu22n] {
        width: 6.875rem;
        height: 11.25rem;
        left: 0.5625rem;
    }

    .integra .vector-14[b-llfm6qu22n] {
        width: 6.3125rem;
        height: 6.5rem;
        top: 0;
        left: 0.625rem;
    }

    .integra .b-2[b-llfm6qu22n] {
        width: 1.375rem;
        height: 0.9375rem;
        top: 4.4375rem;
        left: 0.3125rem;
    }

    .integra .vector-15[b-llfm6qu22n] {
        width: 3.125rem;
        height: 2.125rem;
        top: 3.125rem;
        left: 0.625rem;
    }

    .integra .vector-16[b-llfm6qu22n] {
        width: 1.1875rem;
        height: 1.25rem;
        top: 1.3125rem;
        left: 3.3125rem;
    }

    .integra .group-3[b-llfm6qu22n] {
        width: 1.4375rem;
        height: 2.25rem;
        top: 8.625rem;
        left: 3rem;
    }

    .integra .group-4[b-llfm6qu22n] {
        width: 1.4375rem;
        height: 2.125rem;
        top: 9.125rem;
        left: 3.75rem;
    }

    .integra .vector-17[b-llfm6qu22n] {
        width: 2.3125rem;
        height: 3.3125rem;
        top: 4.3125rem;
        left: 2.875rem;
    }

    .integra .vector-18[b-llfm6qu22n] {
        width: 1.8125rem;
        height: 3rem;
        top: 2.25rem;
        left: 2.9375rem;
    }

    .integra .vector-19[b-llfm6qu22n] {
        width: 2.9375rem;
        height: 4.875rem;
        top: 4.8125rem;
        left: 1.8125rem;
    }

    .integra .vector-20[b-llfm6qu22n] {
        width: 3rem;
        height: 5.875rem;
        top: 2.375rem;
        left: 3.75rem;
    }

    .integra .vector-21[b-llfm6qu22n] {
        width: 1rem;
        height: 2.5rem;
        top: 2.5625rem;
        left: 2.875rem;
    }

    .integra .c-2[b-llfm6qu22n] {
        width: 1rem;
        height: 1.375rem;
        top: 4.5625rem;
        left: 5.9375rem;
    }

    .integra .vector-22[b-llfm6qu22n] {
        width: 2.1875rem;
        height: 3.0625rem;
        top: 2.5rem;
        left: 4.5rem;
    }

    .integra .vector-23[b-llfm6qu22n] {
        width: 1.0625rem;
        height: 1.0625rem;
        top: 1.1875rem;
        left: 3.375rem;
    }

    .integra .vector-24[b-llfm6qu22n] {
        width: 1.5rem;
        height: 1.6875rem;
        top: 0.875rem;
        left: 3.375rem;
    }

    .integra .vector-25[b-llfm6qu22n] {
        width: 2.375rem;
        height: 0.0625rem;
        top: 2rem;
        left: 0.25rem;
    }

    .integra .group-5[b-llfm6qu22n] {
        width: 3.0625rem;
        height: 1.0625rem;
        top: 1.25rem;
        left: 0;
    }

    .integra .vector-26[b-llfm6qu22n] {
        width: 2.5625rem;
        height: 0.0625rem;
        top: 4rem;
        left: 0.25rem;
    }

    .integra .group-6[b-llfm6qu22n] {
        width: 2.3125rem;
        height: 1.0625rem;
        top: 3.1875rem;
        left: 0.125rem;
    }

    .integra .boton-3[b-llfm6qu22n] {
        height: 3.375rem;
        gap: 0.5rem;
    }

    .integra .arrow-7[b-llfm6qu22n] {
        width: 2.3125rem;
        height: 2.375rem;
    }

    .integra .arrow-8[b-llfm6qu22n] {
        width: 2.3125rem;
        height: 2.375rem;
    }
}

/* ================================
   Pantallas muy pequeñas (máx-width: 48rem ≈ 768px)
================================ */
@media (max-width: 48rem) {
    .integra[b-llfm6qu22n] {
        padding: 0rem 1.5rem 3.75rem;
        gap: 2rem;
    }

        .integra .div[b-llfm6qu22n] {
            width: 100%;
            left: 0;
            top: 4rem;
        }
        /* Ajustes en elementos posicionados */
        .integra .rectangle[b-llfm6qu22n] {
            width: 100%;
            top: 4rem;
            /* Se puede ajustar la altura si es necesario */
        }
        /* Layouts internos: se fuerza la dirección en columna */
        .integra .frame[b-llfm6qu22n] {
            flex-direction: column;
        }

        .integra .ttulo[b-llfm6qu22n] {
            padding: 0.75rem 0;
        }
        /* Tipografías: reducir tamaño de fuente para que el texto se adapte */
        .integra .CESTA[b-llfm6qu22n],
        .integra .text-wrapper[b-llfm6qu22n],
        .integra .p[b-llfm6qu22n] {
            font-size: 0.75rem;
        }
        /* Iconos e imágenes: se reducen para no saturar el layout */
        .integra .iconos[b-llfm6qu22n] {
            width: 1rem;
            height: 1rem;
            top: 0.75rem;
        }

        .integra .img[b-llfm6qu22n] {
            width: 1rem;
            height: 1rem;
        }
        /* Contenedores secundarios */
        .integra .frame-2[b-llfm6qu22n] {
            gap: 1.5rem;
            padding-bottom: 2rem;
        }

        .integra .frame-3[b-llfm6qu22n],
        .integra .frame-4[b-llfm6qu22n],
        .integra .frame-6[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .frame-5[b-llfm6qu22n] {
            gap: 1rem;
        }

        .integra .frame-7[b-llfm6qu22n],
        .integra .frame-8[b-llfm6qu22n] {
            width: 100%;
        }

        .integra .frame-8[b-llfm6qu22n] {
            padding: 0.75rem;
        }
        /* Ajustes en textos secundarios */
        .integra .text-wrapper-2[b-llfm6qu22n] {
            font-size: 1rem;
        }

        .integra .text-wrapper-3[b-llfm6qu22n] {
            font-size: 0.75rem;
        }
        /* Espaciados internos */
        .integra .frame-10[b-llfm6qu22n] {
            gap: 0.25rem;
        }

        .integra .alternativa-centro[b-llfm6qu22n],
        .integra .text-wrapper-4[b-llfm6qu22n] {
            font-size: 0.625rem;
        }

        .integra .frame-11[b-llfm6qu22n] {
            gap: 0.75rem;
        }

        .integra .line[b-llfm6qu22n] {
            height: 2.5rem;
        }

        .integra .line-2[b-llfm6qu22n] {
            width: 12rem;
            height: 0.15rem;
        }

        .integra .frame-12[b-llfm6qu22n] {
            margin-left: 0.25rem;
            margin-right: 0.25rem;
        }

        .integra .frame-13[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .frame-14[b-llfm6qu22n] {
            gap: 0.5rem;
        }
        /* Iconos con fondo y bordes */
        .integra .iconos-wrapper[b-llfm6qu22n] {
            width: 1.75rem;
            height: 1.75rem;
            border-radius: 0.875rem;
        }

        .integra .iconos-2[b-llfm6qu22n] {
            width: 1rem;
            height: 1rem;
            top: 0.375rem;
            left: 0.375rem;
        }

        .integra .text-wrapper-6[b-llfm6qu22n] {
            font-size: 1rem;
        }

        .integra .img-wrapper[b-llfm6qu22n] {
            width: 1.75rem;
            height: 1.75rem;
            border-radius: 0.875rem;
        }
        /* Contenedores de interacciones */
        .integra .frame-15[b-llfm6qu22n] {
            padding: 0.75rem;
        }

        .integra .div-wrapper[b-llfm6qu22n] {
            gap: 1rem;
            padding: 0.5rem;
        }

        .integra .text-wrapper-7[b-llfm6qu22n] {
            font-size: 1rem;
        }

        .integra .frame-16[b-llfm6qu22n] {
            gap: 1rem;
            padding: 0.5rem;
        }

        .integra .arrow[b-llfm6qu22n] {
            width: 2.5rem;
            height: 1.75rem;
            top: 7rem;
            left: 15rem;
        }

        .integra .frame-wrapper[b-llfm6qu22n] {
            width: 100%;
        }
        /* Secciones internas */
        .integra .frame-17[b-llfm6qu22n] {
            padding: 1.5rem;
            gap: 1.5rem;
        }

        .integra .frame-18[b-llfm6qu22n] {
            padding-bottom: 1.5rem;
            gap: 1rem;
        }

        .integra .el-cumplimiento-de[b-llfm6qu22n] {
            font-size: 0.75rem;
        }

        .integra .text-wrapper-10[b-llfm6qu22n] {
            font-size: 1rem;
        }

        .integra .text-wrapper-11[b-llfm6qu22n] {
            bottom: 1.5rem;
            width: 100%;
        }

        .integra .aasjoh[b-llfm6qu22n] {
            width: 100%;
            height: auto;
            top: 6rem;
            left: 0;
        }

        .integra .frame-19[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .frame-20[b-llfm6qu22n] {
            width: 100%;
        }

        .integra .frame-21[b-llfm6qu22n] {
            gap: 1rem;
        }

        .integra .text-wrapper-12[b-llfm6qu22n] {
            font-size: 0.875rem;
        }

        .integra .si-no-se-puede[b-llfm6qu22n],
        .integra .text-wrapper-13[b-llfm6qu22n] {
            font-size: 0.75rem;
        }

        .integra .frame-22[b-llfm6qu22n] {
            gap: 0.5rem;
        }

        .integra .frame-23[b-llfm6qu22n] {
            gap: 0.75rem;
        }

        .integra .text-wrapper-15[b-llfm6qu22n] {
            font-size: 0.75rem;
        }
        /* Botones y estados */
        .integra .boton[b-llfm6qu22n] {
            height: 2.75rem;
            gap: 0.5rem;
        }

        .integra .state-layer[b-llfm6qu22n] {
            padding: 0.5rem 0.5rem;
        }

        .integra .label-text[b-llfm6qu22n] {
            font-size: 0.875rem;
        }
        /* Más secciones internas */
        .integra .frame-24[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .frame-25[b-llfm6qu22n] {
            padding: 1.5rem;
        }

        .integra .frame-26[b-llfm6qu22n] {
            gap: 0.75rem;
            padding-bottom: 1.5rem;
        }

        .integra .text-wrapper-16[b-llfm6qu22n] {
            font-size: 1rem;
        }

        .integra .frame-27[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .icon-neutro-empresa[b-llfm6qu22n] {
            width: 1.75rem;
            height: 1.75rem;
        }

        .integra .text-wrapper-17[b-llfm6qu22n] {
            font-size: 0.875rem;
        }

        .integra .arrow-2[b-llfm6qu22n] {
            width: 2.5rem;
            height: 0.875rem;
        }

        .integra .frame-28[b-llfm6qu22n] {
            width: 14rem;
            gap: 0.5rem;
            padding: 0.5rem 0;
        }

        .integra .text-wrapper-18[b-llfm6qu22n] {
            font-size: 0.875rem;
        }

        .integra .line-3[b-llfm6qu22n] {
            width: 1.75rem;
        }

        .integra .line-4[b-llfm6qu22n] {
            width: 0.125rem;
            height: 2.5rem;
        }

        .integra .frame-29[b-llfm6qu22n] {
            margin-top: -0.25rem;
            margin-bottom: -0.25rem;
            margin-right: -0.0625rem;
        }

        .integra .frame-30[b-llfm6qu22n] {
            width: 18rem;
            gap: 1.5rem;
        }

        .integra .text-wrapper-19[b-llfm6qu22n] {
            margin-top: 0.0625rem;
            top: 0.75rem;
            font-size: 0.75rem;
        }

        .integra .frame-31[b-llfm6qu22n] {
            gap: 1rem;
            padding: 1.5rem 0;
        }

        .integra .frame-32[b-llfm6qu22n] {
            width: 18rem;
        }

        .integra .frame-33[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .text-wrapper-20[b-llfm6qu22n],
        .integra .text-wrapper-21[b-llfm6qu22n] {
            font-size: 0.75rem;
        }

        .integra .frame-34[b-llfm6qu22n] {
            gap: 2.25rem;
        }

        .integra .line-5[b-llfm6qu22n],
        .integra .line-6[b-llfm6qu22n] {
            width: 0.5rem;
            height: 0.125rem;
        }

        .integra .line-7[b-llfm6qu22n] {
            width: 0.125rem;
        }

        .integra .arrow-3[b-llfm6qu22n] {
            width: 2.25rem;
            height: 0.875rem;
            margin-right: -0.0625rem;
        }

        .integra .frame-35[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .arrow-4[b-llfm6qu22n] {
            width: 3.5rem;
            height: 0.875rem;
        }

        .integra .frame-36[b-llfm6qu22n] {
            width: 14rem;
        }

        .integra .arrow-5[b-llfm6qu22n] {
            width: 6rem;
            height: 0.875rem;
            margin-right: -0.0625rem;
        }

        .integra .frame-37[b-llfm6qu22n] {
            width: 20rem;
            gap: 0.5rem;
            padding: 0.5rem;
        }

        .integra .text-wrapper-22[b-llfm6qu22n] {
            font-size: 0.875rem;
        }

        .integra .logo-integra-wrapper[b-llfm6qu22n] {
            padding: 0rem 1.5rem 0rem 0.5rem;
            gap: 0.5rem;
        }

        .integra .logo-integra[b-llfm6qu22n] {
            width: 3.5rem;
            height: 2.5rem;
        }

        .integra .frame-38[b-llfm6qu22n] {
            gap: 1.5rem;
            padding: 1.5rem 0;
        }

        .integra .arrow-6[b-llfm6qu22n] {
            width: 7.5rem;
            height: 0.875rem;
        }

        .integra .frame-39[b-llfm6qu22n] {
            gap: 0.75rem;
            padding: 1.5rem;
        }

        .integra .frame-40[b-llfm6qu22n] {
            width: 0.75rem;
        }

        .integra .component[b-llfm6qu22n] {
            width: 100%;
            gap: 2.25rem;
            padding: 1.5rem;
        }

        .integra .frame-41[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .columna[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .input-wrapper[b-llfm6qu22n] {
            gap: 1rem;
        }

        .integra .input[b-llfm6qu22n] {
            padding: 0.75rem;
            gap: 0.5rem;
        }

        .integra .poblaci-n[b-llfm6qu22n] {
            font-size: 0.75rem;
            margin-top: -0.0625rem;
        }

        .integra .columna-2[b-llfm6qu22n] {
            gap: 1.5rem;
        }

        .integra .emial_medidas_alternativas[b-llfm6qu22n],
        .integra .input-trabajadores[b-llfm6qu22n] {
            padding: 0.75rem;
        }

    .checkbox-terminos[b-llfm6qu22n] {
        width: 0.75rem;
        height: 0.75rem;
        border-width: 0.0625rem;
    }

    .integra .frame-42[b-llfm6qu22n] {
        width: 35rem;
        height: 1rem;
        gap: 0.75rem;
    }

    .integra .component-2[b-llfm6qu22n] {
        width: 0.75rem;
        height: 0.75rem;
    }

    .integra .text-wrapper-23[b-llfm6qu22n] {
        font-size: 0.75rem;
    }

    .integra .state-layer-wrapper[b-llfm6qu22n] {
        width: 25rem;
        height: 2.5rem;
    }

    .integra .label-text-2[b-llfm6qu22n] {
        font-size: 0.875rem;
    }

    .integra .frame-43[b-llfm6qu22n] {
        gap: 1.5rem;
    }

    .integra .frame-44[b-llfm6qu22n] {
        gap: 2.25rem;
    }

    .integra .line-8[b-llfm6qu22n] {
        height: 0.125rem;
    }

    .integra .n-MERO-DE-EMPLEADOS[b-llfm6qu22n] {
        font-size: 0.875rem;
    }

    .integra .text-wrapper-24[b-llfm6qu22n] {
        font-size: 0.875rem;
    }

    .integra .text-wrapper-25[b-llfm6qu22n] {
        font-size: 0.75rem;
    }

    .integra .frame-45[b-llfm6qu22n] {
        gap: 2.5rem;
        padding-top: 2.5rem;
    }

    .integra .frame-46[b-llfm6qu22n] {
        padding: 2.5rem;
        gap: 0.5rem;
    }

    .integra .text-wrapper-26[b-llfm6qu22n] {
        width: 11.5rem;
        font-size: 0.875rem;
    }

    .integra .frame-47[b-llfm6qu22n] {
        padding: 2.5rem;
        gap: 0.5rem;
    }

    .integra .text-wrapper-27[b-llfm6qu22n] {
        width: 11.5rem;
        font-size: 0.875rem;
    }

    .integra .text-wrapper-28[b-llfm6qu22n] {
        font-size: 0.75rem;
    }

    .integra .frame-48[b-llfm6qu22n] {
        width: 100%;
        gap: 2.5rem;
    }

    .integra .frame-49[b-llfm6qu22n] {
        margin-top: -0.0625rem;
        margin-bottom: -0.0625rem;
        margin-left: -0.0625rem;
    }

    .integra .capa-wrapper[b-llfm6qu22n] {
        width: 7.5rem;
        padding: 2.5rem 0;
    }

    .integra .capa[b-llfm6qu22n] {
        width: 6rem;
        height: 17.5rem;
    }

    .integra .overlap-group[b-llfm6qu22n] {
        height: 17.5rem;
    }

    .integra .group[b-llfm6qu22n] {
        width: 5.5rem;
        height: 5.5rem;
    }

    .integra .vector[b-llfm6qu22n] {
        width: 6.25rem;
        height: 7.4375rem;
        top: 10rem;
        left: 0.5rem;
    }

    .integra .vector-2[b-llfm6qu22n] {
        width: 5rem;
        height: 6.75rem;
        top: 4rem;
        left: 1.5rem;
    }

    .integra .vector-3[b-llfm6qu22n] {
        width: 3rem;
        height: 5rem;
        top: 6rem;
        left: 2.5rem;
    }

    .integra .vector-4[b-llfm6qu22n] {
        width: 1rem;
        height: 0.0625rem;
        top: 7rem;
        left: 4rem;
    }

    .integra .vector-5[b-llfm6qu22n] {
        width: 1rem;
        height: 0.0625rem;
        top: 7.25rem;
        left: 4rem;
    }

    .integra .vector-6[b-llfm6qu22n] {
        width: 1rem;
        height: 0.0625rem;
        top: 7.5rem;
        left: 4rem;
    }

    .integra .vector-7[b-llfm6qu22n] {
        width: 2.375rem;
        height: 0.1875rem;
        top: 8.75rem;
        left: 2.75rem;
    }

    .integra .b[b-llfm6qu22n] {
        width: 4rem;
        height: 1.625rem;
        top: 9rem;
        left: 0.625rem;
    }

    .integra .vector-8[b-llfm6qu22n] {
        width: 2.25rem;
        height: 5rem;
        top: 5rem;
        left: 0;
    }

    .integra .c[b-llfm6qu22n] {
        width: 4rem;
        height: 1.1875rem;
        top: 9rem;
        left: 2.5rem;
    }

    .integra .vector-9[b-llfm6qu22n] {
        width: 1.875rem;
        height: 5.3125rem;
        top: 5rem;
        left: 5.5rem;
    }

    .integra .vector-10[b-llfm6qu22n] {
        width: 1.125rem;
        height: 1.375rem;
        top: 6.75rem;
        left: 2.6875rem;
    }

    .integra .vector-11[b-llfm6qu22n] {
        width: 0.3125rem;
        height: 0.5rem;
        top: 7.5rem;
        left: 2.6875rem;
    }

    .integra .vector-12[b-llfm6qu22n] {
        width: 0.25rem;
        height: 0.5rem;
        top: 7.5rem;
        left: 3.5rem;
    }

    .integra .group-2[b-llfm6qu22n] {
        width: 0.75rem;
        height: 0.75rem;
        top: 7rem;
        left: 2.9375rem;
    }

    .integra .vector-13[b-llfm6qu22n] {
        width: 0.8125rem;
        height: 0.6875rem;
        top: 7.375rem;
        left: 2.875rem;
    }

    .integra .frame-50[b-llfm6qu22n] {
        padding: 1.5rem;
    }

    .integra .text-wrapper-29[b-llfm6qu22n] {
        font-size: 0.75rem;
    }

    .integra .boton-2[b-llfm6qu22n] {
        height: 2.75rem;
        gap: 0.5rem;
    }

    .integra .label-text-3[b-llfm6qu22n] {
        font-size: 0.875rem;
    }

    .integra .frame-51[b-llfm6qu22n] {
        margin-top: -0.0625rem;
        margin-bottom: -0.0625rem;
        margin-right: -0.0625rem;
    }

    .integra .frame-52[b-llfm6qu22n] {
        width: 7.5rem;
        padding: 1.5rem;
    }

    .integra .overlap-group-wrapper[b-llfm6qu22n] {
        width: 7.5rem;
        height: 11.25rem;
    }

    .integra .overlap-group-2[b-llfm6qu22n] {
        width: 6.875rem;
        height: 11.25rem;
        left: 0.5625rem;
    }

    .integra .vector-14[b-llfm6qu22n] {
        width: 6.3125rem;
        height: 6.5rem;
        top: 0;
        left: 0.625rem;
    }

    .integra .b-2[b-llfm6qu22n] {
        width: 1.375rem;
        height: 0.9375rem;
        top: 4.4375rem;
        left: 0.3125rem;
    }

    .integra .vector-15[b-llfm6qu22n] {
        width: 3.125rem;
        height: 2.125rem;
        top: 3.125rem;
        left: 0.625rem;
    }

    .integra .vector-16[b-llfm6qu22n] {
        width: 1.1875rem;
        height: 1.25rem;
        top: 1.3125rem;
        left: 3.3125rem;
    }

    .integra .group-3[b-llfm6qu22n] {
        width: 1.4375rem;
        height: 2.25rem;
        top: 8.625rem;
        left: 3rem;
    }

    .integra .group-4[b-llfm6qu22n] {
        width: 1.4375rem;
        height: 2.125rem;
        top: 9.125rem;
        left: 3.75rem;
    }

    .integra .vector-17[b-llfm6qu22n] {
        width: 2.3125rem;
        height: 3.3125rem;
        top: 4.3125rem;
        left: 2.875rem;
    }

    .integra .vector-18[b-llfm6qu22n] {
        width: 1.8125rem;
        height: 3rem;
        top: 2.25rem;
        left: 2.9375rem;
    }

    .integra .vector-19[b-llfm6qu22n] {
        width: 2.9375rem;
        height: 4.875rem;
        top: 4.8125rem;
        left: 1.8125rem;
    }

    .integra .vector-20[b-llfm6qu22n] {
        width: 3rem;
        height: 5.875rem;
        top: 2.375rem;
        left: 3.75rem;
    }

    .integra .vector-21[b-llfm6qu22n] {
        width: 1rem;
        height: 2.5rem;
        top: 2.5625rem;
        left: 2.875rem;
    }

    .integra .c-2[b-llfm6qu22n] {
        width: 1rem;
        height: 1.375rem;
        top: 4.5625rem;
        left: 5.9375rem;
    }

    .integra .vector-22[b-llfm6qu22n] {
        width: 2.1875rem;
        height: 3.0625rem;
        top: 2.5rem;
        left: 4.5rem;
    }

    .integra .vector-23[b-llfm6qu22n] {
        width: 1.0625rem;
        height: 1.0625rem;
        top: 1.1875rem;
        left: 3.375rem;
    }

    .integra .vector-24[b-llfm6qu22n] {
        width: 1.5rem;
        height: 1.6875rem;
        top: 0.875rem;
        left: 3.375rem;
    }

    .integra .vector-25[b-llfm6qu22n] {
        width: 2.375rem;
        height: 0.0625rem;
        top: 2rem;
        left: 0.25rem;
    }

    .integra .group-5[b-llfm6qu22n] {
        width: 3.0625rem;
        height: 1.0625rem;
        top: 1.25rem;
        left: 0;
    }

    .integra .vector-26[b-llfm6qu22n] {
        width: 2.5625rem;
        height: 0.0625rem;
        top: 4rem;
        left: 0.25rem;
    }

    .integra .group-6[b-llfm6qu22n] {
        width: 2.3125rem;
        height: 1.0625rem;
        top: 3.1875rem;
        left: 0.125rem;
    }

    .integra .boton-3[b-llfm6qu22n] {
        height: 3.375rem;
        gap: 0.5rem;
    }

    .integra .arrow-7[b-llfm6qu22n],
    .integra .arrow-8[b-llfm6qu22n] {
        width: 2.3125rem;
        height: 2.375rem;
    }
}
/* _content/PMCWEB/Components/Pages/Login.razor.rz.scp.css */
*[b-0meb52hool] {
    box-sizing: border-box;
}

body[b-0meb52hool] {
    font-family: Arial, sans-serif;
    background: #fff;
    color: #333;
    margin: 0;
    padding: 0;
}

.container[b-0meb52hool] {
    max-width: 900px;
    margin: 0 auto;
    padding: 40px 20px;
    text-align: center;
}

/* Encabezado con título y logo */
.form-header[b-0meb52hool] {
    display: flex;
    align-items: center;
    justify-content: center; /* Centra horizontalmente */
    gap: 20px;
    margin-bottom: 40px;
}

    .form-header h1[b-0meb52hool] {
        font-size: 2em;
        margin: 0;
    }

/* Logo como texto (puedes cambiarlo por <img> si lo prefieres) */
.logo[b-0meb52hool] {
    font-size: 2em;
    font-weight: bold;
}

.accent[b-0meb52hool] {
    color: #28a745; /* Letra en verde */
}

/* Formulario */
.login-form[b-0meb52hool] {
    max-width: 400px;
    margin: 0 auto;
}

    /* Inputs */
    .login-form input[b-0meb52hool] {
        width: 100%;
        padding: 12px;
        margin-bottom: 15px;
        border: 1px solid #f5f5f5;
        border-radius: 8px;
        background: #f5f5f5;
        font-size: 1em;
        font-family: inherit;
    }

        .login-form input[b-0meb52hool]::placeholder {
            color: #888;
        }

        .login-form input:focus[b-0meb52hool] {
            border: 2px solid #28a745;
            outline: none;
        }

/* Checkbox Recuérdame */
.checkbox-option[b-0meb52hool] {
    display: inline-flex;
    align-items: center;
    margin-bottom: 20px;
    cursor: pointer;
}

    .checkbox-option input[b-0meb52hool] {
        display: none;
    }

.custom-check[b-0meb52hool] {
    width: 16px;
    height: 16px;
    border: 2px solid #ccc;
    border-radius: 3px;
    display: inline-block;
    margin-right: 8px;
    position: relative;
}

.checkbox-option input:checked + .custom-check[b-0meb52hool] {
    background: #28a745;
    border-color: #28a745;
}

    .checkbox-option input:checked + .custom-check[b-0meb52hool]::after {
        content: '✔';
        color: #fff;
        font-size: 12px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

/* Botones */
.btn-group[b-0meb52hool] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin: 20px 0;
}

.submit-btn[b-0meb52hool],
.outline-btn[b-0meb52hool] {
    font-size: 1em;
    text-decoration: none;
    padding: 12px 24px;
    border-radius: 6px;
    cursor: pointer;
}

.submit-btn[b-0meb52hool] {
    background: #28a745;
    color: #fff;
    border: none;
}

    .submit-btn:hover[b-0meb52hool] {
        background: #25963a;
    }

.outline-btn[b-0meb52hool] {
    background: #fff;
    color: #28a745;
    border: 1px solid #28a745;
}

    .outline-btn:hover[b-0meb52hool] {
        background: #f5f5f5;
    }

/* Enlace de contraseña olvidada */
.forgot[b-0meb52hool] {
    margin-top: 10px;
}

    .forgot a[b-0meb52hool] {
        color: #555;
        text-decoration: none;
    }

        .forgot a:hover[b-0meb52hool] {
            text-decoration: underline;
        }
/* _content/PMCWEB/Components/Pages/MedioAmbiente.razor.rz.scp.css */
.medio-ambiente[b-r4g7klw1na] {
    display: flex;
    flex-direction: column;
    max-width: 100%;
    width: 100%;
    align-items: center;
    gap: 75px;
    padding: 0px 5vw 100px;
    position: relative;
    background-color: #ffffff;
}

    .medio-ambiente .rectangle[b-r4g7klw1na] {
        position: absolute;
        width: 1920px;
        height: 606px;
        top: 0;
        left: 0;
        background-color: var(--primaryprimary-10);
    }

    .medio-ambiente .frame[b-r4g7klw1na] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .medio-ambiente .ttulo-wrapper[b-r4g7klw1na] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        padding: 20px 0px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .medio-ambiente .ttulo[b-r4g7klw1na] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .medio-ambiente .CESTA[b-r4g7klw1na] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .medio-ambiente .iconos[b-r4g7klw1na] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 19px;
        left: 0;
    }

    .medio-ambiente .div[b-r4g7klw1na] {
        gap: 50px;
        padding: 50px 0px;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
    }

    .medio-ambiente .frame-2[b-r4g7klw1na] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 0px 0px 20px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-color: var(--grisgris-40);
    }

    .medio-ambiente .text-wrapper[b-r4g7klw1na] {
        position: relative;
        align-self: stretch;
        margin-top: -1.00px;
        font-family: var(--headline-small-font-family);
        font-weight: var(--headline-small-font-weight);
        color: #000000;
        font-size: var(--headline-small-font-size);
        letter-spacing: var(--headline-small-letter-spacing);
        line-height: var(--headline-small-line-height);
        font-style: var(--headline-small-font-style);
    }

    .medio-ambiente .text-wrapper-2[b-r4g7klw1na] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .medio-ambiente .frame-3[b-r4g7klw1na] {
        display: flex;
        align-items: flex-start;
        gap: 100px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .medio-ambiente .frame-4[b-r4g7klw1na] {
        display: flex;
        align-items: flex-start;
        position: relative;
        flex: 1;
        align-self: stretch;
        flex-grow: 1;
        background-color: var(--blanco);
        border-radius: 15px;
        border: 1px solid;
        border-color: var(--terciario);
    }

    .medio-ambiente .frame-5[b-r4g7klw1na] {
        display: flex;
        flex-direction: column;
        width: 150px;
        align-items: center;
        gap: 10px;
        padding: 50px 0px 0px;
        position: relative;
        align-self: stretch;
        background-color: var(--primario);
        border-radius: 15px;
    }

    .medio-ambiente .frame-6[b-r4g7klw1na] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 50px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .medio-ambiente .frame-7[b-r4g7klw1na] {
        gap: 10px;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
    }

    .medio-ambiente .frame-8[b-r4g7klw1na] {
        display: flex;
        align-items: flex-start;
        gap: 20px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .medio-ambiente .iconos-wrapper[b-r4g7klw1na] {
        display: inline-flex;
        height: 20px;
        align-items: center;
        gap: 10px;
        position: relative;
        flex: 0 0 auto;
    }

    .medio-ambiente .img[b-r4g7klw1na] {
        position: relative;
        width: 15px;
        height: 15px;
    }

    .medio-ambiente .p[b-r4g7klw1na] {
        position: relative;
        flex: 1;
        margin-top: -1.00px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .medio-ambiente .span[b-r4g7klw1na] {
        letter-spacing: var(--body-large-letter-spacing);
        font-family: var(--body-large-font-family);
        font-style: var(--body-large-font-style);
        font-weight: var(--body-large-font-weight);
        line-height: var(--body-large-line-height);
        font-size: var(--body-large-font-size);
    }

    .medio-ambiente .text-wrapper-3[b-r4g7klw1na] {
        letter-spacing: var(--body-large-letter-spacing);
        text-decoration: underline;
        font-family: var(--body-large-font-family);
        font-style: var(--body-large-font-style);
        font-weight: var(--body-large-font-weight);
        line-height: var(--body-large-line-height);
        font-size: var(--body-large-font-size);
    }

    .medio-ambiente .home-page-FSC-italia[b-r4g7klw1na] {
        position: relative;
        width: 150px;
        height: 438px;
    }

    .medio-ambiente .frame-9[b-r4g7klw1na] {
        display: flex;
        align-items: flex-start;
        gap: 20px;
        padding: 0px 0px 0px 80px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .medio-ambiente .grupo[b-r4g7klw1na] {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 2px 7px;
        position: relative;
        flex: 0 0 auto;
        background-color: var(--primario);
        border-radius: 2px;
        box-shadow: var(--1);
    }

    .medio-ambiente .new[b-r4g7klw1na] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 700;
        color: var(--blanco);
        font-size: 10px;
        text-align: center;
        letter-spacing: 0;
        line-height: normal;
    }

    .medio-ambiente .frame-10[b-r4g7klw1na] {
        display: flex;
        align-items: flex-start;
        position: relative;
        flex: 1;
        align-self: stretch;
        flex-grow: 1;
        border-radius: 15px;
        border: 1px solid;
        border-color: var(--terciario);
    }

    .medio-ambiente .certificado-huella-wrapper[b-r4g7klw1na] {
        display: flex;
        width: 150px;
        height: 510px;
        align-items: flex-start;
        justify-content: center;
        gap: 10px;
        padding: 50px 0px 0px;
        position: relative;
        border-radius: 15px;
        background-image: url(https://c.animaapp.com/3VIhr1xE/img/frame-1000002604@2x.png);
        background-size: cover;
        background-position: 50% 50%;
    }

    .medio-ambiente .certificado-huella[b-r4g7klw1na] {
        position: relative;
        width: 94px;
        height: 134px;
        object-fit: cover;
    }

    .medio-ambiente .boton[b-r4g7klw1na] {
        display: inline-flex;
        flex-direction: column;
        height: 53px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        background-color: var(--blanco);
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--primario);
    }

    .medio-ambiente .state-layer[b-r4g7klw1na] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .medio-ambiente .label-text[b-r4g7klw1na] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--primario);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .medio-ambiente .frame-wrapper[b-r4g7klw1na] {
        display: flex;
        align-items: flex-start;
        position: relative;
        flex: 1;
        align-self: stretch;
        flex-grow: 1;
        border-radius: 15px;
        box-shadow: var(--2);
    }

    .medio-ambiente .medioambiente-wrapper[b-r4g7klw1na] {
        flex: 1;
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        align-self: stretch;
    }

    .medio-ambiente .medioambiente[b-r4g7klw1na] {
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
        object-fit: cover;
    }

    .medio-ambiente .frame-11[b-r4g7klw1na] {
        display: flex;
        align-items: flex-start;
        position: relative;
        flex: 1;
        flex-grow: 1;
        border-radius: 15px;
        border: 1px solid;
        border-color: var(--grisgris-60);
    }

    .medio-ambiente .capa-wrapper[b-r4g7klw1na] {
        display: flex;
        width: 150px;
        height: 384px;
        align-items: flex-start;
        justify-content: center;
        padding: 50px 0px 0px;
        position: relative;
        border-radius: 15px;
        background-image: url(https://c.animaapp.com/3VIhr1xE/img/frame-1000002603@2x.png);
        background-size: cover;
        background-position: 50% 50%;
    }

    .medio-ambiente .capa[b-r4g7klw1na] {
        position: relative;
        width: 66.33px;
        height: 100px;
    }

    .medio-ambiente .frame-12[b-r4g7klw1na] {
        display: flex;
        flex-direction: column;
        width: 150px;
        height: 384px;
        align-items: center;
        gap: 10px;
        padding: 50px 0px 0px;
        position: relative;
        border-radius: 15px;
        background-image: url(https://c.animaapp.com/3VIhr1xE/img/frame-1000002602@2x.png);
        background-size: cover;
        background-position: 50% 50%;
    }

    .medio-ambiente .overlap-wrapper[b-r4g7klw1na] {
        position: relative;
        width: 66px;
        height: 63px;
        overflow: hidden;
    }

    .medio-ambiente .overlap[b-r4g7klw1na] {
        position: relative;
        height: 63px;
    }

    .medio-ambiente .vector[b-r4g7klw1na] {
        position: absolute;
        width: 23px;
        height: 58px;
        top: 2px;
        left: 9px;
    }

    .medio-ambiente .group[b-r4g7klw1na] {
        position: absolute;
        width: 38px;
        height: 49px;
        top: 0;
        left: 15px;
    }

    .medio-ambiente .overlap-group[b-r4g7klw1na] {
        position: relative;
        height: 49px;
    }

    .medio-ambiente .group-2[b-r4g7klw1na] {
        position: absolute;
        width: 38px;
        height: 21px;
        top: 0;
        left: 0;
    }

    .medio-ambiente .vector-2[b-r4g7klw1na] {
        position: absolute;
        width: 30px;
        height: 30px;
        top: 19px;
        left: 4px;
    }

    .medio-ambiente .group-3[b-r4g7klw1na] {
        position: absolute;
        width: 66px;
        height: 35px;
        top: 28px;
        left: 0;
    }

    .medio-ambiente .group-4[b-r4g7klw1na] {
        position: absolute;
        width: 28px;
        height: 32px;
        top: 0;
        left: 0;
    }

    .medio-ambiente .group-5[b-r4g7klw1na] {
        position: absolute;
        width: 29px;
        height: 35px;
        top: 0;
        left: 37px;
    }

    .medio-ambiente .text-wrapper-4[b-r4g7klw1na] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        text-decoration: underline;
        font-style: var(--body-large-font-style);
    }

@media (min-width: 800px) and (max-width: 1280px) {

    .medio-ambiente .frame-5[b-r4g7klw1na] {
        display: flex;
        flex-direction: column;
        width: 120px;
        align-items: center;
        gap: 10px;
        padding: 50px 0px 0px;
        position: relative;
        align-self: stretch;
        background-color: var(--primario);
        border-radius: 15px;
    }

}
/* _content/PMCWEB/Components/Pages/MiCuenta.razor.rz.scp.css */
body[b-qybgc0bi7v] {
    margin: 0;
    font-family: 'Nunito Sans', sans-serif;
    background: #ffffff;
    font-weight: 400;
    color: #000000;
}

.mi-cuenta[b-qybgc0bi7v] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.mi-cuenta .frame[b-qybgc0bi7v] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-cuenta .titulo[b-qybgc0bi7v] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-cuenta h2[b-qybgc0bi7v] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.mi-cuenta .iconos[b-qybgc0bi7v] {
    position: absolute;
    top: 19px;
    left: 0;
    width: 24px;
    height: 24px;
}

.mi-cuenta .div-wrapper[b-qybgc0bi7v] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.mi-cuenta .label-text-3[b-qybgc0bi7v] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.mi-cuenta .div-wrapper:hover[b-qybgc0bi7v] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.mi-cuenta .div-wrapper:hover .label-text-3[b-qybgc0bi7v] {
    color: var(--blanco);
}

.acount-item[b-qybgc0bi7v] {
    display: block;
    text-decoration: none;
    color: inherit;
    padding: 20px 0;
    padding-bottom: 5px;
    width: 100%;
}

.acount-item .arrow_image[b-qybgc0bi7v] {
    transition: transform 0.3s ease;
    cursor: pointer;
}

.acount-item .divider[b-qybgc0bi7v] {
    border: none;
    border-top: 1px solid #ccc;
    margin: 10px 0;
    transition: border-top 0.3s ease;
}

.acount-item.open .submenu[b-qybgc0bi7v] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: auto;
    gap: 10px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.acount-item.open .arrow-icon[b-qybgc0bi7v] {
    transform: rotate(180deg);
}

.acount-item.open .arrow_image[b-qybgc0bi7v] {
    transform: rotate(90deg);
}

/* Cuando el bloque está abierto, la línea se vuelve verde y más gruesa */
.acount-item.open .divider[b-qybgc0bi7v] {
    border-top: 3px solid green;
}

.title-section[b-qybgc0bi7v] {
    font-size: 22px;
    padding-top: 45px;
    padding-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.content-section[b-qybgc0bi7v] {
    font-size: 16px;
    cursor: pointer;
}

.submenu[b-qybgc0bi7v] {
    display: none;
    list-style: none;
    font-size: 16px;
    margin: 0;
    padding: 10px;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: auto;
    gap: 10px;
}

.submenu a[b-qybgc0bi7v] {
    list-style: none;
    font-size: 16px;
    padding: 5px 0;
    position: relative;
    padding-left: 15px;
    text-decoration: none;
    color: black;
    cursor: pointer;
}

.submenu a[b-qybgc0bi7v]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 35%;
    color: #999;
    width: 10px;
    height: 10px;
    background-image: url("/images/images/integra/arrow_skinny_black.svg");
    background-size: contain;
    background-repeat: no-repeat;
}
/* _content/PMCWEB/Components/Pages/MiEquipo.razor.rz.scp.css */
.mi-equipo-PMC[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.mi-equipo-PMC .frame[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-equipo-PMC .titulo[b-82s18gf2sg] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-equipo-PMC h2[b-82s18gf2sg] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.mi-equipo-PMC .iconos[b-82s18gf2sg] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.mi-equipo-PMC .frame-wrapper[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-equipo-PMC .div[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 50px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-equipo-PMC .frame-2[b-82s18gf2sg] {
    display: flex;
    align-items: flex-start;
    gap: 100px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-equipo-PMC .frame-3[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    width: 515.01px;
    align-items: flex-start;
    gap: 50px;
    position: relative;
}

.mi-equipo-PMC .frame-4[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-equipo-PMC .frame-4.border-bottom[b-82s18gf2sg] {
    border-bottom: 1px solid;
    border-bottom-color: var(--Grey-input-text, #ABABAB);
}

.mi-equipo-PMC .text-wrapper[b-82s18gf2sg] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: var(--title-large-font-family);
    font-weight: var(--title-large-font-weight);
    color: var(--black-fonts-headings);
    font-size: var(--title-large-font-size);
    letter-spacing: var(--title-large-letter-spacing);
    line-height: var(--title-large-line-height);
    white-space: nowrap;
    font-style: var(--title-large-font-style);
}

.mi-equipo-PMC .vector[b-82s18gf2sg] {
    position: relative;
    align-self: stretch;
    width: 100%;
    height: 1px;
    margin-bottom: -0.50px;
    margin-left: -0.50px;
    margin-right: -0.50px;
    object-fit: cover;
}

.mi-equipo-PMC .frame-5[b-82s18gf2sg] {
    display: flex;
    align-items: flex-start;
    gap: 50px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-equipo-PMC .img-1[b-82s18gf2sg] {
    position: relative;
    width: 233.01px;
    height: 350px;
    object-fit: cover;
}

.mi-equipo-PMC .frame-6[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    width: 232px;
    align-items: flex-start;
    gap: 40px;
    position: relative;
}

.mi-equipo-PMC .text-wrapper-2[b-82s18gf2sg] {
    position: relative;
    align-self: stretch;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0.50px;
    line-height: 24px;
}

.mi-equipo-PMC .p[b-82s18gf2sg] {
    position: relative;
    align-self: stretch;
    font-family: var(--body-medium-font-family);
    font-weight: var(--body-medium-font-weight);
    color: var(--grisgris-60);
    font-size: var(--body-medium-font-size);
    letter-spacing: var(--body-medium-letter-spacing);
    line-height: var(--body-medium-line-height);
    font-style: var(--body-medium-font-style);
}

.mi-equipo-PMC .frame-7[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    width: 144px;
    align-items: flex-start;
    gap: 20px;
    position: relative;
    flex: 0 0 auto;
}

.mi-equipo-PMC .frame-8[b-82s18gf2sg] {
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-equipo-PMC .img[b-82s18gf2sg] {
    position: relative;
    width: 24px;
    height: 24px;
}

.mi-equipo-PMC .text-wrapper-3[b-82s18gf2sg] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0.15px;
    line-height: 24px;
    white-space: nowrap;
}

.mi-equipo-PMC .frame-10[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 50px;
    position: relative;
    flex: 1;
    align-self: stretch;
    flex-grow: 1;
    overflow: auto;
    width: 100%;
    max-width: 100%;
}

.mi-equipo-PMC .frame-11[b-82s18gf2sg] {
    display: flex;
    align-items: center;
    gap: 50px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    padding-bottom: 5px;
}

.mi-equipo-PMC .frame-12[b-82s18gf2sg] {
    display: inline-flex;
    align-items: flex-start;
    gap: 50px;
    position: relative;
    flex: 0 0 auto;
}

.mi-equipo-PMC .img-2[b-82s18gf2sg] {
    position: relative;
    width: 233.28px;
    height: 350px;
    object-fit: cover;
}

.mi-equipo-PMC .frame-13[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mi-equipo-PMC .frame-3 img[b-82s18gf2sg], .mi-equipo-PMC .frame-10 img[b-82s18gf2sg] {
    border-radius: 15px;
}

.mi-equipo-PMC .frame-15 img[b-82s18gf2sg] {
    border-radius: 10px;
}

.mi-equipo-PMC .text-wrapper-4[b-82s18gf2sg] {
    position: relative;
    align-self: stretch;
    margin-top: -1.00px;
    font-family: var(--body-medium-font-family);
    font-weight: var(--body-medium-font-weight);
    color: var(--negro);
    font-size: var(--body-medium-font-size);
    letter-spacing: var(--body-medium-letter-spacing);
    line-height: var(--body-medium-line-height);
    font-style: var(--body-medium-font-style);
}

.mi-equipo-PMC .text-wrapper-5[b-82s18gf2sg] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0.50px;
    line-height: 24px;
}

.mi-equipo-PMC .text-wrapper-6[b-82s18gf2sg] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    margin-right: -31.00px;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0.15px;
    line-height: 24px;
    white-space: nowrap;
}

.mi-equipo-PMC .frame-14[b-82s18gf2sg] {
    display: inline-flex;
    align-items: flex-start;
    gap: 50px;
    position: relative;
    flex: 0 0 auto;
    margin-right: -5.56px;
}

.mi-equipo-PMC .text-wrapper-7[b-82s18gf2sg] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    margin-right: -29.00px;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0.15px;
    line-height: 24px;
    white-space: nowrap;
}

.mi-equipo-PMC .frame-15[b-82s18gf2sg] {
    display: flex;
    align-items: flex-start;
    gap: 50px;
    padding: 50px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    background-color: var(--grisgris-10);
    border-radius: 15px;
}

.mi-equipo-PMC .image[b-82s18gf2sg] {
    position: relative;
    width: 503px;
    height: 353px;
    object-fit: cover;
}

.mi-equipo-PMC .state-layer[b-82s18gf2sg] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.mi-equipo-PMC .label-text[b-82s18gf2sg] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.mi-equipo-PMC .state-layer-wrapper[b-82s18gf2sg] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.mi-equipo-PMC .label-text-2[b-82s18gf2sg] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}


.mi-equipo-PMC .state-layer-wrapper:hover[b-82s18gf2sg] {
    background-color: var(--alternativo-oscuro);
}

.mi-equipo-PMC .state-layer-wrapper:hover .label-text-2[b-82s18gf2sg] {
    color: var(--blanco);
}
/* _content/PMCWEB/Components/Pages/MisAlbaranes.razor.rz.scp.css */
.mis-albaranes[b-ibjglu4rhw] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.mis-albaranes .frame[b-ibjglu4rhw] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mis-albaranes .titulo[b-ibjglu4rhw] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mis-albaranes h2[b-ibjglu4rhw] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.mis-albaranes .iconos[b-ibjglu4rhw] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.mis-albaranes .div[b-ibjglu4rhw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mis-albaranes .text-wrapper[b-ibjglu4rhw] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.mis-albaranes .boton[b-ibjglu4rhw] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.mis-albaranes .boton:hover[b-ibjglu4rhw] {
    background-color: #80C87C;
}

.mis-albaranes .state-layer[b-ibjglu4rhw] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.mis-albaranes .label-text[b-ibjglu4rhw] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.mis-albaranes .frame-2[b-ibjglu4rhw] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 75px;
    align-self: stretch;
    width: 100%;
    background-color: var(--grisgris-10);
    border-radius: 15px;
}

.mis-albaranes .frame-3[b-ibjglu4rhw] {
    display: flex;
    padding-bottom: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.mis-albaranes .text-wrapper-2[b-ibjglu4rhw] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
}

.mis-albaranes .frame-4[b-ibjglu4rhw] {
    display: flex;
    align-items: center;
    gap: 100px;
    align-self: stretch;
}

.mis-albaranes .frame-5[b-ibjglu4rhw] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    flex: 1 0 0;
}

.mis-albaranes .frame-6[b-ibjglu4rhw] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
    border-bottom: 1px solid #d3d3d3;
}

.mis-albaranes .text-wrapper-3[b-ibjglu4rhw] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

.mis-albaranes .frame-7[b-ibjglu4rhw] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

[b-ibjglu4rhw] .mis-albaranes .input {
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    display: -webkit-box;
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    overflow: hidden;
    padding: 17px 16px;
    position: relative;
    text-overflow: ellipsis;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

[b-ibjglu4rhw] .mis-albaranes input::placeholder {
    color: #888;
}

[b-ibjglu4rhw] .mis-albaranes input:focus {
    border: 2px solid #28a745;
    outline: none;
}

.mis-albaranes .frame-8[b-ibjglu4rhw] {
    display: flex;
    padding: 20px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.mis-albaranes .input-2[b-ibjglu4rhw] {
    appearance: none;
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    padding: 17px 16px;
    padding-right: 50px;
    position: relative;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.mis-albaranes .input-2:focus[b-ibjglu4rhw] {
    border: 2px solid #3CAA36 !important;
    outline: none !important;
}

.mis-albaranes .arrow[b-ibjglu4rhw] {
    position: absolute;
    right: 16px;
    top: 50%;
    width: 15px;
    height: 15px;
    transform: translateY(-50%) rotate(0deg);
    transition: transform 0.3s ease;
}

.mis-albaranes .select-wrapper[b-ibjglu4rhw] {
    position: relative;
    width: 100%;
}

.mis-albaranes .select-wrapper:focus-within .arrow[b-ibjglu4rhw] {
    transform: translateY(-50%) rotate(90deg);
}

.mis-albaranes .frame-9[b-ibjglu4rhw] {
    display: flex;
    padding-top: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.mis-albaranes .state-layer-wrapper[b-ibjglu4rhw] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.mis-albaranes .state-layer-wrapper:hover[b-ibjglu4rhw] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.mis-albaranes .state-layer-wrapper:hover .label-text-2[b-ibjglu4rhw] {
    color: var(--blanco);
}

.mis-albaranes .label-text-2[b-ibjglu4rhw] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.mis-albaranes .alert p[b-ibjglu4rhw] {
    margin-bottom: 0;
}

.mis-albaranes .tabla-wrapper[b-ibjglu4rhw] {
    padding: 15px;
    border-radius: 20px;
    width: 100%;
}

.mis-albaranes .tabla-container[b-ibjglu4rhw] {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

.mis-albaranes .tabla-mejorada[b-ibjglu4rhw] {
    width: 100%;
    border-collapse: separate;
    font-family: var(--body-large-font-family, sans-serif);
    font-size: 16px;
    padding: 0;
}

.mis-albaranes .tabla-mejorada tbody tr:not(:last-child) td[b-ibjglu4rhw] {
    border-bottom: 1px solid #d3d3d3;
}

.mis-albaranes .tabla-mejorada thead[b-ibjglu4rhw] {
    color: #000000;
    font-weight: bold;
    position: relative;
}

    .mis-albaranes .tabla-mejorada thead[b-ibjglu4rhw]::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: #000000;
    }

.mis-albaranes .tabla-mejorada th[b-ibjglu4rhw],
.mis-albaranes .tabla-mejorada td[b-ibjglu4rhw] {
    padding: 10px;
    text-align: center;
}

.mis-albaranes .tabla-mejorada .th1[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .th3[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .th5[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .th6[b-ibjglu4rhw],
.mis-albaranes .tabla-mejorada .td1[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .td3[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .td5[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .td6[b-ibjglu4rhw] {
    min-width: 180px;
    max-width: 180px;
    width: 180px;
}


.mis-albaranes .tabla-mejorada .th2[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .td2[b-ibjglu4rhw] {
    min-width: 250px;
    max-width: 250px;
    width: 250px;
}

.mis-albaranes .tabla-mejorada .th4[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .td4[b-ibjglu4rhw] {
    min-width: 500px;
    width: 100%;
}

.mis-albaranes .tabla-mejorada .th7[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .td7[b-ibjglu4rhw] {
    min-width: 100px;
    max-width: 100px;
    width: 100px;
}

.mis-albaranes .tabla-mejorada th .subheader[b-ibjglu4rhw] {
    font-size: 0.8em; /* Ajusta el tamaño según lo necesites */
    color: #888888; /* Color gris */
}

.mis-albaranes .tabla-mejorada .td2[b-ibjglu4rhw] {
    text-align: left;
}

.mis-albaranes .tabla-mejorada .td5[b-ibjglu4rhw], .mis-albaranes .tabla-mejorada .td6[b-ibjglu4rhw] {
    text-align: right;
}

.mis-albaranes .tabla-mejorada .td7 .td-content[b-ibjglu4rhw] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 25px;
}

.mis-albaranes .state-layer-wrapper-2[b-ibjglu4rhw] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.mis-albaranes .state-layer-wrapper-2:hover[b-ibjglu4rhw] {
    background-color: var(--primario);
    cursor: pointer;
}

.mis-albaranes .state-layer-wrapper-2:hover .label-text-3[b-ibjglu4rhw] {
    color: var(--blanco);
}

.mis-albaranes .label-text-3[b-ibjglu4rhw] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.mis-albaranes .img[b-ibjglu4rhw] {
    position: relative;
    width: 24px;
    height: 24px;
}

.mis-albaranes .spinner-border[b-ibjglu4rhw] {
    color: var(--blanco);
}

.page-blocker[b-ibjglu4rhw] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-ibjglu4rhw] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/MisFacturas.razor.rz.scp.css */
.mis-facturas[b-xsemtuyi1z] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.mis-facturas .frame[b-xsemtuyi1z] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mis-facturas .titulo[b-xsemtuyi1z] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mis-facturas h2[b-xsemtuyi1z] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.mis-facturas .iconos[b-xsemtuyi1z] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.mis-facturas .div[b-xsemtuyi1z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.mis-facturas .text-wrapper[b-xsemtuyi1z] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.mis-facturas .boton[b-xsemtuyi1z] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

    .mis-facturas .boton:hover[b-xsemtuyi1z] {
        background-color: #80C87C;
    }

.mis-facturas .state-layer[b-xsemtuyi1z] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.mis-facturas .label-text[b-xsemtuyi1z] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.mis-facturas .frame-2[b-xsemtuyi1z] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 75px;
    align-self: stretch;
    width: 100%;
    background-color: var(--grisgris-10);
    border-radius: 15px;
}

.mis-facturas .frame-3[b-xsemtuyi1z] {
    display: flex;
    padding-bottom: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.mis-facturas .text-wrapper-2[b-xsemtuyi1z] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
}

.mis-facturas .frame-4[b-xsemtuyi1z] {
    display: flex;
    align-items: center;
    gap: 100px;
    align-self: stretch;
}

.mis-facturas .frame-5[b-xsemtuyi1z] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    flex: 1 0 0;
}

.mis-facturas .frame-6[b-xsemtuyi1z] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
    border-bottom: 1px solid #d3d3d3;
}

.mis-facturas .text-wrapper-3[b-xsemtuyi1z] {
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

.mis-facturas .frame-7[b-xsemtuyi1z] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

[b-xsemtuyi1z] .mis-facturas .input {
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    display: -webkit-box;
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    overflow: hidden;
    padding: 17px 16px;
    position: relative;
    text-overflow: ellipsis;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

[b-xsemtuyi1z] .mis-facturas input::placeholder {
    color: #888;
}

[b-xsemtuyi1z] .mis-facturas input:focus {
    border: 2px solid #28a745;
    outline: none;
}

.mis-facturas .frame-8[b-xsemtuyi1z] {
    display: flex;
    padding: 20px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.mis-facturas .input-2[b-xsemtuyi1z] {
    appearance: none;
    background-color: var(--blanco);
    border: 2px solid var(--grisgris-10);
    border-radius: 6px;
    color: var(--negro);
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    padding: 17px 16px;
    padding-right: 50px;
    position: relative;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.mis-facturas .input-2:focus[b-xsemtuyi1z] {
    border: 2px solid #3CAA36 !important;
    outline: none !important;
}

.mis-facturas .arrow[b-xsemtuyi1z] {
    position: absolute;
    right: 16px;
    top: 50%;
    width: 15px;
    height: 15px;
    transform: translateY(-50%) rotate(0deg);
    transition: transform 0.3s ease;
}

.mis-facturas .select-wrapper[b-xsemtuyi1z] {
    position: relative;
    width: 100%;
}

.mis-facturas .select-wrapper:focus-within .arrow[b-xsemtuyi1z] {
    transform: translateY(-50%) rotate(90deg);
}

.mis-facturas .frame-9[b-xsemtuyi1z] {
    display: flex;
    padding-top: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.mis-facturas .state-layer-wrapper[b-xsemtuyi1z] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.mis-facturas .state-layer-wrapper:hover[b-xsemtuyi1z] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.mis-facturas .state-layer-wrapper:hover .label-text-2[b-xsemtuyi1z] {
    color: var(--blanco);
}

.mis-facturas .label-text-2[b-xsemtuyi1z] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.mis-facturas .alert p[b-xsemtuyi1z] {
    margin-bottom: 0;
}

.mis-facturas .tabla-wrapper[b-xsemtuyi1z] {
    padding: 15px;
    border-radius: 20px;
    width: 100%;
}

.mis-facturas .tabla-container[b-xsemtuyi1z] {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

.mis-facturas .tabla-mejorada[b-xsemtuyi1z] {
    width: 100%;
    border-collapse: separate;
    font-family: var(--body-large-font-family, sans-serif);
    font-size: 16px;
    padding: 0;
}

.mis-facturas .tabla-mejorada tbody tr:not(:last-child) td[b-xsemtuyi1z] {
    border-bottom: 1px solid #d3d3d3;
}

.mis-facturas .tabla-mejorada thead[b-xsemtuyi1z] {
    color: #000000;
    font-weight: bold;
    position: relative;
}

.mis-facturas .tabla-mejorada thead[b-xsemtuyi1z]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000;
}

.mis-facturas .tabla-mejorada th[b-xsemtuyi1z],
.mis-facturas .tabla-mejorada td[b-xsemtuyi1z] {
    padding: 10px;
    text-align: center;
}

.mis-facturas .tabla-mejorada .th1[b-xsemtuyi1z], .mis-facturas .tabla-mejorada .th2[b-xsemtuyi1z], .mis-facturas .tabla-mejorada .th4[b-xsemtuyi1z], .mis-facturas .tabla-mejorada .th5[b-xsemtuyi1z],
.mis-facturas .tabla-mejorada .td1[b-xsemtuyi1z], .mis-facturas .tabla-mejorada .td2[b-xsemtuyi1z], .mis-facturas .tabla-mejorada .td4[b-xsemtuyi1z], .mis-facturas .tabla-mejorada .td5[b-xsemtuyi1z] {
    min-width: 180px;
    max-width: 180px;
    width: 180px;
}


.mis-facturas .tabla-mejorada .th3[b-xsemtuyi1z], .mis-facturas .tabla-mejorada .td3[b-xsemtuyi1z] {
    min-width: 500px;
    width: 100%;
}

.mis-facturas .tabla-mejorada .th6[b-xsemtuyi1z], .mis-facturas .tabla-mejorada .td6[b-xsemtuyi1z] {
    min-width: 100px;
    max-width: 100px;
    width: 100px;
}

.mis-facturas .tabla-mejorada th .subheader[b-xsemtuyi1z] {
    font-size: 0.8em; /* Ajusta el tamaño según lo necesites */
    color: #888888; /* Color gris */
}

.mis-facturas .tabla-mejorada .td4[b-xsemtuyi1z] {
    text-align: right;
}

.mis-facturas .tabla-mejorada .td5 .td-content[b-xsemtuyi1z] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 25px;
}

.mis-facturas .state-layer-wrapper-2[b-xsemtuyi1z] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.mis-facturas .state-layer-wrapper-2:hover[b-xsemtuyi1z] {
    background-color: var(--primario);
    cursor: pointer;
}

.mis-facturas .state-layer-wrapper-2:hover .label-text-3[b-xsemtuyi1z] {
    color: var(--blanco);
}

.mis-facturas .label-text-3[b-xsemtuyi1z] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.mis-facturas .img[b-xsemtuyi1z] {
    position: relative;
    width: 24px;
    height: 24px;
}

.mis-facturas .spinner-border[b-xsemtuyi1z] {
    color: var(--blanco);
}

.page-blocker[b-xsemtuyi1z] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-xsemtuyi1z] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/MisListas.razor.rz.scp.css */
.mis-listas[b-1wbq8gpt5q] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .mis-listas .frame[b-1wbq8gpt5q] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .mis-listas .titulo[b-1wbq8gpt5q] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .mis-listas .cesta[b-1wbq8gpt5q] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .mis-listas .iconos[b-1wbq8gpt5q] {
        position: absolute;
        top: 19px;
        left: 0;
        width: 24px;
        height: 24px;
    }

    .mis-listas .div[b-1wbq8gpt5q] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .mis-listas .text-wrapper[b-1wbq8gpt5q] {
        position: relative;
        width: fit-content;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: #000000;
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        white-space: nowrap;
        font-style: var(--headline-large-font-style);
    }

    .mis-listas .boton[b-1wbq8gpt5q] {
        display: inline-flex;
        flex: 0 0 auto;
        background-color: var(--primario);
        flex-direction: column;
        height: 52px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        border-radius: 6px;
        overflow: hidden;
    }

    .mis-listas .state-layer[b-1wbq8gpt5q] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .mis-listas .label-text[b-1wbq8gpt5q] {
        color: var(--blanco);
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .mis-listas .listas-header[b-1wbq8gpt5q] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }


    .mis-listas .frame-2[b-1wbq8gpt5q] {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 75px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        background-color: var(--grisgris-10);
        border-radius: 15px;
    }

    .mis-listas .frame-wrapper[b-1wbq8gpt5q] {
        display: flex;
        align-items: flex-start;
        gap: 1062px;
        padding: 0px 0px 20px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-color: #000000;
    }

    .mis-listas .frame-3[b-1wbq8gpt5q] {
        display: flex;
        width: 1201px;
        align-items: center;
        justify-content: space-between;
        position: relative;
    }

    .mis-listas .text-wrapper-2[b-1wbq8gpt5q] {
        position: relative;
        width: 400px;
        margin-top: -1.00px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .mis-listas .text-wrapper-3[b-1wbq8gpt5q] {
        position: relative;
        width: 180px;
        margin-top: -1.00px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        text-align: center;
        letter-spacing: 0;
        line-height: normal;
    }

    .mis-listas .frame-4[b-1wbq8gpt5q] {
        display: flex;
        width: 180px;
        align-items: center;
        justify-content: flex-end;
        gap: 6px;
        position: relative;
    }

    .mis-listas .text-wrapper-4[b-1wbq8gpt5q] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        text-align: right;
        letter-spacing: 0;
        line-height: normal;
    }

    .mis-listas .text-wrapper-5[b-1wbq8gpt5q] {
        position: relative;
        width: fit-content;
        font-family: var(--body-small-font-family);
        font-weight: var(--body-small-font-weight);
        color: var(--grisgris-50);
        font-size: var(--body-small-font-size);
        text-align: right;
        letter-spacing: var(--body-small-letter-spacing);
        line-height: var(--body-small-line-height);
        white-space: nowrap;
        font-style: var(--body-small-font-style);
    }

    .mis-listas .frame-5[b-1wbq8gpt5q] {
        display: flex;
        align-items: center;
        gap: 100px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom-width: 1px;
        border-bottom-style: dashed;
        border-color: var(--grisgris-30);
    }

    .mis-listas .frame-6[b-1wbq8gpt5q] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 35px 0px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .mis-listas .text-wrapper-6[b-1wbq8gpt5q] {
        position: relative;
        width: 400px;
        margin-top: -1.00px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .mis-listas .component-wrapper[b-1wbq8gpt5q] {
        display: flex;
        width: 180px;
        align-items: center;
        justify-content: center;
        gap: 10px;
        position: relative;
    }


    .mis-listas .custom-checkbox[b-1wbq8gpt5q] {
        width: 14px;
        height: 14px;
        border: 1px solid #000000;
        border-radius: 7px;
        -webkit-appearance: none;
        appearance: none;
        cursor: pointer;
        margin: 0;
        position: relative;
    }

    .mis-listas .custom-checkbox:checked[b-1wbq8gpt5q] {
        background-color: green;
        border-color: green;
    }

    .mis-listas .custom-checkbox:focus[b-1wbq8gpt5q] {
        outline: 2px solid green;
    }


    .mis-listas .text-wrapper-7[b-1wbq8gpt5q] {
        position: relative;
        width: 180px;
        margin-top: -1.00px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        text-align: center;
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .mis-listas .text-wrapper-8[b-1wbq8gpt5q] {
        position: relative;
        width: 180px;
        margin-top: -1.00px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        text-align: right;
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .mis-listas .frame-7[b-1wbq8gpt5q] {
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 25px;
        position: relative;
        flex: 0 0 auto;
    }

    .mis-listas .state-layer-wrapper[b-1wbq8gpt5q] {
        display: inline-flex;
        flex-direction: column;
        height: 40px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        flex: 0 0 auto;
        background-color: var(--blanco);
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--primario);
    }

    .mis-listas .img[b-1wbq8gpt5q] {
        position: relative;
        flex: 0 0 auto;
        margin-top: -2.00px;
        margin-bottom: -2.00px;
    }

    .mis-listas .label-text-2[b-1wbq8gpt5q] {
        position: relative;
        width: fit-content;
        margin-top: -3.00px;
        margin-bottom: -1.00px;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--primario);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .mis-listas .iconos-2[b-1wbq8gpt5q] {
        position: relative;
        width: 24px;
        height: 24px;
        cursor: pointer;
    }

    .mis-listas .state-layer[b-1wbq8gpt5q] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
        cursor: pointer;
    }

    .mis-listas .div-wrapper[b-1wbq8gpt5q] {
        display: flex;
        flex-direction: column;
        width: 592px;
        height: 52px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        background-color: var(--blanco);
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--alternativo-oscuro);
        cursor: pointer;
    }

    .mis-listas .label-text-3[b-1wbq8gpt5q] {
        position: relative;
        text-decoration: none;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--negro);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }


    .mis-listas .div-wrapper:hover[b-1wbq8gpt5q] {
        background-color: var(--alternativo-oscuro);
    }

        .mis-listas .div-wrapper:hover .label-text-3[b-1wbq8gpt5q] {
            color: var(--blanco);
        }

    .mis-listas .input:focus[b-1wbq8gpt5q],
    .mis-listas .input-2:focus[b-1wbq8gpt5q] {
        border: 1px solid green;
    }
/* _content/PMCWEB/Components/Pages/MisPuntos.razor.rz.scp.css */
.puntos[b-ezw6iuzb98] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .puntos .frame[b-ezw6iuzb98] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .ttulo[b-ezw6iuzb98] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .CESTA[b-ezw6iuzb98] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .puntos .iconos[b-ezw6iuzb98] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 19px;
        left: 0;
    }

    .puntos .div[b-ezw6iuzb98] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .text-wrapper[b-ezw6iuzb98] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: #000000;
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        white-space: nowrap;
        font-style: var(--headline-large-font-style);
    }

    .puntos .p[b-ezw6iuzb98] {
        position: relative;
        align-self: stretch;
        width: 795px;
        margin-top: -1.00px;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: #000000;
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        font-style: var(--headline-large-font-style);
    }

    .puntos .frame-2[b-ezw6iuzb98] {
        display: flex;
        align-items: center;
        gap: 100px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .frame-3[b-ezw6iuzb98] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
        padding: 30px;
        position: relative;
        flex: 1;
        flex-grow: 1;
        background-color: var(--grisgris-10);
        border-radius: 15px;
        box-shadow: var(--3);
    }

    .puntos .frame-4[b-ezw6iuzb98] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .text-wrapper-2[b-ezw6iuzb98] {
        width: fit-content;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        font-size: 24px;
        letter-spacing: 0;
        line-height: normal;
        position: relative;
        margin-top: -1.00px;
        color: #141414;
    }

    .puntos .text-wrapper-3[b-ezw6iuzb98] {
        position: relative;
        flex: 1;
        margin-top: -1.00px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #141414;
        font-size: 24px;
        text-align: right;
        letter-spacing: 0;
        line-height: normal;
    }

    .puntos .line[b-ezw6iuzb98] {
        position: relative;
        align-self: stretch;
        width: 100%;
        height: 1px;
        object-fit: cover;
    }

    .puntos .text-wrapper-4[b-ezw6iuzb98] {
        position: relative;
        width: 236px;
        margin-top: -1.00px;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: #141414;
        font-size: var(--title-medium-font-size);
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        font-style: var(--title-medium-font-style);
    }

    .puntos .text-wrapper-5[b-ezw6iuzb98] {
        position: relative;
        width: 129.83px;
        margin-top: -1.00px;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: #141414;
        font-size: var(--title-medium-font-size);
        text-align: right;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        font-style: var(--title-medium-font-style);
    }

    .puntos .frame-5[b-ezw6iuzb98] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .puntos .text-wrapper-6[b-ezw6iuzb98] {
        position: relative;
        align-self: stretch;
        margin-top: -1.00px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .puntos .text-wrapper-7[b-ezw6iuzb98] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--grisgris-60);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .puntos .frame-6[b-ezw6iuzb98] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .frame-7[b-ezw6iuzb98] {
        display: flex;
        height: 424px;
        align-items: center;
        justify-content: space-between;
        position: relative;
        align-self: stretch;
        width: 100%;
    }

    .puntos .component[b-ezw6iuzb98] {
        width: 283px;
        justify-content: center;
        gap: 20px;
        padding: 0px 0px 15px;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
    }

    .puntos .image[b-ezw6iuzb98] {
        position: relative;
        align-self: stretch;
        width: 100%;
        height: 283px;
        object-fit: cover;
    }

    .puntos .frame-wrapper[b-ezw6iuzb98] {
        display: flex;
        align-items: flex-start;
        gap: 20px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .frame-8[b-ezw6iuzb98] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .puntos .robot-de-cocina[b-ezw6iuzb98] {
        position: relative;
        align-self: stretch;
        margin-top: -1.00px;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: #000000;
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        font-style: var(--title-medium-font-style);
    }

    .puntos .text-wrapper-8[b-ezw6iuzb98] {
        position: relative;
        align-self: stretch;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: var(--primario);
        font-size: 22px;
        text-align: center;
        letter-spacing: 0;
        line-height: 28px;
    }

    .puntos .component-2[b-ezw6iuzb98] {
        width: 303px;
        justify-content: center;
        gap: 20px;
        padding: 0px 0px 15px;
        border-radius: 15px;
        border: 10px solid;
        border-color: var(--primario);
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
    }

    .puntos .div-wrapper[b-ezw6iuzb98] {
        display: flex;
        align-items: center;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .frame-9[b-ezw6iuzb98] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 100px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .component-3[b-ezw6iuzb98] {
        gap: 24px;
        flex: 1;
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
    }

    .puntos .frame-10[b-ezw6iuzb98] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 24px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .columna[b-ezw6iuzb98] {
        align-self: stretch;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .puntos .input-wrapper[b-ezw6iuzb98] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .puntos .input[b-ezw6iuzb98] {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 17px 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        background-color: var(--gris-10);
        border-radius: 6px;
    }

    .puntos .text-wrapper-9[b-ezw6iuzb98] {
        position: relative;
        flex: 1;
        margin-top: -1.00px;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        color: var(--gris-50);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .puntos .columna-2[b-ezw6iuzb98] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .puntos .frame-11[b-ezw6iuzb98] {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
        position: relative;
        align-self: stretch;
        flex: 0 0 auto;
    }

    .puntos .frame-12[b-ezw6iuzb98] {
        display: flex;
        flex-direction: column;
        width: 549px;
        height: 181px;
        align-items: center;
        justify-content: center;
        gap: 20px;
        padding: 30px;
        margin-bottom: 40px;
        position: relative;
        background-color: var(--grisgris-10);
        border-radius: 15px;
        box-shadow: var(--3);
    }

    .puntos .boton[b-ezw6iuzb98] {
        height: 59px;
        align-self: stretch;
        width: 100%;
        background-color: var(--primario);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        border-radius: 6px;
        overflow: hidden;
        cursor: pointer;
    }

    .puntos .input[b-ezw6iuzb98] {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 17px 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        background-color: var(--gris-10);
        border: 2px solid transparent; /* Borde inicial transparente */
        border-radius: 6px;
    }

        /* Al hacer focus, cambia el color del borde a verde */
        .puntos .input:focus[b-ezw6iuzb98] {
            border-color: green;
            outline: none; /* Opcional para quitar el outline por defecto del navegador */
        }


    .puntos .state-layer[b-ezw6iuzb98] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;

    }

    .puntos .label-text[b-ezw6iuzb98] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--blanco);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .puntos .state-layer-wrapper[b-ezw6iuzb98] {
        width: 592px;
        height: 52px;
        margin-top: 40px;
        margin-left: 550px;
        background-color: var(--blanco);
        border: 1px solid;
        border-color: var(--alternativo-oscuro);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        border-radius: 6px;
        overflow: hidden;
        cursor: pointer;
    }
        .puntos .state-layer-wrapper:hover[b-ezw6iuzb98] {
            background-color: var(--alternativo-oscuro)
        }

    .puntos .label-text-2[b-ezw6iuzb98] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--negro);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
        text-decoration: none;
    }

    .puntos .state-layer-wrapper:hover .label-text-2[b-ezw6iuzb98] {
        color: var(--blanco);
    }
/* _content/PMCWEB/Components/Pages/MisSellos.razor.rz.scp.css */
.sellos[b-5s7yhxnz9v] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .sellos .frame[b-5s7yhxnz9v] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .sellos .titulo[b-5s7yhxnz9v] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .sellos .CESTA[b-5s7yhxnz9v] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .sellos .iconos[b-5s7yhxnz9v] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 19px;
        left: 0;
    }

    .sellos .text-wrapper[b-5s7yhxnz9v] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: #000000;
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        white-space: nowrap;
        font-style: var(--headline-large-font-style);
    }

    .sellos .div[b-5s7yhxnz9v] {
        position: relative;
        width: fit-content;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        white-space: nowrap;
        font-style: var(--body-large-font-style);
    }

    .sellos .frame-2[b-5s7yhxnz9v] {
        display: flex;
        align-items: flex-start;
        gap: 100px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .sellos .frame-3[b-5s7yhxnz9v] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 50px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .sellos .frame-4[b-5s7yhxnz9v] {
        display: flex;
        align-items: flex-start;
        gap: 50px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .sellos .frame-5[b-5s7yhxnz9v] {
        gap: 30px;
        flex: 1;
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
    }

    .sellos .frame-6[b-5s7yhxnz9v] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom: 1px solid #ABABAB;
    }

    .sellos .text-wrapper-2[b-5s7yhxnz9v] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: var(--title-large-font-family);
        font-weight: var(--title-large-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--title-large-font-size);
        letter-spacing: var(--title-large-letter-spacing);
        line-height: var(--title-large-line-height);
        white-space: nowrap;
        font-style: var(--title-large-font-style);
    }

    .sellos .vector[b-5s7yhxnz9v] {
        position: relative;
        align-self: stretch;
        width: 100%;
        height: 1px;
        margin-bottom: -0.5px;
        margin-left: -0.5px;
        margin-right: -0.5px;
        object-fit: cover;
    }

    .sellos .frame-7[b-5s7yhxnz9v] {
        display: inline-flex;
        align-items: flex-start;
        gap: 30px;
        position: relative;
        flex: 0 0 auto;
    }

    .sellos .frame-wrapper[b-5s7yhxnz9v] {
        display: flex;
        width: 150px;
        align-items: center;
        gap: 20px;
        position: relative;
    }

    .sellos .frame-8[b-5s7yhxnz9v] {
        display: inline-flex;
        align-items: center;
        gap: 20px;
        position: relative;
        flex: 0 0 auto;
    }

    .sellos .custom-checkbox[b-5s7yhxnz9v] {
        width: 14px;
        height: 14px;
        border: 1px solid #000000;
        border-radius: 7px;
        -webkit-appearance: none;
        appearance: none;
        cursor: pointer;
        margin: 0;
        position: relative;
    }

        .sellos .custom-checkbox:checked[b-5s7yhxnz9v] {
            background-color: green;
            border-color: green;
        }

        .sellos .custom-checkbox:focus[b-5s7yhxnz9v] {
            outline: 2px solid green;
        }

    .sellos .text-wrapper-3[b-5s7yhxnz9v] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: var(--label-large-font-family);
        font-weight: var(--label-large-font-weight);
        color: #000000;
        font-size: var(--label-large-font-size);
        letter-spacing: var(--label-large-letter-spacing);
        line-height: var(--label-large-line-height);
        white-space: nowrap;
        font-style: var(--label-large-font-style);
    }

    .sellos .component-2[b-5s7yhxnz9v] {
        position: relative;
        width: 14px;
        height: 14px;
        border-radius: 7px;
        border: 1px solid;
        border-color: #000000;
    }

    .sellos .overlap-group-wrapper[b-5s7yhxnz9v] {
        position: relative;
        align-self: stretch;
        width: 100%;
        height: 59px;
    }

    .sellos .overlap-group[b-5s7yhxnz9v] {
        position: relative;
        width: 505px;
        height: 59px;
        border-radius: 6px;
    }

    .sellos .input[b-5s7yhxnz9v] {
        width: 505px;
        position: absolute;
        top: 0;
        left: 0;
        display: flex;
        height: 59px;
        align-items: flex-start;
        gap: 10px;
        padding: 17px 16px;
        background-color: var(--gris-10);
        border-radius: 6px;
    }

    .sellos .NIF[b-5s7yhxnz9v] {
        width: 378px;
        color: var(--gris-50);
        position: relative;
        margin-top: -1px;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .sellos .img[b-5s7yhxnz9v] {
        position: absolute;
        width: 12px;
        height: 12px;
        top: 23px;
        left: 474px;
        rotate: 90deg;
    }

    .sellos .frame-9[b-5s7yhxnz9v] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 84px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .sellos .frame-10[b-5s7yhxnz9v] {
        display: flex;
        align-items: center;
        gap: 50px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .sellos .input-wrapper[b-5s7yhxnz9v] {
        position: relative;
        flex: 1;
        flex-grow: 1;
        height: 59px;
    }

    .sellos .NIF-wrapper[b-5s7yhxnz9v] {
        width: 505px;
        position: relative;
        display: flex;
        height: 59px;
        align-items: flex-start;
        gap: 10px;
        padding: 17px 16px;
        background-color: var(--gris-10);
        border-radius: 6px;
    }

    .sellos .NIF-2[b-5s7yhxnz9v] {
        width: 486px;
        margin-right: -13px;
        color: var(--gris-50);
        position: relative;
        margin-top: -1px;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .sellos .frame-11[b-5s7yhxnz9v] {
        display: flex;
        align-items: center;
        gap: 25px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .sellos .boton[b-5s7yhxnz9v] {
        height: 40px;
        flex: 1;
        flex-grow: 1;
        background-color: var(--blanco);
        border: 1px solid;
        border-color: var(--primario);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        border-radius: 6px;
        overflow: hidden;
    }

    .sellos .state-layer[b-5s7yhxnz9v] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .sellos .label-text[b-5s7yhxnz9v] {
        position: relative;
        width: fit-content;
        margin-top: -3px;
        margin-bottom: -1px;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--primario);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .sellos .frame-12[b-5s7yhxnz9v] {
        gap: 10px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        border-top: 1px solid #ABABAB;
    }

    .sellos .frame-13[b-5s7yhxnz9v] {
        display: flex;
        align-items: flex-start;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .sellos .input-2[b-5s7yhxnz9v] {
        width: 914px;
        position: relative;
        height: 59px;
        padding: 17px 16px;
        background-color: var(--gris-10);
        border-radius: 6px;
        border: none;
        flex: 1;
        color: var(--gris-50);
        margin-top: -1px;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .sellos .frame-14[b-5s7yhxnz9v] {
        display: flex;
        flex-direction: column;
        width: 116px;
        height: 59px;
        align-items: flex-end;
        gap: 10px;
        padding: 26px 16px;
        position: relative;
    }

    .sellos .div-wrapper[b-5s7yhxnz9v] {
        width: 116px;
        position: absolute;
        top: 0;
        left: 0;
        display: flex;
        height: 59px;
        align-items: flex-start;
        gap: 10px;
        padding: 17px 16px;
        background-color: var(--gris-10);
        border-radius: 6px;
    }

    .sellos .NIF-3[b-5s7yhxnz9v] {
        width: 73px;
        color: #212121;
        text-align: center;
        position: relative;
        margin-top: -1px;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .sellos .vector-2[b-5s7yhxnz9v] {
        position: relative;
        width: 10px;
        height: 10px;
        margin-right: -0.75px;
        rotate: 90deg;
    }

    .sellos .frame-15[b-5s7yhxnz9v] {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 50px;
        position: relative;
        flex: 0 0 auto;
    }

    .sellos .image[b-5s7yhxnz9v] {
        position: relative;
        width: 530px;
        height: 530px;
        object-fit: cover;
    }

    .sellos .rectangle[b-5s7yhxnz9v] {
        position: relative;
        align-self: stretch;
        width: 100%;
        height: 288px;
        background-color: var(--gris-10);
    }

    .sellos .frame-16[b-5s7yhxnz9v] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
        padding: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        background-color: var(--gris-10);
        border-radius: 15px;
        box-shadow: var(--3);
    }

    .sellos .line[b-5s7yhxnz9v] {
        position: relative;
        align-self: stretch;
        width: 100%;
        height: 1px;
        margin-top: -1px;
        object-fit: cover;
    }

    .sellos .frame-17[b-5s7yhxnz9v] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 10px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .sellos .text-wrapper-4[b-5s7yhxnz9v] {
        position: relative;
        width: 236px;
        margin-top: -1px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: var(--negro);
        font-size: 24px;
        letter-spacing: 0;
        line-height: normal;
    }

    .sellos .text-wrapper-5[b-5s7yhxnz9v] {
        position: relative;
        width: 129.83px;
        margin-top: -1px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: var(--negro);
        font-size: 24px;
        text-align: right;
        letter-spacing: 0;
        line-height: normal;
    }

    .sellos .frame-18[b-5s7yhxnz9v] {
        display: inline-flex;
        align-items: flex-start;
        gap: 20px;
        position: relative;
        flex: 0 0 auto;
    }

    .sellos .frame-19[b-5s7yhxnz9v] {
        gap: 10px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
    }

    .sellos .state-layer[b-5s7yhxnz9v] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
        cursor: pointer;
    }

    .sellos .state-layer-wrapper[b-5s7yhxnz9v] {
        display: flex;
        flex-direction: column;
        width: 592px;
        height: 52px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        background-color: var(--blanco);
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--alternativo-oscuro);
        cursor: pointer;
    }

    .sellos .label-text-3[b-5s7yhxnz9v] {
        position: relative;
        text-decoration: none;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--negro);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }


    .sellos .state-layer-wrapper:hover[b-5s7yhxnz9v] {
        background-color: var(--alternativo-oscuro);
    }

    .sellos .state-layer-wrapper:hover .label-text-2[b-5s7yhxnz9v] {
        color: var(--blanco);
    }

    .sellos .input:focus[b-5s7yhxnz9v],
    .sellos .input-2:focus[b-5s7yhxnz9v] {
        border: 1px solid green;
    }

    .sellos .boton-2[b-5s7yhxnz9v] {
        width: 592px;
        height: 54px;
        background-color: var(--primario);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        border-radius: 6px;
        overflow: hidden;
        cursor: pointer;
    }

    .sellos .label-text-wrapper[b-5s7yhxnz9v] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .sellos .label-text-3[b-5s7yhxnz9v] {
        color: var(--blanco);
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }
/* _content/PMCWEB/Components/Pages/MisTarifas.razor.rz.scp.css */
.tarifas[b-0f5rpm9878] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .tarifas .frame[b-0f5rpm9878] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .tarifas .ttulo[b-0f5rpm9878] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .tarifas .CESTA[b-0f5rpm9878] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: "Nunito Sans-Bold", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tarifas .iconos[b-0f5rpm9878] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 19px;
        left: 0;
    }

    .tarifas .div[b-0f5rpm9878] {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .tarifas .div-wrapper[b-0f5rpm9878] {
        display: flex;
        align-items: center;
        gap: 30px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .tarifas .text-wrapper[b-0f5rpm9878] {
        position: relative;
        width: fit-content;
        margin-top: -1px;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: #000000;
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        white-space: nowrap;
        font-style: var(--headline-large-font-style);
    }

    .tarifas .frame-2[b-0f5rpm9878] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 200px;
        position: relative;
        flex: 0 0 auto;
    }

    .tarifas .frame-3[b-0f5rpm9878] {
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 50px;
        position: relative;
        flex: 0 0 auto;
    }

    .tarifas .representacin-PDF[b-0f5rpm9878] {
        position: relative;
        width: 121.69px;
        height: 150px;
        object-fit: cover;
    }

    .tarifas .boton[b-0f5rpm9878] {
        display: inline-flex;
        flex: 0 0 auto;
        background-color: var(--primario);
        flex-direction: column;
        height: 52px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        border-radius: 6px;
        overflow: hidden;
        cursor: pointer;
    }

    .tarifas .state-layer[b-0f5rpm9878] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .tarifas .label-text[b-0f5rpm9878] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--blanco);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
        
    }

    .tarifas .frame-4[b-0f5rpm9878] {
        display: flex;
        width: 359.26px;
        align-items: center;
        justify-content: flex-end;
        gap: 50px;
        position: relative;
    }

    .tarifas .representacin-EXCEL[b-0f5rpm9878] {
        position: relative;
        width: 161.26px;
        height: 150px;
    }

    .tarifas .state-layer-wrapper[b-0f5rpm9878] {
        display: flex;
        width: 592px;
        background-color: var(--blanco);
        border: 1px solid;
        border-color: var(--alternativo-oscuro);
        flex-direction: column;
        height: 52px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        border-radius: 6px;
        overflow: hidden;
        cursor: pointer;
    }

        .tarifas .state-layer-wrapper:hover[b-0f5rpm9878] {
            background-color: var(--alternativo-oscuro);
        }

    .tarifas .label-text-2[b-0f5rpm9878] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--negro);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
        text-decoration: none;
    }

        .tarifas .state-layer-wrapper:hover .label-text-2[b-0f5rpm9878]{
            color: var(--blanco);
        }
/* _content/PMCWEB/Components/Pages/PedidosEnCurso.razor.rz.scp.css */
.pedidos-en-curso[b-xnoqwpn0pa] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.pedidos-en-curso .frame[b-xnoqwpn0pa] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    position: relative;
}

.pedidos-en-curso .titulo[b-xnoqwpn0pa] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.pedidos-en-curso h2[b-xnoqwpn0pa] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.pedidos-en-curso .iconos[b-xnoqwpn0pa] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.pedidos-en-curso .div[b-xnoqwpn0pa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    position: relative;
}

.pedidos-en-curso .text-wrapper[b-xnoqwpn0pa] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.pedidos-en-curso .boton[b-xnoqwpn0pa] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.pedidos-en-curso .boton:hover[b-xnoqwpn0pa] {
    background-color: #80C87C;
}

.pedidos-en-curso .state-layer[b-xnoqwpn0pa] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.pedidos-en-curso .label-text[b-xnoqwpn0pa] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.pedidos-en-curso .label-text-2[b-xnoqwpn0pa] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.pedidos-en-curso .frame-2[b-xnoqwpn0pa] {
    background-color: var(--grisgris-10);
    border-radius: 15px;
    align-items: flex-start;
    align-self: stretch;
    display: flex;
    flex: 0 0 auto;
    gap: 50px;
    justify-content: center;
    padding: 75px;
    position: relative;
    width: 100%;
}

.tabla-wrapper[b-xnoqwpn0pa] {
    background-color: #F5F5F5;
    border-radius: 20px;
    width: 100%;
}

.tabla-container[b-xnoqwpn0pa] {
    background-color: #F5F5F5;
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

.pedidos-en-curso .tabla-mejorada[b-xnoqwpn0pa] {
    width: 100%;
    border-collapse: separate;
    font-family: var(--body-large-font-family, sans-serif);
    background-color: #F5F5F5;
    font-size: 16px;
    padding: 0;
}

.pedidos-en-curso .tabla-mejorada tbody tr:not(:last-child) td[b-xnoqwpn0pa] {
    border-bottom: 1px solid #d3d3d3;
}

.pedidos-en-curso .tabla-mejorada thead[b-xnoqwpn0pa] {
    background-color: #F5F5F5;
    color: #000000;
    font-weight: bold;
    position: relative;
}

.pedidos-en-curso .tabla-mejorada thead[b-xnoqwpn0pa]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000;
}

.pedidos-en-curso .tabla-mejorada th[b-xnoqwpn0pa],
.pedidos-en-curso .tabla-mejorada td[b-xnoqwpn0pa] {
    padding: 10px;
    min-width: 100px;
    text-align: center;
    background-color: #F5F5F5;
}

.pedidos-en-curso .tabla-mejorada .th1[b-xnoqwpn0pa] {
    min-width: 110px;
    width: 110px;
}

.pedidos-en-curso .tabla-mejorada .th2[b-xnoqwpn0pa], .pedidos-en-curso .tabla-mejorada .th3[b-xnoqwpn0pa], .pedidos-en-curso .tabla-mejorada .th5[b-xnoqwpn0pa], .pedidos-en-curso .tabla-mejorada .th6[b-xnoqwpn0pa], .pedidos-en-curso .tabla-mejorada .th7[b-xnoqwpn0pa] {
    min-width: 180px;
    width: 180px;
}

.pedidos-en-curso .tabla-mejorada .th4[b-xnoqwpn0pa] {
    min-width: 350px;
    width: 350px;
}

.pedidos-en-curso .tabla-mejorada .th8[b-xnoqwpn0pa] {
    min-width: 250px;
    width: 250px;
}

.pedidos-en-curso .tabla-mejorada .th8-small[b-xnoqwpn0pa] {
    min-width: 100px;
    width: 100px;
}

.pedidos-en-curso .tabla-mejorada th .subheader[b-xnoqwpn0pa] {
    font-size: 0.8em; /* Ajusta el tamaño según lo necesites */
    color: #888888; /* Color gris */
}

.pedidos-en-curso .tabla-mejorada td[b-xnoqwpn0pa] {
    min-width: 100px;
    margin-top: 20px;
}

.pedidos-en-curso .tabla-mejorada .td4[b-xnoqwpn0pa] {
    min-width: 350px;
}

.pedidos-en-curso .tabla-mejorada .td5[b-xnoqwpn0pa], .pedidos-en-curso .tabla-mejorada .td6[b-xnoqwpn0pa] {
    text-align: right;
}

.pedidos-en-curso .tabla-mejorada .td8 .td-content[b-xnoqwpn0pa], .pedidos-en-curso .tabla-mejorada .td8-small .td-content[b-xnoqwpn0pa] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.pedidos-en-curso .tabla-mejorada th[b-xnoqwpn0pa] {
    min-width: 100px;
}

.pedidos-en-curso .state-layer-wrapper[b-xnoqwpn0pa] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.pedidos-en-curso .state-layer-wrapper:hover[b-xnoqwpn0pa] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.pedidos-en-curso .state-layer-wrapper:hover .label-text-2[b-xnoqwpn0pa] {
    color: var(--blanco);
}

.pedidos-en-curso .state-layer-wrapper-2[b-xnoqwpn0pa] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.pedidos-en-curso .state-layer-wrapper-2:hover[b-xnoqwpn0pa] {
    background-color: var(--primario);
    cursor: pointer;
}

.pedidos-en-curso .state-layer-wrapper-2:hover .label-text-3[b-xnoqwpn0pa] {
    color: var(--blanco);
}

.pedidos-en-curso .label-text-3[b-xnoqwpn0pa] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.pedidos-en-curso .img[b-xnoqwpn0pa] {
    position: relative;
    width: 24px;
    height: 24px;
}

.pedidos-en-curso .spinner-border[b-xnoqwpn0pa] {
    color: var(--blanco);
}

.page-blocker[b-xnoqwpn0pa] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-xnoqwpn0pa] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/PedidosPendientes.razor.rz.scp.css */
.pedidos-pendientes[b-um73pkj88f] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.pedidos-pendientes .frame[b-um73pkj88f] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    position: relative;
}

.pedidos-pendientes .titulo[b-um73pkj88f] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.pedidos-pendientes h2[b-um73pkj88f] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.pedidos-pendientes .iconos[b-um73pkj88f] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.pedidos-pendientes .div[b-um73pkj88f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    position: relative;
}

.pedidos-pendientes .text-wrapper[b-um73pkj88f] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.pedidos-pendientes .boton[b-um73pkj88f] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.pedidos-pendientes .boton:hover[b-um73pkj88f] {
    background-color: #80C87C;
}

.pedidos-pendientes .state-layer[b-um73pkj88f] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.pedidos-pendientes .label-text[b-um73pkj88f] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.pedidos-pendientes .label-text-2[b-um73pkj88f] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.pedidos-pendientes .frame-2[b-um73pkj88f] {
    background-color: var(--grisgris-10);
    border-radius: 15px;
    align-items: flex-start;
    align-self: stretch;
    display: flex;
    flex: 0 0 auto;
    gap: 50px;
    justify-content: center;
    padding: 75px;
    position: relative;
    width: 100%;
}

.tabla-wrapper[b-um73pkj88f] {
    background-color: #F5F5F5;
    border-radius: 20px;
    width: 100%;
}

.tabla-container[b-um73pkj88f] {
    background-color: #F5F5F5;
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

.pedidos-pendientes .tabla-mejorada[b-um73pkj88f] {
    width: 100%;
    border-collapse: separate;
    font-family: var(--body-large-font-family, sans-serif);
    background-color: #F5F5F5;
    font-size: 16px;
    padding: 0;
}

.pedidos-pendientes .tabla-mejorada tbody tr:not(:last-child) td[b-um73pkj88f] {
    border-bottom: 1px solid #d3d3d3;
}

.pedidos-pendientes .tabla-mejorada thead[b-um73pkj88f] {
    background-color: #F5F5F5;
    color: #000000;
    font-weight: bold;
    position: relative;
}

.pedidos-pendientes .tabla-mejorada thead[b-um73pkj88f]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000;
}

.pedidos-pendientes .tabla-mejorada th[b-um73pkj88f],
.pedidos-pendientes .tabla-mejorada td[b-um73pkj88f] {
    padding: 10px;
    min-width: 100px;
    text-align: center;
    background-color: #F5F5F5;
}

.pedidos-pendientes .tabla-mejorada .th1[b-um73pkj88f] {
    min-width: 110px;
    width: 110px;
}

.pedidos-pendientes .tabla-mejorada .th2[b-um73pkj88f], .pedidos-pendientes .tabla-mejorada .th3[b-um73pkj88f], .pedidos-pendientes .tabla-mejorada .th5[b-um73pkj88f], .pedidos-pendientes .tabla-mejorada .th6[b-um73pkj88f] {
    min-width: 180px;
    width: 180px;
}

.pedidos-pendientes .tabla-mejorada .th4[b-um73pkj88f] {
    min-width: 350px;
    width: 350px;
}

.pedidos-pendientes .tabla-mejorada .th7[b-um73pkj88f] {
    min-width: 300px;
    width: 300px;
}

.pedidos-pendientes .tabla-mejorada th .subheader[b-um73pkj88f] {
    font-size: 0.8em; /* Ajusta el tamaño según lo necesites */
    color: #888888; /* Color gris */
}

.pedidos-pendientes .tabla-mejorada td[b-um73pkj88f] {
    min-width: 100px;
    margin-top: 20px;
}

.pedidos-pendientes .tabla-mejorada .td4[b-um73pkj88f] {
    min-width: 350px;
}

.pedidos-pendientes .tabla-mejorada .td5[b-um73pkj88f], .pedidos-pendientes .tabla-mejorada .td6[b-um73pkj88f] {
    text-align: right;
}

.pedidos-pendientes .tabla-mejorada .td7 .td-content[b-um73pkj88f] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.pedidos-pendientes .tabla-mejorada th[b-um73pkj88f] {
    min-width: 100px;
}

.pedidos-pendientes .state-layer-wrapper[b-um73pkj88f] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.pedidos-pendientes .state-layer-wrapper:hover[b-um73pkj88f] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.pedidos-pendientes .state-layer-wrapper:hover .label-text-2[b-um73pkj88f] {
    color: var(--blanco);
}

.pedidos-pendientes .state-layer-wrapper-2[b-um73pkj88f] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.pedidos-pendientes .state-layer-wrapper-2:hover[b-um73pkj88f] {
    background-color: var(--primario);
    cursor: pointer;
}

.pedidos-pendientes .state-layer-wrapper-2:hover .label-text-3[b-um73pkj88f] {
    color: var(--blanco);
}

.pedidos-pendientes .label-text-3[b-um73pkj88f] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.pedidos-pendientes .img[b-um73pkj88f] {
    position: relative;
    width: 24px;
    height: 24px;
}

.pedidos-pendientes .spinner-border[b-um73pkj88f] {
    color: var(--blanco);
}

.page-blocker[b-um73pkj88f] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-um73pkj88f] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/PerfilUsuario.razor.rz.scp.css */
.perfil-de-usuario[b-mc6jnh76en] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.perfil-de-usuario .frame[b-mc6jnh76en] {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /*center;*/
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.perfil-de-usuario .titulo[b-mc6jnh76en] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.perfil-de-usuario h2[b-mc6jnh76en] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.perfil-de-usuario .iconos[b-mc6jnh76en] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.perfil-de-usuario .div[b-mc6jnh76en] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.perfil-de-usuario .text-wrapper[b-mc6jnh76en] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.perfil-de-usuario .boton[b-mc6jnh76en] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.perfil-de-usuario .boton:hover[b-mc6jnh76en] {
    background-color: #80C87C;
}

.perfil-de-usuario .state-layer[b-mc6jnh76en] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.perfil-de-usuario .label-text[b-mc6jnh76en] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.perfil-de-usuario .frame-2[b-mc6jnh76en] {
    background-color: var(--grisgris-10);
    border-radius: 15px;
    display: block;
    position: relative;
    width: 100%;
    padding: 75px 0px;
}

.perfil-de-usuario .frame-3[b-mc6jnh76en] {
    align-items: flex-start;
    align-self: stretch;
    display: flex;
    flex: 0 0 auto;
    gap: 50px;
    justify-content: center;
    padding: 0px;
    position: relative;
    width: 100%;
}

.perfil-de-usuario .frame-4[b-mc6jnh76en] {
    align-items: flex-start;
    display: inline-flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 10px;
    position: relative;
    width: 750px;
}

.perfil-de-usuario .frame-5[b-mc6jnh76en] {
    align-items: center;
    align-self: stretch;
    display: flex;
    gap: 30px;
    height: 59px;
    justify-content: center;
    position: relative;
    width: 100%;
}

.perfil-de-usuario .frame-6[b-mc6jnh76en] {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative;
    width: 100%;
    margin-top: 50px;
}

.perfil-de-usuario .frame-7[b-mc6jnh76en] {
    align-items: center;
    display: inline-flex;
    flex: 0 0 auto;
    gap: 20px;
    position: relative;
    margin-left: 175px;
}

.perfil-de-usuario .frame-8[b-mc6jnh76en] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 75px;
    align-self: stretch;
    width: 100%;
    position: relative;
    flex: 0 0 auto;
}

.perfil-de-usuario .frame-9[b-mc6jnh76en] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    align-self: stretch;
    width: 100%;
    position: relative;
    flex: 0 0 auto;
}

.perfil-de-usuario .frame-10[b-mc6jnh76en] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px 0px 20px;
    align-self: stretch;
    width: 100%;
    margin-top: -1.00px;
    margin-left: -1.00px;
    margin-right: -1.00px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-color: var(--grisgris-30);
    position: relative;
    flex: 0 0 auto;
}

.perfil-de-usuario .frame-11[b-mc6jnh76en] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    position: relative;
    flex: 0 0 auto;
}

.perfil-de-usuario .text-wrapper-2[b-mc6jnh76en] {
    align-self: stretch;
    color: var(--black-fonts-headings);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.15px;
    line-height: 24px;
    position: relative;
    text-align: right;
    width: 350px;
}

.perfil-de-usuario .text-wrapper-3[b-mc6jnh76en] {
    position: relative;
    width: 350px;
    font-family: "Nunito Sans";
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 16px;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.perfil-de-usuario .text-wrapper-4[b-mc6jnh76en] {
    position: relative;
    width: 275px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 16px;
    text-align: right;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.perfil-de-usuario .text-wrapper-5[b-mc6jnh76en] {
    position: relative;
    width: 275px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 22px;
    text-align: right;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.perfil-de-usuario .text-wrapper-6[b-mc6jnh76en] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: var(--label-large-font-family);
    font-weight: var(--label-large-font-weight);
    color: var(--black-fonts-headings);
    font-size: var(--label-large-font-size);
    letter-spacing: var(--label-large-letter-spacing);
    line-height: var(--label-large-line-height);
    white-space: nowrap;
    font-style: var(--label-large-font-style);
}

.perfil-de-usuario .input[b-mc6jnh76en] {
    background-color: var(--blanco);
    border: none;
    border-radius: 6px;
    color: var(--negro);
    display: -webkit-box;
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    overflow: hidden;
    padding: 17px 16px;
    position: relative;
    text-overflow: ellipsis;
    width: 350px;
    max-width: 350px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.perfil-de-usuario input[b-mc6jnh76en]::placeholder {
    color: #888;
}

.perfil-de-usuario input:focus[b-mc6jnh76en] {
    border: 2px solid #28a745;
    outline: none;
}

.perfil-de-usuario .input-wrapper[b-mc6jnh76en] {
    position: relative;
    width: 350px;
}

.perfil-de-usuario .input-wrapper .input[b-mc6jnh76en] {
    width: 100%;
    padding-right: 40px;
}

.perfil-de-usuario .input-wrapper .img[b-mc6jnh76en] {
    cursor: pointer;
    height: 24px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
}

.perfil-de-usuario .custom-checkbox[b-mc6jnh76en] {
    appearance: none;
    border: 1px solid #000000;
    border-radius: 7px;
    cursor: pointer;
    height: 14px;
    margin: 0;
    position: relative;
    width: 14px;
    -webkit-appearance: none;
}

.perfil-de-usuario .custom-checkbox:checked[b-mc6jnh76en] {
    background-color: green;
    border-color: green;
}

.perfil-de-usuario .custom-checkbox:focus[b-mc6jnh76en] {
    outline: 2px solid green;
}

.perfil-de-usuario .img[b-mc6jnh76en] {
    height: 24px;
    position: relative;
    width: 24px;
}

.perfil-de-usuario .p[b-mc6jnh76en] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: var(--label-large-font-family);
    font-weight: var(--label-large-font-weight);
    color: #000000;
    font-size: var(--label-large-font-size);
    letter-spacing: var(--label-large-letter-spacing);
    line-height: var(--label-large-line-height);
    white-space: nowrap;
    font-style: var(--label-large-font-style);
}

.perfil-de-usuario .label-text-4[b-mc6jnh76en] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.perfil-de-usuario .state-layer-wrapper[b-mc6jnh76en] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.perfil-de-usuario .state-layer-wrapper:hover[b-mc6jnh76en] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.perfil-de-usuario .state-layer-wrapper:hover .label-text-2[b-mc6jnh76en] {
    color: var(--blanco);
}

.perfil-de-usuario .state-layer-wrapper-2[b-mc6jnh76en] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.perfil-de-usuario .state-layer-wrapper-2:hover[b-mc6jnh76en] {
    background-color: var(--primario);
    cursor: pointer;
}

.perfil-de-usuario .state-layer-wrapper-2:hover .label-text-4[b-mc6jnh76en] {
    color: var(--blanco);
}

.perfil-de-usuario .label-text-2[b-mc6jnh76en] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.perfil-de-usuario .debemos-actualizar[b-mc6jnh76en] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 22px;
    text-align: center;
    letter-spacing: 0;
    line-height: 28px;
}

.perfil-de-usuario .span[b-mc6jnh76en] {
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #2d2e2e;
    font-size: 22px;
    letter-spacing: 0;
    line-height: 28px;
}

.perfil-de-usuario .text-wrapper-7[b-mc6jnh76en] {
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
}

.perfil-de-usuario .tabla-container[b-mc6jnh76en] {
    width: 100%;
}

.perfil-de-usuario .tabla[b-mc6jnh76en] {
    width: 100%;
    border-collapse: separate;
    font-family: sans-serif;
    background-color: #ffffff;
    font-size: 14px;
    position: relative;
}

.perfil-de-usuario .tabla thead[b-mc6jnh76en] {
    background-color: #ffffff;
    color: #000000;
    font-weight: bold;
    position: relative;
}

.perfil-de-usuario .tabla thead[b-mc6jnh76en]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000; /* Color de la línea */
}

.perfil-de-usuario .tabla th[b-mc6jnh76en],
.perfil-de-usuario .tabla td[b-mc6jnh76en] {
    padding: 10px 30px;
    text-align: center;
    background-color: #ffffff;
}

.perfil-de-usuario .tabla th[b-mc6jnh76en] {
    min-width: 100px;
}

.perfil-de-usuario .alert p[b-mc6jnh76en] {
    margin-bottom: 0;
}

.perfil-de-usuario .spinner-border[b-mc6jnh76en] {
    color: var(--blanco);
}

.page-blocker[b-mc6jnh76en] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-mc6jnh76en] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/Productos.razor.rz.scp.css */
/* =================================
   CONTENEDOR PRINCIPAL Y TOOLBAR
   ================================= */

.productos-page-container[b-6f5p5t4qkt] {
    margin: 0; /* Sin margen, usamos padding en el toolbar */
    padding: 20px 0;
    box-sizing: border-box;
}

/* Toolbar superior - STICKY */
.productos-toolbar[b-6f5p5t4qkt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    width: 100%;
    box-sizing: border-box;
    max-width: 100%;
    padding: 0 115px; /* Padding horizontal como en Figma */
    
    /* Sticky positioning */
    position: sticky;
    top: 0;
    z-index: 100;
    background: white;
    transition: all 0.3s ease;
    box-shadow: 0 0 0 rgba(0,0,0,0);
}

/* Cuando el toolbar está en modo sticky (scroll activo) */
.productos-toolbar.scrolled[b-6f5p5t4qkt] {
    background: #3CAA36; /* Verde de Figma */
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.1);
    padding-top: 15px;
    padding-bottom: 15px;
}

/* En modo sticky, cambiar colores de botones y texto a blanco */
.productos-toolbar.scrolled .toolbar-left button[b-6f5p5t4qkt] {
    color: #FFFFFF;
}

.productos-toolbar.scrolled .toolbar-left button i[b-6f5p5t4qkt] {
    color: #FFFFFF;
}

/* Asegurar que el texto dentro del botón también sea blanco */
.productos-toolbar.scrolled #categoryToggleBtn[b-6f5p5t4qkt],
.productos-toolbar.scrolled #filterToggleBtn[b-6f5p5t4qkt] {
    color: #FFFFFF !important;
}

/* Ocultar elementos que no deben aparecer en modo sticky */
.productos-toolbar.scrolled .toolbar-title[b-6f5p5t4qkt],
.productos-toolbar.scrolled .productos-breadcrumb[b-6f5p5t4qkt],
.productos-toolbar.scrolled .vista-label[b-6f5p5t4qkt],
.productos-toolbar.scrolled .view-buttons-container[b-6f5p5t4qkt] {
    display: none;
}

/* Ocultar separadores en modo sticky */
.productos-toolbar.scrolled .toolbar-separator[b-6f5p5t4qkt] {
    display: none;
}

/* Ajustar layout en modo sticky */
.productos-toolbar.scrolled .toolbar-left[b-6f5p5t4qkt] {
    gap: 30px; /* Mantener el mismo gap que en estado normal */
}

.productos-toolbar.scrolled .toolbar-right[b-6f5p5t4qkt] {
    margin-left: auto;
}

/* Botón SUBIR - oculto por defecto */
.btn-scroll-top[b-6f5p5t4qkt] {
    display: none;
    background: transparent;
    border: none;
    color: #FFFFFF;
    padding: 0;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0.15px;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    transition: all 0.2s ease;
}

/* Mostrar botón SUBIR solo en modo sticky */
.productos-toolbar.scrolled .btn-scroll-top[b-6f5p5t4qkt] {
    display: flex;
}

.btn-scroll-top:hover[b-6f5p5t4qkt] {
    opacity: 0.8;
}

.btn-scroll-top span[b-6f5p5t4qkt] {
    font-weight: 600;
}

.btn-scroll-top i[b-6f5p5t4qkt] {
    font-size: 18px;
    transform: rotate(270deg); /* Rotar 270deg para que apunte hacia arriba */
    transition: transform 0.2s ease;
}

.btn-scroll-top:hover i[b-6f5p5t4qkt] {
    transform: rotate(270deg) translateY(-2px);
}

.toolbar-left[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 30px;
    flex-shrink: 0;
}

.toolbar-right[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-shrink: 0;
    margin-left: auto;
}

/* Separador vertical del toolbar */
.toolbar-separator[b-6f5p5t4qkt] {
    width: 1px;
    height: 19px;
    background-color: #E0E0E0;
    flex-shrink: 0;
    transform: rotate(90deg); /* Rotación como en Figma */
}

/* Título grande de la categoría */
.toolbar-title[b-6f5p5t4qkt] {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 36px;
    color: #000000;
    margin: 0;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Botones Categorías y Filtros */
.toolbar-left button[b-6f5p5t4qkt] {
    background: transparent;
    border: none;
    color: #121212;
    padding: 0;
    font-size: 16px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0.50px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.toolbar-left button:hover[b-6f5p5t4qkt] {
    opacity: 0.7;
}

.toolbar-left button i[b-6f5p5t4qkt] {
    font-size: 24px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Breadcrumb - estilo ligero según Figma */
.productos-breadcrumb[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 16px;
    font-weight: 300; /* Light como en Figma */
    line-height: 24px;
    letter-spacing: 0.5px;
    flex-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #121212;
}

.productos-breadcrumb a[b-6f5p5t4qkt] {
    color: #121212;
    text-decoration: none;
    transition: color 0.2s ease;
    font-weight: 300; /* Light */
}

.productos-breadcrumb a:hover[b-6f5p5t4qkt] {
    color: #4CAF50;
}

.productos-breadcrumb .separator[b-6f5p5t4qkt] {
    color: #121212;
    margin: 0 4px;
    font-weight: 300;
}

.productos-breadcrumb .active[b-6f5p5t4qkt] {
    color: #121212;
    font-weight: 300; /* Light también para el activo */
}

/* Vista label y botones */
.vista-label[b-6f5p5t4qkt] {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0.5px;
    color: #121212;
}

/* Contenedor de botones de vista */
.view-buttons-container[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 0;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    overflow: hidden;
    background: white;
}

.view-btn[b-6f5p5t4qkt] {
    background: white;
    border: none;
    border-right: 1px solid #E0E0E0;
    color: #666;
    padding: 0;
    width: 46px;
    height: 40px;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.view-btn:last-child[b-6f5p5t4qkt] {
    border-right: none;
}

.view-btn:hover[b-6f5p5t4qkt] {
    background-color: #F5F5F5;
    color: #333;
}

.view-btn.active[b-6f5p5t4qkt] {
    background-color: #F5F5F5;
    color: #121212;
}

/* =================================
   ESTADOS DE CARGA Y ERROR
   ================================= */

.productos-loading[b-6f5p5t4qkt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    gap: 20px;
}

.loading-spinner[b-6f5p5t4qkt] {
    width: 50px;
    height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #4CAF50;
    border-radius: 50%;
    animation: spin-b-6f5p5t4qkt 1s linear infinite;
}

@keyframes spin-b-6f5p5t4qkt {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.productos-loading p[b-6f5p5t4qkt] {
    color: #666;
    font-size: 16px;
    margin: 0;
}

.productos-error[b-6f5p5t4qkt] {
    background: #fee;
    border: 1px solid #fcc;
    border-radius: 8px;
    padding: 20px;
    margin: 20px 0;
}

.productos-error h4[b-6f5p5t4qkt] {
    color: #c00;
    margin: 0 0 10px 0;
    font-size: 18px;
}

.productos-error p[b-6f5p5t4qkt] {
    color: #800;
    margin: 0;
}

.no-products-message[b-6f5p5t4qkt] {
    background: #e8f4fd;
    border: 1px solid #bee5eb;
    border-radius: 8px;
    padding: 20px;
    margin: 20px 0;
    text-align: center;
}

.no-products-message p[b-6f5p5t4qkt] {
    color: #0c5460;
    margin: 0;
}

.category-info-message[b-6f5p5t4qkt] {
    background: #e8f4fd;
    border: 1px solid #bee5eb;
    border-radius: 8px;
    padding: 12px 16px;
    margin: 10px 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.category-info-message i[b-6f5p5t4qkt] {
    color: #0c5460;
    font-size: 18px;
}

.category-info-message span[b-6f5p5t4qkt] {
    color: #0c5460;
    font-size: 14px;
}

/* Indicador de carga para scroll infinito */
.load-more-container[b-6f5p5t4qkt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 40px 0;
    gap: 10px;
}

.loading-indicator[b-6f5p5t4qkt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 20px;
}

.loading-indicator .spinner[b-6f5p5t4qkt] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3CAA36;
    border-radius: 50%;
    animation: spin-b-6f5p5t4qkt 1s linear infinite;
}

@keyframes spin-b-6f5p5t4qkt {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-indicator p[b-6f5p5t4qkt] {
    color: #666;
    font-size: 14px;
    font-weight: 400;
    margin: 0;
    font-family: 'Nunito Sans', sans-serif;
    text-align: center;
}

/* Elemento sentinel invisible para scroll infinito */
#scroll-sentinel[b-6f5p5t4qkt] {
    height: 1px;
    width: 100%;
    margin: 0;
    padding: 0;
    opacity: 0;
    pointer-events: none;
}

/* =================================
   ESTILOS PARA FILTRO DE CATEGORÍAS SIMPLE
   ================================= */

/* Grid de productos existente */
.product-grid[b-6f5p5t4qkt] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 55px 10px; /* 55px vertical entre filas, 10px horizontal entre columnas */
    margin: 0;
    width: 100%;
    box-sizing: border-box;
    padding: 0 115px;
}

.product-grid.images-only-grid[b-6f5p5t4qkt] {
    grid-template-columns: repeat(8, 1fr);
}

.product-grid.images-only-grid .product-item:nth-child(5n)[b-6f5p5t4qkt] {
    border-right: 1px solid #ddd;
}

.product-grid.images-only-grid .product-item:nth-child(8n)[b-6f5p5t4qkt] {
    border-right: none;
}

.product-item[b-6f5p5t4qkt] {
    border-left: 1px solid #ddd; /* Cada producto tiene su línea a la izquierda */
    box-sizing: border-box;
    min-width: 0;
    position: relative; /* Necesario para el pseudo-elemento */
    transition: border-left 0.2s ease; /* Transición suave para el hover */
}

.product-item:hover[b-6f5p5t4qkt] {
    border-left: 1px solid transparent; /* Ocultamos el borde original */
}

/* Línea verde con puntas redondeadas en hover */
.product-item:hover[b-6f5p5t4qkt]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background-color: #3CAA36;
    border-radius: 0 2px 2px 0; /* Puntas redondeadas solo en el lado derecho */
    transition: all 0.2s ease;
}

/* El último producto de cada fila NO tiene borde derecho (ya no lo necesitamos) */

.product[b-6f5p5t4qkt] {
    padding: 0; /* Sin padding, el contenido usa padding interno */
    background: #fff;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
}

.product-image[b-6f5p5t4qkt] {
    width: 100%;
    height: 300px; /* Altura fija de 300px como en Figma */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden; /* Evita que la imagen sobresalga */
    margin-bottom: 8px; /* Gap de 8px entre imagen y contenido */
    position: relative; /* Necesario para posicionar las etiquetas */
    background: transparent; /* Sin fondo */
}

    .product-image img[b-6f5p5t4qkt] {
        max-height: 100%;
        max-width: 100%;
        object-fit: contain;
        transition: opacity 0.2s ease-in-out;
        display: block;
        margin: 0 auto;
        padding: 20px; /* Espacio interno */
        opacity: 1;
        border-radius: 14px; /* Border radius en la imagen */
    }

.product-image img[src=""][b-6f5p5t4qkt] {
    opacity: 0;
}

/* =================================
   ETIQUETAS DE PRODUCTO
   ================================= */

/* Contenedor de badges izquierdo */
.product-badges-left[b-6f5p5t4qkt] {
    position: absolute;
    top: 20px;
    left: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    z-index: 10;
}

/* Badge base */
.badge[b-6f5p5t4qkt] {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border-radius: 2px;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
}

.badge span[b-6f5p5t4qkt] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 10px;
    line-height: normal;
    color: #141414;
    text-align: center;
    letter-spacing: 0;
}

/* Badge de reembolso (amarillo) */
.badge-reembolso[b-6f5p5t4qkt] {
    background-color: #FDD623;
}

/* Badge nuevo (blanco) */
.badge-nuevo[b-6f5p5t4qkt] {
    background-color: #FFFFFF;
}

/* Badge de stock (esquina superior derecha) */
.badge-stock[b-6f5p5t4qkt] {
    position: absolute;
    top: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 2px 7px;
    background-color: #EBF6EB; /* Verde claro */
    border-radius: 2px;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
    z-index: 10;
}

.badge-stock i[b-6f5p5t4qkt] {
    font-size: 9px;
    color: #3CAA36;
}

.badge-stock span[b-6f5p5t4qkt] {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 10px;
    line-height: normal;
    color: #000000;
    text-align: center;
}

/* Contenedor principal del contenido (colores, título, precio, botón) */
.product-content[b-6f5p5t4qkt] {
    width: 100%;
    padding: 0 20px; /* Padding horizontal de 20px como en Figma */
    display: flex;
    justify-content: space-between;
    align-items: flex-end; /* Alinear por la base */
    gap: 8px;
}

/* Contenedor izquierdo (colores, título, precio) */
.product-info[b-6f5p5t4qkt] {
    display: flex;
    flex-direction: column;
    gap: 6px; /* Gap de 6px entre cada elemento */
    flex: 1;
}

.product-colors[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.color-dot[b-6f5p5t4qkt] {
    width: 23px;
    height: 23px;
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Círculo externo (siempre transparente) */
.color-dot[b-6f5p5t4qkt]::before {
    content: '';
    width: 23px;
    height: 23px;
    border-radius: 50%;
    position: absolute;
    border: 1px solid transparent;
    background: transparent;
}

/* Círculo interno con color */
.color-dot[b-6f5p5t4qkt]::after {
    content: '';
    width: 15px;
    height: 15px;
    border-radius: 50%;
    position: relative;
    z-index: 1;
}

/* Colores específicos */
.color-dot.color-black[b-6f5p5t4qkt]::after {
    background: #000000;
}

.color-dot.color-white[b-6f5p5t4qkt]::after {
    background: #FFFFFF;
    border: 1px solid #E0E0E0; /* Borde para color blanco */
}

.color-dot.color-yellow[b-6f5p5t4qkt]::after {
    background: #FDD623;
}

.color-dot.color-blue[b-6f5p5t4qkt]::after {
    background: #0066CC;
}

/* Estado seleccionado - círculo externo más grande */
.color-dot.selected[b-6f5p5t4qkt]::before {
    border: 4px solid rgba(0, 0, 0, 0.2);
}

.product-colors small[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 700;
    color: #141718;
    margin-left: 2px;
}

/* Título del producto */
.product-title-link[b-6f5p5t4qkt] {
    text-decoration: none;
    color: inherit;
}

.product-title[b-6f5p5t4qkt] {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    color: #141718;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    transition: color 0.2s ease;
}

.product-title-link:hover .product-title[b-6f5p5t4qkt] {
    color: #3CAA36;
}

.price-cart-row[b-6f5p5t4qkt] {
    /* Esta clase ya no se usa, ahora usamos .product-content */
}

.product-price[b-6f5p5t4qkt] {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: 12px; /* Gap de 12px como en Figma */
}

/* Precio actual */
.current-price[b-6f5p5t4qkt] {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: normal;
    color: #121212;
}

/* Precio en oferta (rojo) */
.current-price.price-offer[b-6f5p5t4qkt] {
    color: #DE3730;
}

/* Precio original tachado */
.original-price[b-6f5p5t4qkt] {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    color: #9E9E9E;
    text-decoration: line-through;
    text-decoration-skip-ink: none;
    text-underline-position: from-font;
}

.btn-cart[b-6f5p5t4qkt] {
    width: 65px;
    height: 65px;
    border-radius: 6px;
    background-color: #FFFFFF;
    border: 1px solid #3CAA36;
    color: #3CAA36;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
    position: relative;
}

.btn-cart:hover[b-6f5p5t4qkt] {
    background-color: #3CAA36;
    color: #FFFFFF;
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(60, 170, 54, 0.3);
}

.btn-cart:active[b-6f5p5t4qkt] {
    transform: scale(0.98);
}

.btn-cart i[b-6f5p5t4qkt] {
    font-size: 24px;
    width: 23.411px;
    height: 24.001px;
}

/* =================================
   PANEL LATERAL SIMPLE
   ================================= */
.custom-offcanvas[b-6f5p5t4qkt] {
    position: fixed !important;
    top: 0 !important;
    left: -350px !important;
    width: 350px !important;
    height: 100vh !important;
    background-color: white !important;
    transition: left 0.3s ease !important;
    z-index: 9999 !important;
    overflow-y: auto !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
    display: block !important;
    border-right: 1px solid #e0e0e0 !important;
    border-radius:0px 15px 15px 0px;
    overscroll-behavior: contain; /* Evita que el scroll se propague al fondo */
}

.custom-offcanvas.open[b-6f5p5t4qkt] {
    left: 0 !important;
}

.custom-offcanvas-header[b-6f5p5t4qkt] {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 16px 20px !important;
    background-color: white !important;
}

.custom-offcanvas-header h5[b-6f5p5t4qkt] {
    margin: 0 !important;
    font-size: 48px !important;
    font-weight: 500 !important;
    color: #333 !important;
}

.custom-offcanvas-body[b-6f5p5t4qkt] {
    padding: 20px 20px 20px 20px !important;
    overscroll-behavior: contain; /* Evita que el scroll se propague al fondo */
}

.close-btn[b-6f5p5t4qkt] {
    background: none !important;
    border: none !important;
    font-size: 24px !important;
    cursor: pointer !important;
    color: #666 !important;
    padding: 0 !important;
    width: 30px !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.close-btn:hover[b-6f5p5t4qkt] {
    color: #333 !important;
}

.offcanvas-overlay[b-6f5p5t4qkt] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 9998;
    display: block;
}

/* =================================
   BOTÓN VOLVER SIMPLE
   ================================= */
.btn-back-category[b-6f5p5t4qkt] {
    background: none !important;
    color: #4CAF50 !important;
    border: none !important;
    padding: 8px 0 !important;
    font-size: 14px !important;
    font-weight: normal !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-bottom: 16px !important;
    cursor: pointer !important;
    transition: color 0.2s ease !important;
    border-bottom: 1px solid #f0f0f0 !important;
    padding-bottom: 16px !important;
}

.btn-back-category:hover[b-6f5p5t4qkt] {
    color: #3e8e41 !important;
    text-decoration: underline !important;
}

.btn-back-category i[b-6f5p5t4qkt] {
    font-size: 14px !important;
}

/* =================================
   LISTA DE CATEGORÍAS SIMPLE
   ================================= */
.category-list[b-6f5p5t4qkt] {
    list-style-type: none !important;
    padding: 0 !important;
    margin: 8px 0 0 0 !important;
}

.category-list li[b-6f5p5t4qkt] {
    margin-bottom: 0 !important;
    border-bottom: 1px solid #f0f0f0 !important;
}

.category-list li:last-child[b-6f5p5t4qkt] {
    border-bottom: none !important;
}

.category-simple-item[b-6f5p5t4qkt] {
    padding: 12px 16px !important;
    cursor: pointer !important;
    color: #333 !important;
    font-size: 16px !important;
    transition: all 0.2s ease !important;
    border-radius: 0 !important;
}

.category-simple-item:hover[b-6f5p5t4qkt] {
    background-color: #f8f9fa !important;
    color: #4CAF50 !important;
}

.category-simple-item:active[b-6f5p5t4qkt] {
    background-color: #e9ecef !important;
}

/* =================================
   BOTÓN CATEGORÍAS PRINCIPAL SIMPLEF
   ================================= */
#categoryToggleBtn[b-6f5p5t4qkt] {
    background: transparent !important;
    border: none !important;
    color: #121212 !important;
    padding: 0 !important;
    font-size: 16px !important;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    letter-spacing: 0.50px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    transition: all 0.2s ease !important;
}

#categoryToggleBtn:hover[b-6f5p5t4qkt] {
    opacity: 0.7 !important;
}

#categoryToggleBtn i[b-6f5p5t4qkt] {
    font-size: 24px !important;
    width: 24px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* =================================
   PANEL LATERAL DE FILTROS INDEPENDIENTE
   ================================= */
.custom-filter-offcanvas[b-6f5p5t4qkt] {
    position: fixed !important;
    top: 0 !important;
    left: -350px !important;
    width: 350px !important;
    height: 100vh !important;
    background-color: white !important;
    transition: left 0.3s ease !important;
    z-index: 9999 !important;
    overflow-y: auto !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
    display: block !important;
    border-right: 1px solid #e0e0e0 !important;
    border-radius: 0px 15px 15px 0px;
    overscroll-behavior: contain; /* Evita que el scroll se propague al fondo */
}

.custom-filter-offcanvas.open[b-6f5p5t4qkt] {
    left: 0 !important;
}

/* Botón Filtros con el mismo estilo que Categorías */
#filterToggleBtn[b-6f5p5t4qkt] {
    background: transparent !important;
    border: none !important;
    color: #121212 !important;
    padding: 0 !important;
    font-size: 16px !important;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    letter-spacing: 0.50px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    transition: all 0.2s ease !important;
}

#filterToggleBtn:hover[b-6f5p5t4qkt] {
    opacity: 0.7 !important;
}

#filterToggleBtn i[b-6f5p5t4qkt] {
    font-size: 24px !important;
    width: 24px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.offcanvas-overlay[b-6f5p5t4qkt] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 9998;
    display: block;
    opacity: 1;
}

/* =================================
   RESPONSIVE DESIGN
   ================================= */

/* Pantallas 4K */
@media screen and (min-width: 3840px) {
    .productos-page-container[b-6f5p5t4qkt] {
        margin: 0 calc(10% + 106px);
    }
    
    .product-grid[b-6f5p5t4qkt] {
        gap: 40px 20px;
    }
    
    .product-image[b-6f5p5t4qkt] {
        height: 400px;
    }
    
    .product-badges-left[b-6f5p5t4qkt],
    .badge-stock[b-6f5p5t4qkt] {
        top: 25px;
    }
    
    .product-badges-left[b-6f5p5t4qkt] {
        left: 25px;
        gap: 10px;
    }
    
    .badge-stock[b-6f5p5t4qkt] {
        right: 25px;
    }
    
    .badge[b-6f5p5t4qkt],
    .badge-stock[b-6f5p5t4qkt] {
        padding: 3px 10px;
    }
    
    .badge span[b-6f5p5t4qkt],
    .badge-stock span[b-6f5p5t4qkt] {
        font-size: 12px;
    }
    
    .product-title[b-6f5p5t4qkt] {
        font-size: 18px;
        height: 24px;
    }
    
    .current-price[b-6f5p5t4qkt] {
        font-size: 26px;
    }
    
    .btn-cart[b-6f5p5t4qkt] {
        width: 60px;
        height: 60px;
    }
    
    .btn-cart i[b-6f5p5t4qkt] {
        font-size: 28px;
    }
}

/* Tablets y pantallas medianas */
@media (max-width: 1200px) {
    .productos-page-container[b-6f5p5t4qkt] {
        margin: 0 25px;
    }
    
    .productos-toolbar[b-6f5p5t4qkt] {
        padding-left: 25px;
        padding-right: 25px;
        gap: 15px;
    }
    
    .toolbar-left[b-6f5p5t4qkt] {
        gap: 20px;
    }
    
    .toolbar-title[b-6f5p5t4qkt] {
        font-size: 24px;
        line-height: 32px;
    }
    
    .toolbar-right[b-6f5p5t4qkt] {
        gap: 15px;
    }
    
    .productos-breadcrumb[b-6f5p5t4qkt] {
        font-size: 14px;
    }
    
    .productos-count-discrete[b-6f5p5t4qkt] {
        padding: 8px 25px;
    }
    
    /* Reducir gap en modo sticky para tablets */
    .productos-toolbar.scrolled .toolbar-left[b-6f5p5t4qkt] {
        gap: 60px;
    }
    
    .btn-scroll-top[b-6f5p5t4qkt] {
        font-size: 14px;
    }
    
    .btn-scroll-top i[b-6f5p5t4qkt] {
        font-size: 16px;
    }
    
    .product-grid[b-6f5p5t4qkt] {
        grid-template-columns: repeat(4, 1fr); /* 4 columnas en tablets */
        gap: 25px 12px;
        padding: 0 25px;
    }
    
    .product-image[b-6f5p5t4qkt] {
        height: 240px;
    }
    
    .product-badges-left[b-6f5p5t4qkt],
    .badge-stock[b-6f5p5t4qkt] {
        top: 15px;
    }
    
    .product-badges-left[b-6f5p5t4qkt] {
        left: 15px;
    }
    
    .badge-stock[b-6f5p5t4qkt] {
        right: 15px;
    }
}

/* Móviles */
@media (max-width: 768px) {
    .productos-page-container[b-6f5p5t4qkt] {
        margin: 0 15px;
    }
    
    .productos-toolbar[b-6f5p5t4qkt] {
        flex-direction: column;
        align-items: stretch;
        gap: 15px;
        padding-left: 15px;
        padding-right: 15px;
    }
    
    /* En modo sticky en móvil, volver a layout horizontal */
    .productos-toolbar.scrolled[b-6f5p5t4qkt] {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    
    .toolbar-left[b-6f5p5t4qkt],
    .toolbar-right[b-6f5p5t4qkt] {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }
    
    /* En modo sticky, ajustar el ancho */
    .productos-toolbar.scrolled .toolbar-left[b-6f5p5t4qkt],
    .productos-toolbar.scrolled .toolbar-right[b-6f5p5t4qkt] {
        width: auto;
    }
    
    .toolbar-left[b-6f5p5t4qkt] {
        gap: 15px;
    }
    
    /* Reducir gap en modo sticky para móvil */
    .productos-toolbar.scrolled .toolbar-left[b-6f5p5t4qkt] {
        gap: 20px;
    }
    
    .toolbar-title[b-6f5p5t4qkt] {
        font-size: 20px;
        line-height: 28px;
        width: 100%;
    }
    
    .toolbar-separator[b-6f5p5t4qkt] {
        display: none; /* Ocultar separadores en móvil */
    }
    
    .toolbar-right[b-6f5p5t4qkt] {
        justify-content: space-between;
        gap: 10px;
    }
    
    .btn-scroll-top[b-6f5p5t4qkt] {
        font-size: 13px;
    }
    
    .btn-scroll-top i[b-6f5p5t4qkt] {
        font-size: 14px;
    }
    
    .productos-breadcrumb[b-6f5p5t4qkt] {
        font-size: 12px;
        flex: 1;
        min-width: 0;
    }
    
    .vista-label[b-6f5p5t4qkt] {
        font-size: 14px;
    }
    
    .view-buttons-container[b-6f5p5t4qkt] {
        flex-shrink: 0;
    }
    
    .view-btn[b-6f5p5t4qkt] {
        width: 40px;
        height: 36px;
        font-size: 18px;
    }
    
    .productos-count-discrete[b-6f5p5t4qkt] {
        padding: 8px 15px;
    }
    
    .product-grid[b-6f5p5t4qkt] {
        grid-template-columns: repeat(2, 1fr); /* 2 columnas en móvil */
        gap: 20px 10px;
        padding: 0 15px;
    }
    
    .product-image[b-6f5p5t4qkt] {
        height: 180px;
    }
    
    .product-badges-left[b-6f5p5t4qkt],
    .badge-stock[b-6f5p5t4qkt] {
        top: 10px;
    }
    
    .product-badges-left[b-6f5p5t4qkt] {
        left: 10px;
    }
    
    .badge-stock[b-6f5p5t4qkt] {
        right: 10px;
    }
    
    .badge span[b-6f5p5t4qkt],
    .badge-stock span[b-6f5p5t4qkt] {
        font-size: 9px;
    }
    
    .product-title[b-6f5p5t4qkt] {
        font-size: 13px;
    }
    
    .current-price[b-6f5p5t4qkt] {
        font-size: 16px;
    }
    
    .btn-cart[b-6f5p5t4qkt] {
        width: 40px;
        height: 40px;
    }
    
    .btn-cart i[b-6f5p5t4qkt] {
        font-size: 18px;
    }
    
    .custom-offcanvas[b-6f5p5t4qkt] {
        width: 280px !important;
        left: -280px !important;
    }
    
    .custom-filter-offcanvas[b-6f5p5t4qkt] {
        width: 280px !important;
        left: -280px !important;
    }
    
    .custom-offcanvas-body[b-6f5p5t4qkt] {
        padding: 16px !important;
    }
}

@media (max-width: 480px) {
    .productos-page-container[b-6f5p5t4qkt] {
        margin: 0 10px;
    }
    
    .product-grid[b-6f5p5t4qkt] {
        gap: 15px 8px;
    }
    
    .product-image[b-6f5p5t4qkt] {
        height: 150px;
    }
    
    .product-badges-left[b-6f5p5t4qkt],
    .badge-stock[b-6f5p5t4qkt] {
        top: 8px;
    }
    
    .product-badges-left[b-6f5p5t4qkt] {
        left: 8px;
    }
    
    .badge-stock[b-6f5p5t4qkt] {
        right: 8px;
    }
    
    .badge[b-6f5p5t4qkt],
    .badge-stock[b-6f5p5t4qkt] {
        padding: 1px 5px;
    }
    
    .badge span[b-6f5p5t4qkt],
    .badge-stock span[b-6f5p5t4qkt] {
        font-size: 8px;
    }
    
    .custom-offcanvas[b-6f5p5t4qkt] {
        width: 260px !important;
        left: -260px !important;
    }
    
    .custom-filter-offcanvas[b-6f5p5t4qkt] {
        width: 260px !important;
        left: -260px !important;
    }
    
    .custom-offcanvas-header[b-6f5p5t4qkt] {
        padding: 12px 16px !important;
    }
    
    .custom-offcanvas-body[b-6f5p5t4qkt] {
        padding: 12px !important;
    }
}

/* =================================
   ESTILOS PARA FILTROS DE PRODUCTOS
   ================================= */

/* Sección general de filtros */
.filters-section[b-6f5p5t4qkt] {
    margin-top: 20px;
}

/* =================================
   DESPLEGABLE DE ORDENAR POR
   ================================= */

.sort-filter[b-6f5p5t4qkt] {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin-bottom: 16px !important;
}

.sort-filter .filter-header[b-6f5p5t4qkt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 12px 0;
    border-bottom: 1px solid #e0e0e0;
    background: transparent;
}

.sort-filter .filter-header:hover[b-6f5p5t4qkt] {
    background: transparent;
}

.sort-label[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 700;
    color: #333;
    font-family: 'Nunito Sans', sans-serif;
}

.sort-current[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 400;
    color: #999;
    margin-left: 4px;
    font-family: 'Nunito Sans', sans-serif;
}

.sort-filter .filter-header i[b-6f5p5t4qkt] {
    font-size: 18px;
    color: #333;
}

.sort-options[b-6f5p5t4qkt] {
    padding: 12px 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sort-option[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    cursor: pointer;
    transition: all 0.2s ease;
}

.sort-option:hover[b-6f5p5t4qkt] {
    background-color: rgba(76, 175, 80, 0.05);
    border-radius: 4px;
    margin: 0 -8px;
    padding: 8px 8px;
}

.sort-option input[type="checkbox"][b-6f5p5t4qkt] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #4CAF50;
    pointer-events: none; /* El click se maneja en el contenedor */
}

.sort-option label[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 400;
    color: #333;
    cursor: pointer;
    margin: 0;
    flex: 1;
    font-family: 'Nunito Sans', sans-serif;
    pointer-events: none; /* El click se maneja en el contenedor */
}

/* Botón limpiar filtros */
.clear-filters-btn[b-6f5p5t4qkt] {
    width: 100%;
    background: transparent;
    border: none;
    border-top: 1px solid #e0e0e0;
    color: #dc3545;
    padding: 16px 0;
    font-size: 14px;
    font-weight: 600;
    font-family: 'Nunito Sans', sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
    margin-top: 8px;
}

.clear-filters-btn:hover[b-6f5p5t4qkt] {
    color: #c82333;
    background-color: rgba(220, 53, 69, 0.05);
}

/* Botón Aplicar Filtros */
.apply-filters-btn[b-6f5p5t4qkt] {
    width: 100%;
    background: #4CAF50;
    border: none;
    color: white;
    padding: 14px 0;
    font-size: 15px;
    font-weight: 700;
    font-family: 'Nunito Sans', sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
    margin-top: 16px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 2px 4px rgba(76, 175, 80, 0.2);
}

.apply-filters-btn:hover:not(:disabled)[b-6f5p5t4qkt] {
    background: #45a049;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(76, 175, 80, 0.3);
}

.apply-filters-btn:active[b-6f5p5t4qkt] {
    transform: translateY(0);
}

.apply-filters-btn:disabled[b-6f5p5t4qkt] {
    opacity: 0.7;
    cursor: not-allowed;
}

.apply-filters-btn i[b-6f5p5t4qkt] {
    font-size: 16px;
}

/* Spinner pequeño para el botón */
.spinner-small[b-6f5p5t4qkt] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-6f5p5t4qkt 0.8s linear infinite;
}

/* Mensaje de carga de filtros */
.filters-loading[b-6f5p5t4qkt] {
    min-height: 400px;
}

/* Elementos individuales de filtro */
.filter-item[b-6f5p5t4qkt] {
    background: transparent;
    border: none;
    padding: 0;
    margin-bottom: 0;
}

/* Filtros rápidos con checkboxes */
.quick-filters[b-6f5p5t4qkt] {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 12px 0;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 16px;
}

.filter-checkbox-option[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    cursor: pointer;
    transition: all 0.2s ease;
}

.filter-checkbox-option:hover[b-6f5p5t4qkt] {
    background-color: rgba(76, 175, 80, 0.05);
    border-radius: 4px;
    margin: 0 -8px;
    padding: 8px 8px;
}

.filter-checkbox-option input[type="checkbox"][b-6f5p5t4qkt] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #4CAF50;
    pointer-events: none;
}

.filter-checkbox-option label[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 400;
    color: #333;
    cursor: pointer;
    margin: 0;
    flex: 1;
    font-family: 'Nunito Sans', sans-serif;
    pointer-events: none;
}

/* Filtros desplegables (precio y marcas) */
.price-filter[b-6f5p5t4qkt],
.brands-filter[b-6f5p5t4qkt] {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin-bottom: 16px !important;
}

.price-filter .filter-header[b-6f5p5t4qkt],
.brands-filter .filter-header[b-6f5p5t4qkt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 12px 0;
    border-bottom: 1px solid #e0e0e0;
    background: transparent;
}

.price-filter .filter-header:hover[b-6f5p5t4qkt],
.brands-filter .filter-header:hover[b-6f5p5t4qkt] {
    background: transparent;
}

.price-filter .filter-header i[b-6f5p5t4qkt],
.brands-filter .filter-header i[b-6f5p5t4qkt] {
    font-size: 18px;
    color: #333;
}

.filter-content[b-6f5p5t4qkt] {
    padding: 12px 0;
}

.price-inputs[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.price-input[b-6f5p5t4qkt] {
    flex: 1;
    min-width: 0;
    padding: 8px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 14px;
    font-family: 'Nunito Sans', sans-serif;
    transition: all 0.2s ease;
}

.price-input:focus[b-6f5p5t4qkt] {
    outline: none;
    border-color: #4CAF50;
    box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.1);
}

.price-separator[b-6f5p5t4qkt] {
    font-weight: 500;
    color: #999;
    flex-shrink: 0;
}

/* Buscador de marcas */
.brand-search-input[b-6f5p5t4qkt] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 14px;
    font-family: 'Nunito Sans', sans-serif;
    margin-bottom: 12px;
    transition: all 0.2s ease;
}

.brand-search-input:focus[b-6f5p5t4qkt] {
    outline: none;
    border-color: #4CAF50;
    box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.1);
}

.brand-search-input[b-6f5p5t4qkt]::placeholder {
    color: #999;
}

.brands-list[b-6f5p5t4qkt] {
    max-height: 250px;
    overflow-y: auto;
    padding-right: 4px;
    overscroll-behavior: contain; /* Evita que el scroll se propague */
}

.brand-checkbox-item[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    cursor: pointer;
    transition: all 0.2s ease;
}

.brand-checkbox-item:hover[b-6f5p5t4qkt] {
    background-color: rgba(76, 175, 80, 0.05);
    border-radius: 4px;
    margin: 0 -8px;
    padding: 8px 8px;
}

.brand-checkbox-item input[type="checkbox"][b-6f5p5t4qkt] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #4CAF50;
    pointer-events: none;
}

.brand-checkbox-item label[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 400;
    color: #333;
    cursor: pointer;
    margin: 0;
    flex: 1;
    font-family: 'Nunito Sans', sans-serif;
    pointer-events: none;
}

.more-items-text[b-6f5p5t4qkt] {
    color: #999;
    font-size: 12px;
    font-weight: 400;
    margin-top: 8px;
    display: block;
    font-family: 'Nunito Sans', sans-serif;
}

/* Scrollbar personalizada para lista de marcas */
.brands-list[b-6f5p5t4qkt]::-webkit-scrollbar {
    width: 4px;
}

.brands-list[b-6f5p5t4qkt]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 2px;
}

.brands-list[b-6f5p5t4qkt]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 2px;
}

.brands-list[b-6f5p5t4qkt]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Responsive para filtros */
@media (max-width: 768px) {
    .productos-toolbar[b-6f5p5t4qkt] {
        padding-left: 15px;
        padding-right: 15px;
        margin-left: 0;
        margin-right: 0;
    }
    
    .sort-label[b-6f5p5t4qkt] {
        font-size: 13px;
    }
    
    .sort-current[b-6f5p5t4qkt] {
        font-size: 13px;
    }
    
    .sort-option[b-6f5p5t4qkt],
    .filter-checkbox-option[b-6f5p5t4qkt],
    .brand-checkbox-item[b-6f5p5t4qkt] {
        padding: 6px 0;
    }
    
    .brands-list[b-6f5p5t4qkt] {
        max-height: 180px;
    }
    
    .price-inputs[b-6f5p5t4qkt] {
        gap: 8px;
    }
    
    .price-input[b-6f5p5t4qkt] {
        font-size: 13px;
        padding: 6px 10px;
    }
    
    .brand-search-input[b-6f5p5t4qkt] {
        font-size: 13px;
        padding: 6px 10px;
    }
    
    .clear-filters-btn[b-6f5p5t4qkt] {
        padding: 14px 0;
        font-size: 13px;
    }
}

/* =================================
   ESTILOS PARA FILTROS DE ESPECIFICACIONES
   ================================= */

.specs-filter[b-6f5p5t4qkt] {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin-bottom: 16px !important;
}

.specs-filter .filter-header[b-6f5p5t4qkt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 12px 0;
    border-bottom: 1px solid #e0e0e0;
    background: transparent;
}

.specs-filter .filter-header:hover[b-6f5p5t4qkt] {
    background: transparent;
}

.specs-filter .filter-header i[b-6f5p5t4qkt] {
    font-size: 18px;
    color: #333;
}

.specs-content[b-6f5p5t4qkt] {
    padding: 0;
}

.spec-item[b-6f5p5t4qkt] {
    background: transparent;
    border: none;
    padding: 0;
    margin-bottom: 0;
}

.spec-header[b-6f5p5t4qkt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 12px 0;
    border-bottom: 1px solid #e0e0e0;
    background: transparent;
    transition: all 0.2s ease;
}

.spec-header:hover[b-6f5p5t4qkt] {
    background: transparent;
}

.spec-label[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    font-family: 'Nunito Sans', sans-serif;
}

.spec-count[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 400;
    color: #999;
    margin-left: 4px;
    font-family: 'Nunito Sans', sans-serif;
}

.spec-header i[b-6f5p5t4qkt] {
    font-size: 18px;
    color: #333;
}

.spec-values[b-6f5p5t4qkt] {
    padding: 12px 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.spec-checkbox-item[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    cursor: pointer;
    transition: all 0.2s ease;
}

.spec-checkbox-item:hover[b-6f5p5t4qkt] {
    background-color: rgba(76, 175, 80, 0.05);
    border-radius: 4px;
    margin: 0 -8px;
    padding: 8px 8px;
}

.spec-checkbox-item input[type="checkbox"][b-6f5p5t4qkt] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #4CAF50;
    pointer-events: none;
}

.spec-checkbox-item label[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 400;
    color: #333;
    cursor: pointer;
    margin: 0;
    flex: 1;
    font-family: 'Nunito Sans', sans-serif;
    pointer-events: none;
}

/* =================================
   ESTILOS PARA RANGE SLIDER DE PRECIO
   ================================= */

.price-range-container[b-6f5p5t4qkt] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 8px 0;
}

.price-inputs[b-6f5p5t4qkt] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.price-input-group[b-6f5p5t4qkt] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.price-input-group label[b-6f5p5t4qkt] {
    font-size: 10px;
    font-weight: 600;
    color: #666;
    font-family: 'Nunito Sans', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.price-input[b-6f5p5t4qkt] {
    width: 100%;
    padding: 4px 8px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    color: #4CAF50;
    font-family: 'Nunito Sans', sans-serif;
    text-align: center;
    transition: all 0.2s ease;
}

.price-input:focus[b-6f5p5t4qkt] {
    outline: none;
    border-color: #4CAF50;
    box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.1);
}

.price-input[b-6f5p5t4qkt]::-webkit-inner-spin-button,
.price-input[b-6f5p5t4qkt]::-webkit-outer-spin-button {
    opacity: 1;
}

.price-separator[b-6f5p5t4qkt] {
    font-size: 14px;
    font-weight: 600;
    color: #999;
    margin-top: 10px;
}

.range-slider-wrapper[b-6f5p5t4qkt] {
    position: relative;
    width: 100%;
    height: 24px;
}

/* Estilos base para los sliders */
.range-slider[b-6f5p5t4qkt] {
    position: absolute;
    width: 100%;
    height: 4px;
    background: transparent;
    pointer-events: none;
    -webkit-appearance: none;
    appearance: none;
}

/* Track del slider */
.range-slider[b-6f5p5t4qkt]::-webkit-slider-runnable-track {
    width: 100%;
    height: 4px;
    background: linear-gradient(
        to right,
        #e0e0e0 0%,
        #4CAF50 0%,
        #4CAF50 100%,
        #e0e0e0 100%
    );
    border-radius: 2px;
}

/* Thumb del slider */
.range-slider[b-6f5p5t4qkt]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    background: #4CAF50;
    border: 3px solid white;
    border-radius: 50%;
    cursor: pointer;
    pointer-events: all;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    transition: all 0.2s ease;
    margin-top: -7px; /* Centrar verticalmente con el track */
}

/* Hover y active states */
.range-slider[b-6f5p5t4qkt]::-webkit-slider-thumb:hover {
    background: #45a049;
    transform: scale(1.15);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
}

.range-slider[b-6f5p5t4qkt]::-webkit-slider-thumb:active {
    background: #3d8b40;
    transform: scale(1.2);
}

/* Posicionamiento específico de cada slider */
.range-slider-min[b-6f5p5t4qkt] {
    z-index: 3;
}

.range-slider-max[b-6f5p5t4qkt] {
    z-index: 4;
}

/* Focus states para accesibilidad */
.range-slider:focus[b-6f5p5t4qkt] {
    outline: none;
}

.range-slider:focus[b-6f5p5t4qkt]::-webkit-slider-thumb {
    box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.2);
}

/* Responsive para range slider */
@media (max-width: 768px) {
    .price-labels[b-6f5p5t4qkt] {
        font-size: 13px;
    }
    
    .range-slider[b-6f5p5t4qkt]::-webkit-slider-thumb {
        width: 16px;
        height: 16px;
    }
}

/* =================================
   CONTADOR DISCRETO DE PRODUCTOS
   ================================= */
.productos-count-discrete[b-6f5p5t4qkt] {
    text-align: center;
    padding: 8px 115px; /* Mismo padding que el toolbar */
    margin-bottom: 20px;
}

.productos-count-discrete small[b-6f5p5t4qkt] {
    font-size: 13px;
    color: #666;
    font-weight: 400;
    font-family: 'Nunito Sans', sans-serif;
}
/* _content/PMCWEB/Components/Pages/SeguimientoPedido.razor.rz.scp.css */
.seguimiento-pedido[b-3afsou0zrb] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.seguimiento-pedido .frame[b-3afsou0zrb] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.seguimiento-pedido .titulo[b-3afsou0zrb] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.seguimiento-pedido h2[b-3afsou0zrb] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.seguimiento-pedido .iconos[b-3afsou0zrb] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.seguimiento-pedido .div[b-3afsou0zrb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.seguimiento-pedido .text-wrapper[b-3afsou0zrb] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.seguimiento-pedido .boton[b-3afsou0zrb] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.seguimiento-pedido .boton:hover[b-3afsou0zrb] {
    background-color: #80C87C;
}

.seguimiento-pedido .state-layer[b-3afsou0zrb] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.seguimiento-pedido .label-text[b-3afsou0zrb] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.seguimiento-pedido .frame-2[b-3afsou0zrb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 50px;
    padding: 75px;
    align-self: stretch;
    width: 100%;
    background-color: var(--grisgris-10);
    border-radius: 15px;
    position: relative;
    flex: 0 0 auto;
}

.seguimiento-pedido .frame-3[b-3afsou0zrb] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 15px;
    align-self: stretch;
}

.seguimiento-pedido .frame-4[b-3afsou0zrb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.seguimiento-pedido .text-wrapper-2[b-3afsou0zrb] {
    color: var(--negro);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    max-width: 200px;
    text-align: center;
}

.seguimiento-pedido .text-wrapper-2.realizado[b-3afsou0zrb] {
    font-weight: 700;
    color: var(--primario);
}

.seguimiento-pedido .text-wrapper-2.actual[b-3afsou0zrb] {
    font-weight: 700;
    color: var(--alternativo-oscuro);
}

.seguimiento-pedido .frame-4 .icon[b-3afsou0zrb] {
    display: flex;
    width: 150px;
    height: 40px;
    padding: 10px 6px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 5px;
    background: var(--alternativo);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.20);
}

.seguimiento-pedido .frame-4 .icon.realizado[b-3afsou0zrb] {
    background: var(--primario);
}

.seguimiento-pedido .frame-4 .icon img[b-3afsou0zrb] {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.seguimiento-pedido .frame-4 img[b-3afsou0zrb] {
    height: 1px;
}

.seguimiento-pedido .frame-5[b-3afsou0zrb] {
    display: flex;
    padding-top: 45px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
    flex: 1 0 0;
}

.seguimiento-pedido .frame-5 img[b-3afsou0zrb] {
    height: 5px;
    align-self: stretch;
    width: 100%;
}

.seguimiento-pedido .frame-6[b-3afsou0zrb] {
    align-items: flex-start;
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 20px;
    position: relative;
    width: 1328px;
}

.seguimiento-pedido .tabla-wrapper[b-3afsou0zrb] {
    padding: 15px;
    border-radius: 20px;
    width: 100%;
}

.seguimiento-pedido .tabla-container[b-3afsou0zrb] {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

.seguimiento-pedido .tabla-mejorada[b-3afsou0zrb] {
    width: 100%;
    border-collapse: separate;
    font-family: var(--body-large-font-family, sans-serif);
    font-size: 16px;
    padding: 0;
}

.seguimiento-pedido .tabla-mejorada tbody tr:not(:last-child) td[b-3afsou0zrb] {
    border-bottom: 1px solid #d3d3d3;
}

.seguimiento-pedido .tabla-mejorada thead[b-3afsou0zrb] {
    color: #000000;
    font-weight: bold;
    position: relative;
}

.seguimiento-pedido .tabla-mejorada thead[b-3afsou0zrb]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000;
}

.seguimiento-pedido .tabla-mejorada th[b-3afsou0zrb],
.seguimiento-pedido .tabla-mejorada td[b-3afsou0zrb] {
    padding: 10px;
    min-width: 140px;
    max-width: 140px;
    width: 140px;
    text-align: center;
}

.seguimiento-pedido .tabla-mejorada .th1[b-3afsou0zrb] {
    text-align: left;
    min-width: 500px;
    width: 100%;
}

.seguimiento-pedido .tabla-mejorada .th6[b-3afsou0zrb] {
    max-width: 250px;
    min-width: 250px;
    width: 250px;
}

.seguimiento-pedido .tabla-mejorada th .subheader[b-3afsou0zrb] {
    font-size: 0.8em; /* Ajusta el tamaño según lo necesites */
    color: #888888; /* Color gris */
}

.seguimiento-pedido .tabla-mejorada .td1[b-3afsou0zrb] {
    min-width: 500px;
    width: 100%;
}

.seguimiento-pedido .tabla-mejorada .td1 .td-content[b-3afsou0zrb] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
}

.seguimiento-pedido .tabla-mejorada .td1 img[b-3afsou0zrb] {
    height: 100px;
    width: 100px;
}

.seguimiento-pedido .tabla-mejorada .td1 .producto-info[b-3afsou0zrb] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
}

.seguimiento-pedido .tabla-mejorada .td1 .descripcion[b-3afsou0zrb] {
    color: var(--negro);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.seguimiento-pedido .tabla-mejorada .td1 .referencia[b-3afsou0zrb] {
    color: var(--negro);
    font-family: "Nunito Sans-Bold", Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}

.seguimiento-pedido .tabla-mejorada .td3[b-3afsou0zrb], .seguimiento-pedido .tabla-mejorada .td4[b-3afsou0zrb], .seguimiento-pedido .tabla-mejorada .td5[b-3afsou0zrb] {
    text-align: right;
}

.seguimiento-pedido .tabla-mejorada .td6[b-3afsou0zrb] {
    max-width: 250px;
    min-width: 250px;
    width: 250px;
}

.seguimiento-pedido .state-layer-wrapper[b-3afsou0zrb] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.seguimiento-pedido .state-layer-wrapper:hover[b-3afsou0zrb] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.seguimiento-pedido .state-layer-wrapper:hover .label-text-2[b-3afsou0zrb] {
    color: var(--blanco);
}

.seguimiento-pedido .label-text-2[b-3afsou0zrb] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.seguimiento-pedido .alert p[b-3afsou0zrb] {
    margin-bottom: 0;
}
/* _content/PMCWEB/Components/Pages/ServicioTecEquipos.razor.rz.scp.css */
.servicios-en-equipos[b-dy0cpam3ub] {
  display: flex;
  flex-direction: column;
  width: 1920px;
  align-items: center;
  gap: 75px;
  padding: 0px 115px 100px;
  position: relative;
  background-color: #ffffff;
}

.servicios-en-equipos .frame[b-dy0cpam3ub] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 30px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.servicios-en-equipos .titulo[b-dy0cpam3ub] {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 20px 0px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.servicios-en-equipos .CESTA[b-dy0cpam3ub] {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: "Nunito Sans-Bold", Helvetica;
  font-weight: 700;
  color: #000000;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.servicios-en-equipos .iconos[b-dy0cpam3ub] {
  position: absolute;
  width: 24px;
  height: 24px;
  top: 19px;
  left: 0;
}

.servicios-en-equipos .div-wrapper[b-dy0cpam3ub] {
  display: flex;
  align-items: center;
  gap: 30px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.servicios-en-equipos .text-wrapper[b-dy0cpam3ub] {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: var(--headline-large-font-family);
  font-weight: var(--headline-large-font-weight);
  color: #000000;
  font-size: var(--headline-large-font-size);
  letter-spacing: var(--headline-large-letter-spacing);
  line-height: var(--headline-large-line-height);
  white-space: nowrap;
  font-style: var(--headline-large-font-style);
}

.servicios-en-equipos .div[b-dy0cpam3ub] {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 75px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: var(--gris-10);
  border-radius: 15px;
}

.servicios-en-equipos .frame-wrapper[b-dy0cpam3ub] {
  display: flex;
  align-items: flex-start;
  gap: 1062px;
  padding: 0px 0px 20px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #000000;
}

.servicios-en-equipos .frame-2[b-dy0cpam3ub] {
  display: flex;
  width: 764px;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

.servicios-en-equipos .text-wrapper-2[b-dy0cpam3ub] {
  position: relative;
  width: 305px;
  margin-top: -1px;
  font-family: "Nunito Sans-Bold", Helvetica;
  font-weight: 700;
  color: #000000;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.servicios-en-equipos .text-wrapper-3[b-dy0cpam3ub] {
  position: relative;
  width: 180px;
  margin-top: -1px;
  font-family: "Nunito Sans-Bold", Helvetica;
  font-weight: 700;
  color: #000000;
  font-size: 16px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.servicios-en-equipos .text-wrapper-4[b-dy0cpam3ub] {
  position: relative;
  width: 278px;
  margin-top: -1px;
  font-family: "Nunito Sans-Bold", Helvetica;
  font-weight: 700;
  color: #000000;
  font-size: 16px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.servicios-en-equipos .frame-3[b-dy0cpam3ub] {
  display: flex;
  height: 128px;
  align-items: center;
  gap: 50px;
  position: relative;
  align-self: stretch;
  width: 100%;
  border-bottom-width: 1px;
  border-bottom-style: dashed;
  border-color: var(--gris-30);
}

.servicios-en-equipos .frame-4[b-dy0cpam3ub] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.servicios-en-equipos .frame-5[b-dy0cpam3ub] {
  display: inline-flex;
  align-items: center;
  gap: 30px;
  position: relative;
  flex: 0 0 auto;
}

.servicios-en-equipos .image[b-dy0cpam3ub] {
  position: relative;
  width: 100px;
  height: 100px;
  object-fit: cover;
}

.servicios-en-equipos .impresora-HP[b-dy0cpam3ub] {
  position: relative;
  width: fit-content;
  font-family: var(--body-large-font-family);
  font-weight: var(--body-large-font-weight);
  color: #000000;
  font-size: var(--body-large-font-size);
  letter-spacing: var(--body-large-letter-spacing);
  line-height: var(--body-large-line-height);
  font-style: var(--body-large-font-style);
}

.servicios-en-equipos .text-wrapper-5[b-dy0cpam3ub] {
  position: relative;
  width: fit-content;
  font-family: var(--body-large-font-family);
  font-weight: var(--body-large-font-weight);
  color: #000000;
  font-size: var(--body-large-font-size);
  text-align: center;
  letter-spacing: var(--body-large-letter-spacing);
  line-height: var(--body-large-line-height);
  white-space: nowrap;
  font-style: var(--body-large-font-style);
}

.servicios-en-equipos .EMPORDA-CAN[b-dy0cpam3ub] {
  position: relative;
  width: fit-content;
  font-family: var(--body-large-font-family);
  font-weight: var(--body-large-font-weight);
  color: #000000;
  font-size: var(--body-large-font-size);
  text-align: center;
  letter-spacing: var(--body-large-letter-spacing);
  line-height: var(--body-large-line-height);
  font-style: var(--body-large-font-style);
}

.servicios-en-equipos .frame-6[b-dy0cpam3ub] {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 25px;
  position: relative;
  flex: 0 0 auto;
}

.servicios-en-equipos .boton[b-dy0cpam3ub] {
  display: inline-flex;
  flex-direction: column;
  height: 40px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  position: relative;
  flex: 0 0 auto;
  background-color: var(--primario);
  border-radius: 6px;
  overflow: hidden;
}

.servicios-en-equipos .state-layer[b-dy0cpam3ub] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 24px;
  position: relative;
  flex: 1;
  align-self: stretch;
  width: 100%;
  flex-grow: 1;
}

.servicios-en-equipos .label-text[b-dy0cpam3ub] {
  position: relative;
  width: fit-content;
  margin-top: -3px;
  margin-bottom: -1px;
  font-family: var(--title-medium-font-family);
  font-weight: var(--title-medium-font-weight);
  color: var(--blanco);
  font-size: var(--title-medium-font-size);
  text-align: center;
  letter-spacing: var(--title-medium-letter-spacing);
  line-height: var(--title-medium-line-height);
  white-space: nowrap;
  font-style: var(--title-medium-font-style);
}

.servicios-en-equipos .state-layer-wrapper[b-dy0cpam3ub] {
  display: inline-flex;
  height: 53px;
  flex: 0 0 auto;
  border-color: var(--primario);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  position: relative;
  background-color: var(--blanco);
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid;
}

.servicios-en-equipos .label-text-2[b-dy0cpam3ub] {
  color: var(--primario);
  position: relative;
  width: fit-content;
  font-family: var(--title-medium-font-family);
  font-weight: var(--title-medium-font-weight);
  font-size: var(--title-medium-font-size);
  text-align: center;
  letter-spacing: var(--title-medium-letter-spacing);
  line-height: var(--title-medium-line-height);
  white-space: nowrap;
  font-style: var(--title-medium-font-style);
}

.servicios-en-equipos .label-text-3[b-dy0cpam3ub] {
  margin-top: -3px;
  margin-bottom: -1px;
  color: var(--negro);
  position: relative;
  width: fit-content;
  font-family: var(--title-medium-font-family);
  font-weight: var(--title-medium-font-weight);
  font-size: var(--title-medium-font-size);
  text-align: center;
  letter-spacing: var(--title-medium-letter-spacing);
  line-height: var(--title-medium-line-height);
  white-space: nowrap;
  font-style: var(--title-medium-font-style);
}

.servicios-en-equipos .boton-2[b-dy0cpam3ub] {
  display: inline-flex;
  height: 40px;
  flex: 0 0 auto;
  border-color: var(--alternativo-oscuro);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  position: relative;
  background-color: var(--blanco);
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid;
}

.servicios-en-equipos .label-text-4[b-dy0cpam3ub] {
  color: var(--negro);
  position: relative;
  width: fit-content;
  font-family: var(--title-medium-font-family);
  font-weight: var(--title-medium-font-weight);
  font-size: var(--title-medium-font-size);
  text-align: center;
  letter-spacing: var(--title-medium-letter-spacing);
  line-height: var(--title-medium-line-height);
  white-space: nowrap;
  font-style: var(--title-medium-font-style);
}

.servicios-en-equipos .boton-3[b-dy0cpam3ub] {
  display: flex;
  width: 592px;
  height: 52px;
  border-color: var(--alternativo-oscuro);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  position: relative;
  background-color: var(--blanco);
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid;
}

    .servicios-en-equipos .state-layer-2[b-dy0cpam3ub] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .servicios-en-equipos .boton-3[b-dy0cpam3ub] {
        display: flex;
        flex-direction: column;
        width: 592px;
        height: 52px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        background-color: var(--blanco);
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--alternativo-oscuro);
        cursor: pointer;
    }

    .servicios-en-equipos .label-text-5[b-dy0cpam3ub] {
        position: relative;
        text-decoration: none;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--negro);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }


    .servicios-en-equipos .boton-3:hover[b-dy0cpam3ub] {
        background-color: var(--alternativo-oscuro);
    }

        .servicios-en-equipos .boton-3:hover .label-text-5[b-dy0cpam3ub] {
            color: var(--blanco);
        }

    .servicios-en-equipos .input:focus[b-dy0cpam3ub],
    .servicios-en-equipos .input-2:focus[b-dy0cpam3ub] {
        border: 1px solid green;
    }
/* _content/PMCWEB/Components/Pages/Sostenibilidad.razor.rz.scp.css */
/* RESET BÁSICO */
*[b-lv5f3dma6x] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ESTILOS GENERALES */
body[b-lv5f3dma6x] {
    font-family: sans-serif;
    color: #333;
}

/* ENCABEZADO */
header[b-lv5f3dma6x] {
    text-align: center;
    padding: 1rem;
    border-bottom: 1px solid #ddd;
}


    header h1[b-lv5f3dma6x] {
        font-size: 1.5rem;
    }


/* MAIN */

a[b-lv5f3dma6x] {
    text-decoration: none;
}

.container[b-lv5f3dma6x] {
    max-width: 1920px;
    max-height: 1827px;
    font-family: "Nunito Sans", sans-serif;
}

.containerTwo[b-lv5f3dma6x] {
    max-width: 500px;
    max-height: 369px;
    width: 500px;
    height: 369px;
}

h2[b-lv5f3dma6x] {
    font-weight: 700;
    font-size: 32px;
    line-height 100%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

h4[b-lv5f3dma6x] {
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #323332;
}

hr[b-lv5f3dma6x] {
    border: 1px;
    background-color: #ABABAB;
    width: 503px;
}

.pText[b-lv5f3dma6x] {
    font-weight: 300;
    font-size: 18px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 30px;
}

.mainText[b-lv5f3dma6x] {
    width: 820px;
    height: 489px;
    max-width: 820px;
    max-height: 489px;
}

.displayFlex[b-lv5f3dma6x] {
    display: flex;
    justify-content: space-between;
}

.displayFlexTwo[b-lv5f3dma6x] {
    display: flex;
    gap: 32px;
    margin-top: 30px;
}

.collection[b-lv5f3dma6x] {
    padding: 120px 115px 0 115px;
    width: 1920px;
    height: 729px;
    max-width: 1920px;
    max-height: 729px;
    background-color: #F6F6F6;
}

.sectionTwo[b-lv5f3dma6x] {
    padding: 120px 115px 0 115px;
    background-color: white;
}

.marginBottom[b-lv5f3dma6x] {
    margin-bottom: 25px;
}

/* END MAIN*/

/* SECCIÓN DEL MAPA */
.map-section[b-lv5f3dma6x] {
    width: 100%;
    max-height: 400px;
    overflow: hidden;
}

/* CONTENEDOR PRINCIPAL */
.contact-container[b-lv5f3dma6x] {
    display: flex;
    flex-wrap: wrap;
    margin: 2rem auto;
    max-width: 1200px;
    padding: 0 1rem;
}

/* COLUMNA IZQUIERDA: FORMULARIO */
.contact-left[b-lv5f3dma6x] {
    flex: 1 1 500px;
    margin-right: 2rem;
}

    .contact-left h2[b-lv5f3dma6x] {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .contact-left p[b-lv5f3dma6x] {
        margin-bottom: 1rem;
        line-height: 1.4;
    }

form[b-lv5f3dma6x] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-row[b-lv5f3dma6x] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

    .form-row input[b-lv5f3dma6x],
    .form-row textarea[b-lv5f3dma6x] {
        flex: 1;
        padding: 0.8rem;
        font-size: 1rem;
        border: 1px solid #ccc;
        border-radius: 6px;
        background-color: #F5F5F5;
    }

        .form-row input:focus[b-lv5f3dma6x],
        .form-row textarea:focus[b-lv5f3dma6x] {
            outline: none;
            border: 1px solid #3CAA36;
            box-shadow: 0 0 0 1px #3CAA36;
            background-color: #fefefe;
        }

form button[b-lv5f3dma6x] {
    background-color: #2BA84A;
    color: #fff;
    border: none;
    padding: 0.8rem;
    cursor: pointer;
    font-size: 1rem;
    border-radius: 6px;
}

    form button:hover[b-lv5f3dma6x] {
        background-color: #24913f;
    }

/* COLUMNA DERECHA: SEDES estilo FAQ */
.contact-right[b-lv5f3dma6x] {
    flex: 1 1 300px;
    margin-top: 2rem;
}

.faq[b-lv5f3dma6x] {
    list-style: none;
    padding: 0;
}

.faq-item[b-lv5f3dma6x] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.faq-question[b-lv5f3dma6x] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-answer[b-lv5f3dma6x] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

.faq-item.open[b-lv5f3dma6x] {
    border-bottom: 2px solid #3CAA36;
}

.arrow[b-lv5f3dma6x] {
    transition: transform 0.3s ease;
}

.rotate[b-lv5f3dma6x] {
    transform: rotate(90deg);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .contact-container[b-lv5f3dma6x] {
        flex-direction: column;
    }

    .contact-left[b-lv5f3dma6x], .contact-right[b-lv5f3dma6x] {
        margin-right: 0;
        margin-top: 1rem;
    }
}
/* _content/PMCWEB/Components/Pages/Sostenibilidades/Inspiracion.razor.rz.scp.css */
/* RESET BÁSICO */
*[b-nujtwkd1jz] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ESTILOS GENERALES */
body[b-nujtwkd1jz] {
    font-family: sans-serif;
    color: #333;
}

/* ENCABEZADO */
header[b-nujtwkd1jz] {
    text-align: center;
    padding: 1rem;
    border-bottom: 1px solid #ddd;
}


    header h1[b-nujtwkd1jz] {
        font-size: 1.5rem;
    }


/* MAIN */

.container[b-nujtwkd1jz] {
    max-width: 1920px;
    max-height: 1800px;
    font-family: "Nunito Sans", sans-serif;
    padding: 120px 0 60px 0;
}

h1[b-nujtwkd1jz] {
    margin-bottom: 32px;
    font-weight: 400;
    font-size: 48px;
    line-height: 100%;
    letter-spacing: 0%;
}

h2[b-nujtwkd1jz] {
    font-weight: 700;
    font-size: 32px;
    line-height 100%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

h3[b-nujtwkd1jz] {
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #000000;
    margin-top: 25px;
}

p[b-nujtwkd1jz]{
    font-weight: 300;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

h4[b-nujtwkd1jz] {
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #323332;
}

hr[b-nujtwkd1jz] {
    border: 1px solid;
    color:#ABABAB;
    background-color: #ABABAB;
    width: 503px;
}

.pText[b-nujtwkd1jz] {
    font-weight: 300;
    font-size: 18px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

.padding[b-nujtwkd1jz] {
    padding-left: 120px;
    margin-bottom: 60px;
}

.mainText[b-nujtwkd1jz] {
    width: 830px;
    height: 460px;
    max-width: 835px;
    max-height: 483px;
    padding-right: 5px;
}

.divContenedor[b-nujtwkd1jz] {
    width: 1690px;
    height: 369px;
    display: flex;
    justify-content: space-between;
}

.displayFlex[b-nujtwkd1jz] {
    display: flex; 
    padding-left: 120px;
    gap: 120px;
}


.collection[b-nujtwkd1jz] {
    padding: 120px 115px 120px 115px;
    background-color: #FCF9F8;
}


.sectionThree[b-nujtwkd1jz] {
    padding: 120px 115px 120px 115px;
    background-color: #FCF9F8;
}

.sectionFour[b-nujtwkd1jz] {
    padding: 120px 115px 120px 115px;
    background-color: white;
}

.paddingBottom[b-nujtwkd1jz] {
    padding-bottom: 120px;
}

/* END MAIN*/

/* SECCIÓN DEL MAPA */
.map-section[b-nujtwkd1jz] {
    width: 100%;
    max-height: 400px;
    overflow: hidden;
}

/* CONTENEDOR PRINCIPAL */
.contact-container[b-nujtwkd1jz] {
    display: flex;
    flex-wrap: wrap;
    margin: 2rem auto;
    max-width: 1200px;
    padding: 0 1rem;
}

/* COLUMNA IZQUIERDA: FORMULARIO */
.contact-left[b-nujtwkd1jz] {
    flex: 1 1 500px;
    margin-right: 2rem;
}

    .contact-left h2[b-nujtwkd1jz] {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .contact-left p[b-nujtwkd1jz] {
        margin-bottom: 1rem;
        line-height: 1.4;
    }

form[b-nujtwkd1jz] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-row[b-nujtwkd1jz] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

    .form-row input[b-nujtwkd1jz],
    .form-row textarea[b-nujtwkd1jz] {
        flex: 1;
        padding: 0.8rem;
        font-size: 1rem;
        border: 1px solid #ccc;
        border-radius: 6px;
        background-color: #F5F5F5;
    }

        .form-row input:focus[b-nujtwkd1jz],
        .form-row textarea:focus[b-nujtwkd1jz] {
            outline: none;
            border: 1px solid #3CAA36;
            box-shadow: 0 0 0 1px #3CAA36;
            background-color: #fefefe;
        }

form button[b-nujtwkd1jz] {
    background-color: #2BA84A;
    color: #fff;
    border: none;
    padding: 0.8rem;
    cursor: pointer;
    font-size: 1rem;
    border-radius: 6px;
}

    form button:hover[b-nujtwkd1jz] {
        background-color: #24913f;
    }

/* COLUMNA DERECHA: SEDES estilo FAQ */
.contact-right[b-nujtwkd1jz] {
    flex: 1 1 300px;
    margin-top: 2rem;
}

.faq[b-nujtwkd1jz] {
    list-style: none;
    padding: 0;
}

.faq-item[b-nujtwkd1jz] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.faq-question[b-nujtwkd1jz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-answer[b-nujtwkd1jz] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

.faq-item.open[b-nujtwkd1jz] {
    border-bottom: 2px solid #3CAA36;
}

.arrow[b-nujtwkd1jz] {
    transition: transform 0.3s ease;
}

.rotate[b-nujtwkd1jz] {
    transform: rotate(90deg);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .contact-container[b-nujtwkd1jz] {
        flex-direction: column;
    }

    .contact-left[b-nujtwkd1jz], .contact-right[b-nujtwkd1jz] {
        margin-right: 0;
        margin-top: 1rem;
    }
}
/* _content/PMCWEB/Components/Pages/Sostenibilidades/MaterialesNaturales.razor.rz.scp.css */
/* RESET BÁSICO */
*[b-ogsxvfhbib] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ESTILOS GENERALES */
body[b-ogsxvfhbib] {
    font-family: sans-serif;
    color: #333;
}

/* ENCABEZADO */
header[b-ogsxvfhbib] {
    text-align: center;
    padding: 1rem;
    border-bottom: 1px solid #ddd;
}


    header h1[b-ogsxvfhbib] {
        font-size: 1.5rem;
    }


/* MAIN */

.container[b-ogsxvfhbib] {
    max-width: 1920px;
    max-height: 4207px;
    font-family: "Nunito Sans", sans-serif;
    padding-bottom: 60px;
}

h1[b-ogsxvfhbib] {
    margin-bottom: 32px;
    font-weight: 400;
    font-size: 48px;
    line-height: 100%;
    letter-spacing: 0%;
}

h2[b-ogsxvfhbib] {
    font-weight: 700;
    font-size: 32px;
    line-height 100%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

p[b-ogsxvfhbib]{
    font-weight: 300;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

h4[b-ogsxvfhbib] {
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #323332;
}

hr[b-ogsxvfhbib] {
    border: 1px solid;
    color:#ABABAB;
    background-color: #ABABAB;
    width: 503px;
}

.pText[b-ogsxvfhbib] {
    font-weight: 300;
    font-size: 18px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

.padding-left[b-ogsxvfhbib] {
    padding-left: 120px;
}

.mainText[b-ogsxvfhbib] {
    width: 830px;
    height: 460px;
    max-width: 835px;
    max-height: 483px;
    padding-right: 5px;
}

.displayFlex[b-ogsxvfhbib] {
    display: flex; 
    padding-left: 120px;
    gap: 120px;
}


.collection[b-ogsxvfhbib] {
    padding: 120px 115px 0px 115px;
    width: 1920px;
    height: 787px;
    max-width: 1920px;
    max-height: 787px;
    background-color: #FCF9F8;
}

.sectionTwo[b-ogsxvfhbib] {
    padding: 120px 115px 0px 115px;
    background-color: white;
}

.sectionThree[b-ogsxvfhbib] {
    padding: 120px 115px 120px 115px;
    background-color: #FCF9F8;
}

.sectionFour[b-ogsxvfhbib] {
    padding: 120px 115px 120px 115px;
    background-color: white;
}

.paddingBottom[b-ogsxvfhbib] {
    padding-bottom: 120px;
}

/* END MAIN*/

/* SECCIÓN DEL MAPA */
.map-section[b-ogsxvfhbib] {
    width: 100%;
    max-height: 400px;
    overflow: hidden;
}

/* CONTENEDOR PRINCIPAL */
.contact-container[b-ogsxvfhbib] {
    display: flex;
    flex-wrap: wrap;
    margin: 2rem auto;
    max-width: 1200px;
    padding: 0 1rem;
}

/* COLUMNA IZQUIERDA: FORMULARIO */
.contact-left[b-ogsxvfhbib] {
    flex: 1 1 500px;
    margin-right: 2rem;
}

    .contact-left h2[b-ogsxvfhbib] {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .contact-left p[b-ogsxvfhbib] {
        margin-bottom: 1rem;
        line-height: 1.4;
    }

form[b-ogsxvfhbib] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-row[b-ogsxvfhbib] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

    .form-row input[b-ogsxvfhbib],
    .form-row textarea[b-ogsxvfhbib] {
        flex: 1;
        padding: 0.8rem;
        font-size: 1rem;
        border: 1px solid #ccc;
        border-radius: 6px;
        background-color: #F5F5F5;
    }

        .form-row input:focus[b-ogsxvfhbib],
        .form-row textarea:focus[b-ogsxvfhbib] {
            outline: none;
            border: 1px solid #3CAA36;
            box-shadow: 0 0 0 1px #3CAA36;
            background-color: #fefefe;
        }

form button[b-ogsxvfhbib] {
    background-color: #2BA84A;
    color: #fff;
    border: none;
    padding: 0.8rem;
    cursor: pointer;
    font-size: 1rem;
    border-radius: 6px;
}

    form button:hover[b-ogsxvfhbib] {
        background-color: #24913f;
    }

/* COLUMNA DERECHA: SEDES estilo FAQ */
.contact-right[b-ogsxvfhbib] {
    flex: 1 1 300px;
    margin-top: 2rem;
}

.faq[b-ogsxvfhbib] {
    list-style: none;
    padding: 0;
}

.faq-item[b-ogsxvfhbib] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.faq-question[b-ogsxvfhbib] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-answer[b-ogsxvfhbib] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

.faq-item.open[b-ogsxvfhbib] {
    border-bottom: 2px solid #3CAA36;
}

.arrow[b-ogsxvfhbib] {
    transition: transform 0.3s ease;
}

.rotate[b-ogsxvfhbib] {
    transform: rotate(90deg);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .contact-container[b-ogsxvfhbib] {
        flex-direction: column;
    }

    .contact-left[b-ogsxvfhbib], .contact-right[b-ogsxvfhbib] {
        margin-right: 0;
        margin-top: 1rem;
    }
}
/* _content/PMCWEB/Components/Pages/Sostenibilidades/MaterialesReciclados.razor.rz.scp.css */
/* RESET BÁSICO */
*[b-jvaz4c4qrr] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ESTILOS GENERALES */
body[b-jvaz4c4qrr] {
    font-family: sans-serif;
    color: #333;
}

/* ENCABEZADO */
header[b-jvaz4c4qrr] {
    text-align: center;
    padding: 1rem;
    border-bottom: 1px solid #ddd;
}


    header h1[b-jvaz4c4qrr] {
        font-size: 1.5rem;
    }


/* MAIN */

.container[b-jvaz4c4qrr] {
    max-width: 1920px;
    max-height: 4140px;
    font-family: "Nunito Sans", sans-serif;
    padding-bottom: 60px;
}

h1[b-jvaz4c4qrr] {
    margin-bottom: 32px;
    font-weight: 400;
    font-size: 48px;
    line-height: 100%;
    letter-spacing: 0%;
}

h2[b-jvaz4c4qrr] {
    font-weight: 700;
    font-size: 32px;
    line-height 100%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

p[b-jvaz4c4qrr]{
    font-weight: 300;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

h4[b-jvaz4c4qrr] {
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #323332;
}

hr[b-jvaz4c4qrr] {
    border: 1px solid;
    color:#ABABAB;
    background-color: #ABABAB;
    width: 503px;
}

.pText[b-jvaz4c4qrr] {
    font-weight: 300;
    font-size: 18px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

.padding-left[b-jvaz4c4qrr] {
    padding-left: 120px;
}

.mainText[b-jvaz4c4qrr] {
    width: 830px;
    height: 460px;
    max-width: 835px;
    max-height: 483px;
    padding-right: 5px;
}

.displayFlex[b-jvaz4c4qrr] {
    display: flex; 
    padding-left: 120px;
    gap: 120px;
}


.collection[b-jvaz4c4qrr] {
    padding: 120px 115px 0px 115px;
    width: 1920px;
    height: 895px;
    max-width: 1920px;
    max-height: 737px;
    background-color: #F8FAFC;
}

.sectionTwo[b-jvaz4c4qrr] {
    padding: 120px 115px 0px 115px;
    background-color: white;
}

.sectionThree[b-jvaz4c4qrr] {
    padding: 120px 115px 120px 115px;
    background-color: #F8FAFC;
}

.sectionFour[b-jvaz4c4qrr] {
    padding: 120px 115px 120px 115px;
    background-color: white;
}

.paddingBottom[b-jvaz4c4qrr] {
    padding-bottom: 120px;
}

/* END MAIN*/

/* SECCIÓN DEL MAPA */
.map-section[b-jvaz4c4qrr] {
    width: 100%;
    max-height: 400px;
    overflow: hidden;
}

/* CONTENEDOR PRINCIPAL */
.contact-container[b-jvaz4c4qrr] {
    display: flex;
    flex-wrap: wrap;
    margin: 2rem auto;
    max-width: 1200px;
    padding: 0 1rem;
}

/* COLUMNA IZQUIERDA: FORMULARIO */
.contact-left[b-jvaz4c4qrr] {
    flex: 1 1 500px;
    margin-right: 2rem;
}

    .contact-left h2[b-jvaz4c4qrr] {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .contact-left p[b-jvaz4c4qrr] {
        margin-bottom: 1rem;
        line-height: 1.4;
    }

form[b-jvaz4c4qrr] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-row[b-jvaz4c4qrr] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

    .form-row input[b-jvaz4c4qrr],
    .form-row textarea[b-jvaz4c4qrr] {
        flex: 1;
        padding: 0.8rem;
        font-size: 1rem;
        border: 1px solid #ccc;
        border-radius: 6px;
        background-color: #F5F5F5;
    }

        .form-row input:focus[b-jvaz4c4qrr],
        .form-row textarea:focus[b-jvaz4c4qrr] {
            outline: none;
            border: 1px solid #3CAA36;
            box-shadow: 0 0 0 1px #3CAA36;
            background-color: #fefefe;
        }

form button[b-jvaz4c4qrr] {
    background-color: #2BA84A;
    color: #fff;
    border: none;
    padding: 0.8rem;
    cursor: pointer;
    font-size: 1rem;
    border-radius: 6px;
}

    form button:hover[b-jvaz4c4qrr] {
        background-color: #24913f;
    }

/* COLUMNA DERECHA: SEDES estilo FAQ */
.contact-right[b-jvaz4c4qrr] {
    flex: 1 1 300px;
    margin-top: 2rem;
}

.faq[b-jvaz4c4qrr] {
    list-style: none;
    padding: 0;
}

.faq-item[b-jvaz4c4qrr] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.faq-question[b-jvaz4c4qrr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-answer[b-jvaz4c4qrr] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

.faq-item.open[b-jvaz4c4qrr] {
    border-bottom: 2px solid #3CAA36;
}

.arrow[b-jvaz4c4qrr] {
    transition: transform 0.3s ease;
}

.rotate[b-jvaz4c4qrr] {
    transform: rotate(90deg);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .contact-container[b-jvaz4c4qrr] {
        flex-direction: column;
    }

    .contact-left[b-jvaz4c4qrr], .contact-right[b-jvaz4c4qrr] {
        margin-right: 0;
        margin-top: 1rem;
    }
}
/* _content/PMCWEB/Components/Pages/Sostenibilidades/MaterialesReutilizables.razor.rz.scp.css */
/* RESET BÁSICO */
*[b-48r3z0oqui] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ESTILOS GENERALES */
body[b-48r3z0oqui] {
    font-family: sans-serif;
    color: #333;
}

/* ENCABEZADO */
header[b-48r3z0oqui] {
    text-align: center;
    padding: 1rem;
    border-bottom: 1px solid #ddd;
}


    header h1[b-48r3z0oqui] {
        font-size: 1.5rem;
    }


/* MAIN */

.container[b-48r3z0oqui] {
    max-width: 1920px;
    max-height: 4207px;
    font-family: "Nunito Sans", sans-serif;
    padding-bottom: 60px;
}

h1[b-48r3z0oqui] {
    margin-bottom: 32px;
    font-weight: 400;
    font-size: 48px;
    line-height: 100%;
    letter-spacing: 0%;
}

h2[b-48r3z0oqui] {
    font-weight: 700;
    font-size: 32px;
    line-height 100%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

p[b-48r3z0oqui]{
    font-weight: 300;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

h4[b-48r3z0oqui] {
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #323332;
}

hr[b-48r3z0oqui] {
    border: 1px solid;
    color:#ABABAB;
    background-color: #ABABAB;
    width: 503px;
}

.pText[b-48r3z0oqui] {
    font-weight: 300;
    font-size: 18px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

.padding-left[b-48r3z0oqui] {
    padding-left: 120px;
}

.mainText[b-48r3z0oqui] {
    width: 832px;
    height: 460px;
    max-width: 835px;
    max-height: 483px;
    padding-right: 5px;
}

.displayFlex[b-48r3z0oqui] {
    display: flex; 
    padding-left: 120px;
    gap: 120px;
}


.collection[b-48r3z0oqui] {
    padding: 120px 115px 0px 115px;
    width: 1920px;
    height: 754px;
    max-width: 1920px;
    max-height: 754px;
    background-color: #FAFCF8;
}

.sectionTwo[b-48r3z0oqui] {
    padding: 120px 115px 0px 115px;
    background-color: white;
}

.paddingBottom[b-48r3z0oqui] {
    padding-bottom: 120px;
}

/* END MAIN*/

/* SECCIÓN DEL MAPA */
.map-section[b-48r3z0oqui] {
    width: 100%;
    max-height: 400px;
    overflow: hidden;
}

/* CONTENEDOR PRINCIPAL */
.contact-container[b-48r3z0oqui] {
    display: flex;
    flex-wrap: wrap;
    margin: 2rem auto;
    max-width: 1200px;
    padding: 0 1rem;
}

/* COLUMNA IZQUIERDA: FORMULARIO */
.contact-left[b-48r3z0oqui] {
    flex: 1 1 500px;
    margin-right: 2rem;
}

    .contact-left h2[b-48r3z0oqui] {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .contact-left p[b-48r3z0oqui] {
        margin-bottom: 1rem;
        line-height: 1.4;
    }

form[b-48r3z0oqui] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-row[b-48r3z0oqui] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

    .form-row input[b-48r3z0oqui],
    .form-row textarea[b-48r3z0oqui] {
        flex: 1;
        padding: 0.8rem;
        font-size: 1rem;
        border: 1px solid #ccc;
        border-radius: 6px;
        background-color: #F5F5F5;
    }

        .form-row input:focus[b-48r3z0oqui],
        .form-row textarea:focus[b-48r3z0oqui] {
            outline: none;
            border: 1px solid #3CAA36;
            box-shadow: 0 0 0 1px #3CAA36;
            background-color: #fefefe;
        }

form button[b-48r3z0oqui] {
    background-color: #2BA84A;
    color: #fff;
    border: none;
    padding: 0.8rem;
    cursor: pointer;
    font-size: 1rem;
    border-radius: 6px;
}

    form button:hover[b-48r3z0oqui] {
        background-color: #24913f;
    }

/* COLUMNA DERECHA: SEDES estilo FAQ */
.contact-right[b-48r3z0oqui] {
    flex: 1 1 300px;
    margin-top: 2rem;
}

.faq[b-48r3z0oqui] {
    list-style: none;
    padding: 0;
}

.faq-item[b-48r3z0oqui] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.faq-question[b-48r3z0oqui] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-answer[b-48r3z0oqui] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

.faq-item.open[b-48r3z0oqui] {
    border-bottom: 2px solid #3CAA36;
}

.arrow[b-48r3z0oqui] {
    transition: transform 0.3s ease;
}

.rotate[b-48r3z0oqui] {
    transform: rotate(90deg);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .contact-container[b-48r3z0oqui] {
        flex-direction: column;
    }

    .contact-left[b-48r3z0oqui], .contact-right[b-48r3z0oqui] {
        margin-right: 0;
        margin-top: 1rem;
    }
}
/* _content/PMCWEB/Components/Pages/Sostenibilidades/ProductosReutilizables.razor.rz.scp.css */
/* RESET BÁSICO */
*[b-atgf2gbyd8] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ESTILOS GENERALES */
body[b-atgf2gbyd8] {
    font-family: sans-serif;
    color: #333;
}

/* ENCABEZADO */
header[b-atgf2gbyd8] {
    text-align: center;
    padding: 1rem;
    border-bottom: 1px solid #ddd;
}


    header h1[b-atgf2gbyd8] {
        font-size: 1.5rem;
    }


/* MAIN */

.container[b-atgf2gbyd8] {
    max-width: 1920px;
    max-height: 4207px;
    font-family: "Nunito Sans", sans-serif;
    padding-bottom: 60px;
}

h1[b-atgf2gbyd8] {
    margin-bottom: 32px;
    font-weight: 400;
    font-size: 48px;
    line-height: 100%;
    letter-spacing: 0%;
}

h2[b-atgf2gbyd8] {
    font-weight: 700;
    font-size: 32px;
    line-height 100%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

p[b-atgf2gbyd8]{
    font-weight: 300;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

h4[b-atgf2gbyd8] {
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #323332;
}

hr[b-atgf2gbyd8] {
    border: 1px solid;
    color:#ABABAB;
    background-color: #ABABAB;
    width: 503px;
}

.pText[b-atgf2gbyd8] {
    font-weight: 300;
    font-size: 18px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

.padding-left[b-atgf2gbyd8] {
    padding-left: 120px;
}

.mainText[b-atgf2gbyd8] {
    width: 830px;
    height: 460px;
    max-width: 835px;
    max-height: 483px;
    padding-right: 5px;
}

.displayFlex[b-atgf2gbyd8] {
    display: flex; 
    padding-left: 120px;
    gap: 120px;
}


.collection[b-atgf2gbyd8] {
    padding: 120px 115px 0px 115px;
    width: 1920px;
    height: 754px;
    max-width: 1920px;
    max-height: 787px;
    background-color: #FCFCF8;
}

.sectionTwo[b-atgf2gbyd8] {
    padding: 120px 115px 0px 115px;
    background-color: white;
}

.sectionThree[b-atgf2gbyd8] {
    padding: 120px 115px 120px 115px;
    background-color: #FCF9F8;
}

.sectionFour[b-atgf2gbyd8] {
    padding: 120px 115px 120px 115px;
    background-color: white;
}

.paddingBottom[b-atgf2gbyd8] {
    padding-bottom: 120px;
}

/* END MAIN*/

/* SECCIÓN DEL MAPA */
.map-section[b-atgf2gbyd8] {
    width: 100%;
    max-height: 400px;
    overflow: hidden;
}

/* CONTENEDOR PRINCIPAL */
.contact-container[b-atgf2gbyd8] {
    display: flex;
    flex-wrap: wrap;
    margin: 2rem auto;
    max-width: 1200px;
    padding: 0 1rem;
}

/* COLUMNA IZQUIERDA: FORMULARIO */
.contact-left[b-atgf2gbyd8] {
    flex: 1 1 500px;
    margin-right: 2rem;
}

    .contact-left h2[b-atgf2gbyd8] {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .contact-left p[b-atgf2gbyd8] {
        margin-bottom: 1rem;
        line-height: 1.4;
    }

form[b-atgf2gbyd8] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-row[b-atgf2gbyd8] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

    .form-row input[b-atgf2gbyd8],
    .form-row textarea[b-atgf2gbyd8] {
        flex: 1;
        padding: 0.8rem;
        font-size: 1rem;
        border: 1px solid #ccc;
        border-radius: 6px;
        background-color: #F5F5F5;
    }

        .form-row input:focus[b-atgf2gbyd8],
        .form-row textarea:focus[b-atgf2gbyd8] {
            outline: none;
            border: 1px solid #3CAA36;
            box-shadow: 0 0 0 1px #3CAA36;
            background-color: #fefefe;
        }

form button[b-atgf2gbyd8] {
    background-color: #2BA84A;
    color: #fff;
    border: none;
    padding: 0.8rem;
    cursor: pointer;
    font-size: 1rem;
    border-radius: 6px;
}

    form button:hover[b-atgf2gbyd8] {
        background-color: #24913f;
    }

/* COLUMNA DERECHA: SEDES estilo FAQ */
.contact-right[b-atgf2gbyd8] {
    flex: 1 1 300px;
    margin-top: 2rem;
}

.faq[b-atgf2gbyd8] {
    list-style: none;
    padding: 0;
}

.faq-item[b-atgf2gbyd8] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.faq-question[b-atgf2gbyd8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-answer[b-atgf2gbyd8] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

.faq-item.open[b-atgf2gbyd8] {
    border-bottom: 2px solid #3CAA36;
}

.arrow[b-atgf2gbyd8] {
    transition: transform 0.3s ease;
}

.rotate[b-atgf2gbyd8] {
    transform: rotate(90deg);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .contact-container[b-atgf2gbyd8] {
        flex-direction: column;
    }

    .contact-left[b-atgf2gbyd8], .contact-right[b-atgf2gbyd8] {
        margin-right: 0;
        margin-top: 1rem;
    }
}
/* _content/PMCWEB/Components/Pages/Sostenibilidades/TelaEtica.razor.rz.scp.css */
/* RESET BÁSICO */
*[b-rzsgjz6n39] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ESTILOS GENERALES */
body[b-rzsgjz6n39] {
    font-family: sans-serif;
    color: #333;
}

/* ENCABEZADO */
header[b-rzsgjz6n39] {
    text-align: center;
    padding: 1rem;
    border-bottom: 1px solid #ddd;
}


    header h1[b-rzsgjz6n39] {
        font-size: 1.5rem;
    }


/* MAIN */

.container[b-rzsgjz6n39] {
    max-width: 1920px;
    max-height: 1993px;
    font-family: "Nunito Sans", sans-serif;
    padding-bottom: 60px;
}

h1[b-rzsgjz6n39] {
    margin-bottom: 32px;
    font-weight: 400;
    font-size: 48px;
    line-height: 100%;
    letter-spacing: 0%;
}

h2[b-rzsgjz6n39] {
    font-weight: 700;
    font-size: 32px;
    line-height 100%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

p[b-rzsgjz6n39]{
    font-weight: 300;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

h4[b-rzsgjz6n39] {
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #323332;
}

hr[b-rzsgjz6n39] {
    border: 1px solid;
    color:#ABABAB;
    background-color: #ABABAB;
    width: 503px;
}

.pText[b-rzsgjz6n39] {
    font-weight: 300;
    font-size: 18px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #323332;
    margin-bottom: 32px;
}

.padding-left[b-rzsgjz6n39] {
    padding-left: 120px;
}

.mainText[b-rzsgjz6n39] {
    width: 830px;
    height: 460px;
    max-width: 835px;
    max-height: 483px;
    padding-right: 5px;
}

.displayFlex[b-rzsgjz6n39] {
    display: flex; 
    padding-left: 120px;
    gap: 120px;
}


.collection[b-rzsgjz6n39] {
    padding: 120px 115px 0 115px;
    width: 1920px;
    height: 895px;
    max-width: 1920px;
    max-height: 937px;
    background-color: #FCFBF8;
}

.sectionTwo[b-rzsgjz6n39] {
    padding: 120px 115px 120px 115px;
    background-color: white;
}

.marginBottom[b-rzsgjz6n39] {
    margin-bottom: 25px;
}

/* END MAIN*/

/* SECCIÓN DEL MAPA */
.map-section[b-rzsgjz6n39] {
    width: 100%;
    max-height: 400px;
    overflow: hidden;
}

/* CONTENEDOR PRINCIPAL */
.contact-container[b-rzsgjz6n39] {
    display: flex;
    flex-wrap: wrap;
    margin: 2rem auto;
    max-width: 1200px;
    padding: 0 1rem;
}

/* COLUMNA IZQUIERDA: FORMULARIO */
.contact-left[b-rzsgjz6n39] {
    flex: 1 1 500px;
    margin-right: 2rem;
}

    .contact-left h2[b-rzsgjz6n39] {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .contact-left p[b-rzsgjz6n39] {
        margin-bottom: 1rem;
        line-height: 1.4;
    }

form[b-rzsgjz6n39] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-row[b-rzsgjz6n39] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

    .form-row input[b-rzsgjz6n39],
    .form-row textarea[b-rzsgjz6n39] {
        flex: 1;
        padding: 0.8rem;
        font-size: 1rem;
        border: 1px solid #ccc;
        border-radius: 6px;
        background-color: #F5F5F5;
    }

        .form-row input:focus[b-rzsgjz6n39],
        .form-row textarea:focus[b-rzsgjz6n39] {
            outline: none;
            border: 1px solid #3CAA36;
            box-shadow: 0 0 0 1px #3CAA36;
            background-color: #fefefe;
        }

form button[b-rzsgjz6n39] {
    background-color: #2BA84A;
    color: #fff;
    border: none;
    padding: 0.8rem;
    cursor: pointer;
    font-size: 1rem;
    border-radius: 6px;
}

    form button:hover[b-rzsgjz6n39] {
        background-color: #24913f;
    }

/* COLUMNA DERECHA: SEDES estilo FAQ */
.contact-right[b-rzsgjz6n39] {
    flex: 1 1 300px;
    margin-top: 2rem;
}

.faq[b-rzsgjz6n39] {
    list-style: none;
    padding: 0;
}

.faq-item[b-rzsgjz6n39] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 12px;
}

.faq-question[b-rzsgjz6n39] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-size: 16px;
    padding: 12px 0;
    width: 100%;
    cursor: pointer;
    color: #000;
}

.faq-answer[b-rzsgjz6n39] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 14px;
    color: #444;
    padding-right: 24px;
}

.faq-item.open[b-rzsgjz6n39] {
    border-bottom: 2px solid #3CAA36;
}

.arrow[b-rzsgjz6n39] {
    transition: transform 0.3s ease;
}

.rotate[b-rzsgjz6n39] {
    transform: rotate(90deg);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .contact-container[b-rzsgjz6n39] {
        flex-direction: column;
    }

    .contact-left[b-rzsgjz6n39], .contact-right[b-rzsgjz6n39] {
        margin-right: 0;
        margin-top: 1rem;
    }
}
/* _content/PMCWEB/Components/Pages/Suscripciones.razor.rz.scp.css */
.suscripciones[b-i6phasennq] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.suscripciones .frame[b-i6phasennq] {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /*center;*/
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.suscripciones .titulo[b-i6phasennq] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.suscripciones h2[b-i6phasennq] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.suscripciones .iconos[b-i6phasennq] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.suscripciones .div[b-i6phasennq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.suscripciones .text-wrapper[b-i6phasennq] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.suscripciones .boton[b-i6phasennq] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.suscripciones .boton:hover[b-i6phasennq] {
    background-color: #80C87C;
}

.suscripciones .state-layer[b-i6phasennq] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.suscripciones .label-text[b-i6phasennq] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.suscripciones .frame-2[b-i6phasennq] {
    display: flex;
    padding: 75px 0;
    flex-direction: column;
    align-items: center;
    gap: 50px;
    align-self: stretch;
    width: 100%;
    background-color: var(--grisgris-10);
    border-radius: 15px;
    position: relative;
    flex: 0 0 auto;
}

.suscripciones .frame-3[b-i6phasennq] {
    display: flex;
    width: 1489px;
    justify-content: space-between;
    align-items: flex-start;
}

.suscripciones .frame-4[b-i6phasennq] {
    align-items: center;
    display: flex;
    flex: 1 0 0;
    gap: 20px;
    
}

.suscripciones .custom-checkbox[b-i6phasennq] {
    appearance: none;
    border: 1px solid #000000;
    border-radius: 7px;
    cursor: pointer;
    height: 14px;
    margin: 0;
    position: relative;
    width: 14px;
    -webkit-appearance: none;
}

.suscripciones .custom-checkbox:checked[b-i6phasennq] {
    background-color: green;
    border-color: green;
}

.suscripciones .custom-checkbox:focus[b-i6phasennq] {
    outline: 2px solid green;
}

.suscripciones .p[b-i6phasennq] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: var(--label-large-font-family);
    font-weight: var(--label-large-font-weight);
    color: #000000;
    font-size: var(--label-large-font-size);
    letter-spacing: var(--label-large-letter-spacing);
    line-height: var(--label-large-line-height);
    white-space: nowrap;
    font-style: var(--label-large-font-style);
}

.suscripciones .state-layer-wrapper[b-i6phasennq] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.suscripciones .state-layer-wrapper:hover[b-i6phasennq] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.suscripciones .state-layer-wrapper:hover .label-text-2[b-i6phasennq] {
    color: var(--blanco);
}

.suscripciones .label-text-2[b-i6phasennq] {
    color: var(--primario);
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.suscripciones .debemos-actualizar[b-i6phasennq] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 22px;
    text-align: center;
    letter-spacing: 0;
    line-height: 28px;
}

.suscripciones .span[b-i6phasennq] {
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #2d2e2e;
    font-size: 22px;
    letter-spacing: 0;
    line-height: 28px;
}

.suscripciones .text-wrapper-10[b-i6phasennq] {
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
}

.suscripciones .label-text-2[b-i6phasennq] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.suscripciones .alert p[b-i6phasennq] {
    margin-bottom: 0;
}

.suscripciones .spinner-border[b-i6phasennq] {
    color: var(--blanco);
}

.page-blocker[b-i6phasennq] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-i6phasennq] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/TrabajoIntegra.razor.rz.scp.css */
.trabaja-con[b-y5e7cqc273] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .trabaja-con .frame[b-y5e7cqc273] {
        flex-direction: column;
        align-items: center;
        gap: 30px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .trabaja-con .ttulo[b-y5e7cqc273] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .trabaja-con .CESTA[b-y5e7cqc273] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .trabaja-con .iconos[b-y5e7cqc273] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 19px;
        left: 0;
    }

    .trabaja-con .div[b-y5e7cqc273] {
        width: 1690px;
        align-items: flex-start;
        gap: 115px;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .trabaja-con .frame-2[b-y5e7cqc273] {
        flex-direction: column;
        align-items: center;
        gap: 50px;
        flex: 1;
        flex-grow: 1;
        display: flex;
        position: relative;
    }

    .trabaja-con .group[b-y5e7cqc273] {
        position: relative;
        width: 1045px;
        height: 83px;
        margin-right: -3.50px;
    }

    .trabaja-con .text-wrapper[b-y5e7cqc273] {
        position: absolute;
        width: 1041px;
        top: 0;
        left: 0;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: var(--texto-negro-suave);
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        font-style: var(--headline-large-font-style);
    }

    .trabaja-con .p[b-y5e7cqc273] {
        position: absolute;
        width: 1041px;
        top: 59px;
        left: 0;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .trabaja-con .frame-3[b-y5e7cqc273] {
        flex-direction: column;
        align-items: center;
        gap: 24px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .trabaja-con .input-wrapper[b-y5e7cqc273] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .trabaja-con .input[b-y5e7cqc273] {
        padding: 17px 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        background-color: var(--gris-10);
        border-radius: 6px;
        border: none;
        flex: 1;
        margin-top: -1.00px;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        color: var(--gris-50);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .trabaja-con .frame-4[b-y5e7cqc273] {
        align-items: flex-start;
        justify-content: center;
        gap: 24px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .trabaja-con .columna[b-y5e7cqc273] {
        align-self: stretch;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .trabaja-con .div-wrapper[b-y5e7cqc273] {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 17px 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        background-color: var(--gris-10);
        border-radius: 6px;
    }

    .trabaja-con .text-wrapper-2[b-y5e7cqc273] {
        position: relative;
        flex: 1;
        margin-top: -1.00px;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        color: var(--gris-50);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .trabaja-con .frame-wrapper[b-y5e7cqc273] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .trabaja-con .boton[b-y5e7cqc273] {
        display: flex;
        flex-direction: column;
        height: 59px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        flex: 1;
        flex-grow: 1;
        background-color: var(--blanco);
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--primario);
    }

    .trabaja-con .state-layer[b-y5e7cqc273] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .trabaja-con .label-text[b-y5e7cqc273] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--primario);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .trabaja-con .comentario[b-y5e7cqc273] {
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        margin-left: -0.50px;
        margin-right: -0.50px;
    }

    .trabaja-con .comentario-2[b-y5e7cqc273] {
        display: flex;
        flex-direction: column;
        height: 158px;
        align-items: flex-start;
        gap: 24px;
        position: relative;
        align-self: stretch;
        width: 100%;
    }

    .trabaja-con .poblaci-n-wrapper[b-y5e7cqc273] {
        display: flex;
        height: 158px;
        align-items: flex-start;
        gap: 10px;
        padding: 17px 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        background-color: var(--gris-10);
        border-radius: 6px;
    }

    .trabaja-con .frame-5[b-y5e7cqc273] {
        align-items: center;
        gap: 20px;
        flex: 1;
        align-self: stretch;
        flex-grow: 1;
        display: flex;
        position: relative;
    }

    .trabaja-con .component[b-y5e7cqc273] {
        position: relative;
        width: 14px;
        height: 14px;
        border-radius: 7px;
        border: 1px solid;
        border-color: #000000;
    }

    .trabaja-con .div-2[b-y5e7cqc273] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: var(--label-large-font-family);
        font-weight: var(--label-large-font-weight);
        color: #000000;
        font-size: var(--label-large-font-size);
        letter-spacing: var(--label-large-letter-spacing);
        line-height: var(--label-large-line-height);
        white-space: nowrap;
        font-style: var(--label-large-font-style);
    }

    .trabaja-con .span[b-y5e7cqc273] {
        font-weight: var(--label-large-font-weight);
        letter-spacing: var(--label-large-letter-spacing);
        font-family: var(--label-large-font-family);
        font-style: var(--label-large-font-style);
        line-height: var(--label-large-line-height);
        font-size: var(--label-large-font-size);
    }

    .trabaja-con .text-wrapper-3[b-y5e7cqc273] {
        font-weight: var(--label-large-font-weight);
        letter-spacing: var(--label-large-letter-spacing);
        text-decoration: underline;
        font-family: var(--label-large-font-family);
        font-style: var(--label-large-font-style);
        line-height: var(--label-large-line-height);
        font-size: var(--label-large-font-size);
    }

    .trabaja-con .condiciones[b-y5e7cqc273] {
        display: flex;
        align-items: flex-start;
        gap: 24px;
        padding: 30px 0px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .trabaja-con .polticas[b-y5e7cqc273] {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .trabaja-con .icon-pack[b-y5e7cqc273] {
        position: relative;
        width: 24px;
        height: 24px;
    }

    .trabaja-con .text-wrapper-4[b-y5e7cqc273] {
        position: relative;
        flex: 1;
        margin-top: -1.00px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--texto-negro-suave);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .trabaja-con .state-layer-wrapper[b-y5e7cqc273] {
        display: flex;
        flex-direction: column;
        height: 54px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        flex: 1;
        flex-grow: 1;
        background-color: var(--primario);
        border-radius: 6px;
        overflow: hidden;
    }

    .trabaja-con .label-text-2[b-y5e7cqc273] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--blanco);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .trabaja-con .frame-6[b-y5e7cqc273] {
        flex-direction: column;
        width: 533px;
        align-items: flex-start;
        gap: 50px;
        padding: 0px 50px;
        display: flex;
        position: relative;
    }

    .trabaja-con .frame-7[b-y5e7cqc273] {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 0px 0px 20px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-color: var(--grisgris-40);
        display: flex;
        position: relative;
    }

    .trabaja-con .text-wrapper-5[b-y5e7cqc273] {
        position: relative;
        align-self: stretch;
        margin-top: -1.00px;
        font-family: var(--headline-small-font-family);
        font-weight: var(--headline-small-font-weight);
        color: #000000;
        font-size: var(--headline-small-font-size);
        letter-spacing: var(--headline-small-letter-spacing);
        line-height: var(--headline-small-line-height);
        font-style: var(--headline-small-font-style);
    }

    .trabaja-con .text-wrapper-6[b-y5e7cqc273] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .trabaja-con .comentario-2[b-y5e7cqc273] {
        height: 250px; /* Aumenta la altura para más contenido */
    }

    .checkbox-input[b-y5e7cqc273] {
        width: 16px;
        height: 16px;
        cursor: pointer;
    }

    .checkbox-label[b-y5e7cqc273] {
        display: flex;
        align-items: center;
        gap: 8px;
        cursor: pointer;
    }

.trabaja-con .comentario-2[b-y5e7cqc273]::placeholder,
.trabaja-con .comentario-2[b-y5e7cqc273]::-webkit-input-placeholder,
.trabaja-con .comentario-2[b-y5e7cqc273]::-moz-placeholder,
.trabaja-con .comentario-2:-ms-input-placeholder[b-y5e7cqc273] {
    color: #999;
    font-style: italic;
}

/* Estilos para el placeholder del textarea "Preséntate" */
.trabaja-con .comentario-2[b-y5e7cqc273]::placeholder {
    color: #999;
    font-style: italic;
}

/* Compatibilidad con navegadores */
.trabaja-con .comentario-2[b-y5e7cqc273]::-webkit-input-placeholder {
    color: #999;
    font-style: italic;
}

.trabaja-con .comentario-2[b-y5e7cqc273]::-moz-placeholder {
    color: #999;
    font-style: italic;
}

.trabaja-con .comentario-2:-ms-input-placeholder[b-y5e7cqc273] {
    color: #999;
    font-style: italic;
}



    .trabaja-con .en-nombre-de-la[b-y5e7cqc273] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--grisgris-50);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }
/* _content/PMCWEB/Components/Pages/TrabajoPMC.razor.rz.scp.css */
.trabaja-con[b-v8453i6t5o] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

    .trabaja-con .frame[b-v8453i6t5o] {
        flex-direction: column;
        align-items: center;
        gap: 30px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .trabaja-con .ttulo[b-v8453i6t5o] {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .trabaja-con .CESTA[b-v8453i6t5o] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: "Nunito Sans", Helvetica;
        font-weight: 700;
        color: #000000;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .trabaja-con .iconos[b-v8453i6t5o] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 19px;
        left: 0;
    }

    .trabaja-con .div[b-v8453i6t5o] {
        width: 1690px;
        align-items: flex-start;
        gap: 115px;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .trabaja-con .frame-2[b-v8453i6t5o] {
        flex-direction: column;
        align-items: center;
        gap: 50px;
        flex: 1;
        flex-grow: 1;
        display: flex;
        position: relative;
    }

    .trabaja-con .group[b-v8453i6t5o] {
        position: relative;
        width: 1045px;
        height: 83px;
        margin-right: -3.50px;
    }

    .trabaja-con .text-wrapper[b-v8453i6t5o] {
        position: absolute;
        width: 1041px;
        top: 0;
        left: 0;
        font-family: var(--headline-large-font-family);
        font-weight: var(--headline-large-font-weight);
        color: var(--texto-negro-suave);
        font-size: var(--headline-large-font-size);
        letter-spacing: var(--headline-large-letter-spacing);
        line-height: var(--headline-large-line-height);
        font-style: var(--headline-large-font-style);
    }

    .trabaja-con .p[b-v8453i6t5o] {
        position: absolute;
        width: 1041px;
        top: 59px;
        left: 0;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--black-fonts-headings);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .trabaja-con .frame-3[b-v8453i6t5o] {
        flex-direction: column;
        align-items: center;
        gap: 24px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .trabaja-con .input-wrapper[b-v8453i6t5o] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .trabaja-con .input[b-v8453i6t5o] {
        padding: 17px 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        background-color: var(--gris-10);
        border-radius: 6px;
        border: none;
        flex: 1;
        margin-top: -1.00px;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        color: var(--gris-50);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .trabaja-con .frame-4[b-v8453i6t5o] {
        align-items: flex-start;
        justify-content: center;
        gap: 24px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        position: relative;
    }

    .trabaja-con .columna[b-v8453i6t5o] {
        align-self: stretch;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .trabaja-con .div-wrapper[b-v8453i6t5o] {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 17px 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        background-color: var(--gris-10);
        border-radius: 6px;
    }

    .trabaja-con .text-wrapper-2[b-v8453i6t5o] {
        position: relative;
        flex: 1;
        margin-top: -1.00px;
        font-family: var(--l-body-0-font-family);
        font-weight: var(--l-body-0-font-weight);
        color: var(--gris-50);
        font-size: var(--l-body-0-font-size);
        letter-spacing: var(--l-body-0-letter-spacing);
        line-height: var(--l-body-0-line-height);
        font-style: var(--l-body-0-font-style);
    }

    .trabaja-con .frame-wrapper[b-v8453i6t5o] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .trabaja-con .boton[b-v8453i6t5o] {
        display: flex;
        flex-direction: column;
        height: 59px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        flex: 1;
        flex-grow: 1;
        background-color: var(--blanco);
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--primario);
    }

    .trabaja-con .state-layer[b-v8453i6t5o] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 24px;
        position: relative;
        flex: 1;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
    }

    .trabaja-con .label-text[b-v8453i6t5o] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--primario);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .trabaja-con .comentario[b-v8453i6t5o] {
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        margin-left: -0.50px;
        margin-right: -0.50px;
    }

    .trabaja-con .comentario-2[b-v8453i6t5o] {
        display: flex;
        flex-direction: column;
        height: 158px;
        align-items: flex-start;
        gap: 24px;
        position: relative;
        align-self: stretch;
        width: 100%;
    }

    .trabaja-con .poblaci-n-wrapper[b-v8453i6t5o] {
        display: flex;
        height: 158px;
        align-items: flex-start;
        gap: 10px;
        padding: 17px 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        background-color: var(--gris-10);
        border-radius: 6px;
    }

    .trabaja-con .frame-5[b-v8453i6t5o] {
        align-items: center;
        gap: 20px;
        flex: 1;
        align-self: stretch;
        flex-grow: 1;
        display: flex;
        position: relative;
    }

    .trabaja-con .component[b-v8453i6t5o] {
        position: relative;
        width: 14px;
        height: 14px;
        border-radius: 7px;
        border: 1px solid;
        border-color: #000000;
    }

    .trabaja-con .div-2[b-v8453i6t5o] {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: var(--label-large-font-family);
        font-weight: var(--label-large-font-weight);
        color: #000000;
        font-size: var(--label-large-font-size);
        letter-spacing: var(--label-large-letter-spacing);
        line-height: var(--label-large-line-height);
        white-space: nowrap;
        font-style: var(--label-large-font-style);
    }

    .trabaja-con .span[b-v8453i6t5o] {
        font-weight: var(--label-large-font-weight);
        letter-spacing: var(--label-large-letter-spacing);
        font-family: var(--label-large-font-family);
        font-style: var(--label-large-font-style);
        line-height: var(--label-large-line-height);
        font-size: var(--label-large-font-size);
    }

    .trabaja-con .text-wrapper-3[b-v8453i6t5o] {
        font-weight: var(--label-large-font-weight);
        letter-spacing: var(--label-large-letter-spacing);
        text-decoration: underline;
        font-family: var(--label-large-font-family);
        font-style: var(--label-large-font-style);
        line-height: var(--label-large-line-height);
        font-size: var(--label-large-font-size);
    }

    .trabaja-con .condiciones[b-v8453i6t5o] {
        display: flex;
        align-items: flex-start;
        gap: 24px;
        padding: 30px 0px 0px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .trabaja-con .polticas[b-v8453i6t5o] {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .trabaja-con .icon-pack[b-v8453i6t5o] {
        position: relative;
        width: 24px;
        height: 24px;
    }

    .trabaja-con .text-wrapper-4[b-v8453i6t5o] {
        position: relative;
        flex: 1;
        margin-top: -1.00px;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--texto-negro-suave);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .trabaja-con .state-layer-wrapper[b-v8453i6t5o] {
        display: flex;
        flex-direction: column;
        height: 54px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        flex: 1;
        flex-grow: 1;
        background-color: var(--primario);
        border-radius: 6px;
        overflow: hidden;
    }

    .trabaja-con .label-text-2[b-v8453i6t5o] {
        position: relative;
        width: fit-content;
        font-family: var(--title-medium-font-family);
        font-weight: var(--title-medium-font-weight);
        color: var(--blanco);
        font-size: var(--title-medium-font-size);
        text-align: center;
        letter-spacing: var(--title-medium-letter-spacing);
        line-height: var(--title-medium-line-height);
        white-space: nowrap;
        font-style: var(--title-medium-font-style);
    }

    .trabaja-con .frame-6[b-v8453i6t5o] {
        flex-direction: column;
        width: 533px;
        align-items: flex-start;
        gap: 50px;
        padding: 0px 50px;
        display: flex;
        position: relative;
    }

    .trabaja-con .frame-7[b-v8453i6t5o] {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 0px 0px 20px;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-color: var(--grisgris-40);
        display: flex;
        position: relative;
    }

    .trabaja-con .text-wrapper-5[b-v8453i6t5o] {
        position: relative;
        align-self: stretch;
        margin-top: -1.00px;
        font-family: var(--headline-small-font-family);
        font-weight: var(--headline-small-font-weight);
        color: #000000;
        font-size: var(--headline-small-font-size);
        letter-spacing: var(--headline-small-letter-spacing);
        line-height: var(--headline-small-line-height);
        font-style: var(--headline-small-font-style);
    }

    .trabaja-con .text-wrapper-6[b-v8453i6t5o] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: #000000;
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }

    .trabaja-con .en-nombre-de-la[b-v8453i6t5o] {
        position: relative;
        align-self: stretch;
        font-family: var(--body-large-font-family);
        font-weight: var(--body-large-font-weight);
        color: var(--grisgris-50);
        font-size: var(--body-large-font-size);
        letter-spacing: var(--body-large-letter-spacing);
        line-height: var(--body-large-line-height);
        font-style: var(--body-large-font-style);
    }
/* _content/PMCWEB/Components/Pages/Usuario.razor.rz.scp.css */
.usuario[b-zz6vkolay9] {
    display: flex;
    flex-direction: column;
    width: 1920px;
    align-items: center;
    gap: 75px;
    padding: 0px 115px 100px;
    position: relative;
    background-color: #ffffff;
}

.usuario .frame[b-zz6vkolay9] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.usuario .titulo[b-zz6vkolay9] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.usuario h2[b-zz6vkolay9] {
    display: block;
    position: relative;
    width: fit-content;
    margin: 0;
    margin-top: -1.00px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.usuario .iconos[b-zz6vkolay9] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.usuario .div[b-zz6vkolay9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.usuario .text-wrapper[b-zz6vkolay9] {
    position: relative;
    width: fit-content;
    font-family: var(--headline-large-font-family);
    font-weight: var(--headline-large-font-weight);
    color: #000000;
    font-size: var(--headline-large-font-size);
    letter-spacing: var(--headline-large-letter-spacing);
    line-height: var(--headline-large-line-height);
    white-space: nowrap;
    font-style: var(--headline-large-font-style);
}

.usuario .boton[b-zz6vkolay9] {
    display: inline-flex;
    flex-direction: column;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    flex: 0 0 auto;
    background-color: var(--primario);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
}

.usuario .boton:hover[b-zz6vkolay9] {
    background-color: #80C87C;
}

.usuario .state-layer[b-zz6vkolay9] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
}

.usuario .label-text[b-zz6vkolay9] {
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--blanco);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.usuario .frame-2[b-zz6vkolay9] {
    background-color: var(--grisgris-10);
    border-radius: 15px;
    display: block;
    position: relative;
    width: 100%;
    padding: 75px 0;
}

.usuario .frame-3[b-zz6vkolay9] {
    align-items: flex-start;
    align-self: stretch;
    display: flex;
    flex: 0 0 auto;
    gap: 50px;
    justify-content: center;
    padding: 0px;
    position: relative;
    width: 100%;
}

.usuario .frame-4[b-zz6vkolay9] {
    align-items: flex-start;
    display: inline-flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 10px;
    position: relative;
    width: 750px;
}

.usuario .frame-5[b-zz6vkolay9] {
    align-items: center;
    align-self: stretch;
    display: flex;
    gap: 30px;
    height: 59px;
    justify-content: center;
    position: relative;
    width: 100%;
}

.usuario .frame-5.col2[b-zz6vkolay9] {
    gap: 10px;
    justify-content: left;
}

.usuario .frame-6[b-zz6vkolay9] {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 20px;
    position: relative;
    width: 100%;
    margin-top: 50px;
}

.usuario .frame-7[b-zz6vkolay9] {
    align-items: center;
    display: inline-flex;
    flex: 0 0 auto;
    gap: 20px;
    position: relative;
    width: 1000px;
}

.usuario .frame-7 .select-wrapper[b-zz6vkolay9] {
    width: 100%;
}

.usuario .frame-8[b-zz6vkolay9] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 75px;
    align-self: stretch;
    width: 100%;
    position: relative;
    flex: 0 0 auto;
}

.usuario .frame-9[b-zz6vkolay9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    align-self: stretch;
    width: 100%;
    position: relative;
    flex: 0 0 auto;
}

.usuario .frame-10[b-zz6vkolay9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px 0px 20px;
    align-self: stretch;
    width: 100%;
    margin-top: -1.00px;
    margin-left: -1.00px;
    margin-right: -1.00px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-color: var(--grisgris-30);
    position: relative;
    flex: 0 0 auto;
}

.usuario .frame-11[b-zz6vkolay9] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    position: relative;
    flex: 0 0 auto;
}

.usuario .text-wrapper-2[b-zz6vkolay9] {
    position: relative;
    width: 100%;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 22px;
    text-align: left;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.usuario .text-wrapper-4[b-zz6vkolay9] {
    position: relative;
    width: 175px;
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
    color: var(--black-fonts-headings);
    font-size: 16px;
    text-align: right;
    letter-spacing: 0.15px;
    line-height: 24px;
}

.usuario .text-wrapper-5[b-zz6vkolay9] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: var(--label-large-font-family);
    font-weight: var(--label-large-font-weight);
    color: var(--black-fonts-headings);
    font-size: var(--label-large-font-size);
    letter-spacing: var(--label-large-letter-spacing);
    line-height: var(--label-large-line-height);
    white-space: nowrap;
    font-style: var(--label-large-font-style);
}

[b-zz6vkolay9] .usuario .input {
    background-color: var(--blanco);
    border: none;
    border-radius: 6px;
    color: var(--negro);
    display: -webkit-box;
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    overflow: hidden;
    padding: 17px 16px;
    position: relative;
    text-overflow: ellipsis;
    width: 350px;
    max-width: 350px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

[b-zz6vkolay9] .usuario input::placeholder {
    color: #888;
}

[b-zz6vkolay9] .usuario input:focus {
    border: 2px solid #28a745;
    outline: none;
}

.usuario .input-2[b-zz6vkolay9], .usuario .input-3[b-zz6vkolay9] {
    appearance: none;
    background-color: var(--blanco);
    border: none;
    border-radius: 6px;
    color: var(--negro);
    flex: 1;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-size: 16px;
    font-weight: 400;
    height: 59px;
    letter-spacing: 0.15px;
    line-height: 24px;
    margin-top: -0.50px;
    padding: 17px 16px;
    padding-right: 50px;
    position: relative;
    width: 350px;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.usuario .input-2:focus[b-zz6vkolay9], .usuario .input-3:focus[b-zz6vkolay9] {
    border: 2px solid #3CAA36 !important;
    outline: none !important;
}

.usuario .input-3[b-zz6vkolay9] {
    width: 100%;
}

.usuario .input-2:focus[b-zz6vkolay9] {
    border: 2px solid #3CAA36 !important;
    outline: none !important;
}

.usuario .arrow[b-zz6vkolay9] {
    position: absolute;
    right: 16px;
    top: 50%;
    width: 15px;
    height: 15px;
    transform: translateY(-50%) rotate(0deg); /* Estado por defecto */
    transition: transform 0.3s ease;
}

.usuario .select-wrapper[b-zz6vkolay9] {
    position: relative;
}

    .usuario .select-wrapper:focus-within .arrow[b-zz6vkolay9] {
        transform: translateY(-50%) rotate(90deg);
    }

.usuario .input-wrapper[b-zz6vkolay9] {
    position: relative;
    width: 350px;
}

.usuario .input-wrapper .input[b-zz6vkolay9] {
    width: 100%;
    padding-right: 40px;
}

.usuario .input-wrapper .img[b-zz6vkolay9] {
    cursor: pointer;
    height: 24px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
}

.usuario .custom-checkbox[b-zz6vkolay9] {
    appearance: none;
    border: 1px solid #000000;
    border-radius: 7px;
    cursor: pointer;
    height: 14px;
    margin: 0;
    position: relative;
    width: 14px;
    -webkit-appearance: none;
}

.usuario .custom-checkbox:checked[b-zz6vkolay9] {
    background-color: green;
    border-color: green;
}

.usuario .custom-checkbox:focus[b-zz6vkolay9] {
    outline: 2px solid green;
}

.usuario .img[b-zz6vkolay9] {
    height: 24px;
    position: relative;
    width: 24px;
}

.usuario .p[b-zz6vkolay9] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: var(--label-large-font-family);
    font-weight: var(--label-large-font-weight);
    color: #000000;
    font-size: var(--label-large-font-size);
    letter-spacing: var(--label-large-letter-spacing);
    line-height: var(--label-large-line-height);
    white-space: nowrap;
    font-style: var(--label-large-font-style);
}

.usuario .label-text-4[b-zz6vkolay9] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--primario);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.usuario .state-layer-wrapper[b-zz6vkolay9] {
    display: flex;
    flex-direction: column;
    width: 592px;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--alternativo-oscuro);
}

.usuario .state-layer-wrapper:hover[b-zz6vkolay9] {
    background-color: var(--alternativo-oscuro);
    cursor: pointer;
}

.usuario .state-layer-wrapper:hover .label-text-2[b-zz6vkolay9] {
    color: var(--blanco);
}

.usuario .state-layer-wrapper-2[b-zz6vkolay9] {
    display: flex;
    flex-direction: column;
    width: 157px;
    height: 53px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    background-color: var(--blanco);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--primario);
}

.usuario .state-layer-wrapper-2:hover[b-zz6vkolay9] {
    background-color: var(--primario);
    cursor: pointer;
}

.usuario .state-layer-wrapper-2:hover .label-text-4[b-zz6vkolay9] {
    color: var(--blanco);
}

.usuario .label-text-2[b-zz6vkolay9] {
    color: var(--primario);
    position: relative;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.usuario .debemos-actualizar[b-zz6vkolay9] {
    position: relative;
    align-self: stretch;
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: var(--black-fonts-headings);
    font-size: 22px;
    text-align: center;
    letter-spacing: 0;
    line-height: 28px;
}

.usuario .span[b-zz6vkolay9] {
    font-family: "Nunito Sans-Regular", Helvetica;
    font-weight: 400;
    color: #2d2e2e;
    font-size: 22px;
    letter-spacing: 0;
    line-height: 28px;
}

.usuario .text-wrapper-10[b-zz6vkolay9] {
    font-family: "Nunito Sans-Bold", Helvetica;
    font-weight: 700;
}

.usuario .tabla-container[b-zz6vkolay9] {
    width: 100%;
}

.usuario .tabla[b-zz6vkolay9] {
    width: 100%;
    border-collapse: separate;
    font-family: sans-serif;
    background-color: var(--grisgris-10);
    font-size: 14px;
    position: relative;
}

.usuario .tabla thead[b-zz6vkolay9] {
    background-color: var(--grisgris-10);
    color: #000000;
    font-weight: bold;
    position: relative;
}

.usuario .tabla thead[b-zz6vkolay9]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000000; /* Color de la línea */
}

.usuario .tabla th[b-zz6vkolay9],
.usuario .tabla td[b-zz6vkolay9] {
    padding: 10px;
    text-align: left;
    background-color: var(--grisgris-10);
}

.usuario .tabla th[b-zz6vkolay9] {
    min-width: 50px;
}

.usuario .tabla th.importe[b-zz6vkolay9], .usuario .tabla td.importe[b-zz6vkolay9] {
    width: 150px;
}

[b-zz6vkolay9] .usuario .tabla td.importe .input {
    max-width: 130px;
    width: 130px;
    text-align: right;
}

.usuario .tabla th.eliminar[b-zz6vkolay9], .usuario .tabla td.eliminar[b-zz6vkolay9] {
    width: 50px;
}

.usuario .tabla td.eliminar[b-zz6vkolay9] {
    text-align: center;
}

.usuario .tabla td img[b-zz6vkolay9] {
    cursor: pointer;
}

.usuario .label-text-2[b-zz6vkolay9] {
    position: relative;
    text-decoration: none;
    width: fit-content;
    font-family: var(--title-medium-font-family);
    font-weight: var(--title-medium-font-weight);
    color: var(--negro);
    font-size: var(--title-medium-font-size);
    text-align: center;
    letter-spacing: var(--title-medium-letter-spacing);
    line-height: var(--title-medium-line-height);
    white-space: nowrap;
    font-style: var(--title-medium-font-style);
}

.usuario .alert p[b-zz6vkolay9] {
    margin-bottom: 0;
}

.usuario .spinner-border[b-zz6vkolay9] {
    color: var(--blanco);
}

.page-blocker[b-zz6vkolay9] {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.6);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.page-blocker-content[b-zz6vkolay9] {
    background: white;
    padding: 20px 28px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    display: flex;
    gap: 12px;
    align-items: center;
    font-weight: 600;
}
/* _content/PMCWEB/Components/Pages/Ventajas.razor.rz.scp.css */
.ventajas[b-es7mau1c7d] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem;
    text-align: center;
}

.ventajas .ttulo[b-es7mau1c7d] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.ventajas .CESTA[b-es7mau1c7d] {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-family: "Nunito Sans", Helvetica;
    font-weight: 700;
    color: #000000;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.ventajas .iconos[b-es7mau1c7d] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 19px;
    left: 0;
}

.ventajas-grid[b-es7mau1c7d] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
}

.ventaja[b-es7mau1c7d] {
    display: flex;
    border: 1px solid #ccc;
    border-radius: 12px;
    overflow: hidden;
    background-color: #fff;
}

    .ventaja .icon[b-es7mau1c7d] {
        background-color: var(--color);
        flex: 0 0 90px;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 1rem;
    }

        .ventaja .icon img[b-es7mau1c7d] {
            width: 50px;
            height: 50px;
        }

    .ventaja .texto[b-es7mau1c7d] {
        padding: 1.5rem;
        text-align: left;
        flex: 1;
    }

    .ventaja h3[b-es7mau1c7d] {
        margin: 0 0 0.5rem;
        font-size: 1.2rem;
    }

    .ventaja .sub[b-es7mau1c7d] {
        font-weight: 500;
        margin-bottom: 1rem;
        color: #444;
    }

    .ventaja hr[b-es7mau1c7d] {
        border: none;
        border-top: 1px solid #ccc;
        margin: 1rem 0;
    }

    .ventaja p[b-es7mau1c7d] {
        margin: 0;
        font-size: 0.95rem;
        line-height: 1.5;
    }

/* Responsive */
@media screen and (max-width: 960px) {
    .ventajas-grid[b-es7mau1c7d] {
        grid-template-columns: 1fr;
    }

    .ventaja[b-es7mau1c7d] {
        flex-direction: column;
    }

        .ventaja .icon[b-es7mau1c7d] {
            width: 100%;
            justify-content: center;
        }
}
/* _content/PMCWEB/Components/Shared/NotificationComponent.razor.rz.scp.css */
.notification-container[b-5rp61e7yy5] {
    display: flex;
    align-items: flex-start;
    padding: 15px 20px;
    margin-bottom: 15px;
    border: 1px solid transparent;
    border-radius: 6px;
    font-size: 14px;
    line-height: 1.5;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    animation: slideIn-b-5rp61e7yy5 0.3s ease-out;
}

.notification-content[b-5rp61e7yy5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.notification-title[b-5rp61e7yy5] {
    font-weight: 600;
    margin-bottom: 4px;
}

.notification-message[b-5rp61e7yy5] {
    margin: 0;
}

.notification-close[b-5rp61e7yy5] {
    background: none;
    border: none;
    font-size: 18px;
    font-weight: bold;
    line-height: 1;
    color: inherit;
    opacity: 0.7;
    cursor: pointer;
    padding: 0;
    margin-left: 15px;
    transition: opacity 0.2s ease;
}

.notification-close:hover[b-5rp61e7yy5] {
    opacity: 1;
}

.notification-success[b-5rp61e7yy5] {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.notification-error[b-5rp61e7yy5] {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

.notification-warning[b-5rp61e7yy5] {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeaa7;
}

.notification-info[b-5rp61e7yy5] {
    color: #0c5460;
    background-color: #bee5eb;
    border-color: #abdde5;
}

@keyframes slideIn-b-5rp61e7yy5 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 768px) {
    .notification-container[b-5rp61e7yy5] {
        padding: 12px 15px;
        font-size: 13px;
    }

    .notification-close[b-5rp61e7yy5] {
        margin-left: 10px;
    }
}
/* _content/PMCWEB/Components/Shared/UserAccountMenu.razor.rz.scp.css */
/* ============================================
   USER ACCOUNT MENU - Diseño basado en Figma
   ============================================ */

/* Overlay oscuro de fondo */
.user-menu-overlay[b-kb2j99nqwf] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9998;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

/* Mostrar overlay cuando el menú está visible */
.user-account-menu.show ~ .user-menu-overlay[b-kb2j99nqwf],
.user-menu-overlay:has(+ .user-account-menu.show)[b-kb2j99nqwf] {
    opacity: 1;
    pointer-events: auto;
}

/* Contenedor principal del menú */
.user-account-menu[b-kb2j99nqwf] {
    position: fixed;
    top: 0;
    right: -700px; /* Oculto fuera de la pantalla a la derecha */
    height: 100vh;
    width: 629px; /* 381px contenido + 124px padding horizontal x2 */
    background-color: #FFFFFF;
    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25);
    border-radius: 15px 0 0 15px; /* ✅ Border radius en IZQUIERDA (top-left, bottom-left) */
    padding: 40px 124px 80px 124px;
    z-index: 9999;
    overflow-y: auto;
    transition: right 0.3s ease;
    display: flex;
    flex-direction: column;
    gap: 61px;
}

/* Estado visible del menú */
.user-account-menu.show[b-kb2j99nqwf] {
    right: 0;
}

/* ============================================
   HEADER DEL MENÚ
   ============================================ */

.user-menu-header[b-kb2j99nqwf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 381px;
    flex-shrink: 0;
}

/* Título "Mi Cuenta" */
.user-menu-title[b-kb2j99nqwf] {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 48px;
    font-weight: 400;
    line-height: normal;
    color: #2D2E2E;
    margin: 0;
    white-space: nowrap;
}

/* Botón cerrar (X) */
.user-menu-close[b-kb2j99nqwf] {
    width: 24px;
    height: 24px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.user-menu-close span[b-kb2j99nqwf] {
    font-size: 32px;
    line-height: 1;
    color: #2D2E2E;
    font-weight: 300;
}

.user-menu-close:hover span[b-kb2j99nqwf] {
    color: #000000;
}

/* ============================================
   LISTA DE OPCIONES
   ============================================ */

.user-menu-list[b-kb2j99nqwf] {
    display: flex;
    flex-direction: column;
    width: 381px;
    flex-shrink: 0;
}

/* Items del menú */
.user-menu-item[b-kb2j99nqwf] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px 0;
    border-bottom: 1px solid #E0E0E0;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0.5px;
    color: #2D2E2E;
    text-decoration: none;
    cursor: pointer;
    background: none;
    border-left: none;
    border-right: none;
    border-top: none;
    width: 100%;
    text-align: left;
    white-space: nowrap;
    transition: color 0.2s ease, background-color 0.2s ease;
}

/* Hover effect */
.user-menu-item:hover[b-kb2j99nqwf] {
    color: #000000;
    background-color: #F5F5F5;
    padding-left: 10px;
}

/* Botón de Cerrar Sesión (último item, sin border-bottom) */
.user-menu-logout[b-kb2j99nqwf] {
    border-bottom: none;
    color: #dc3545; /* Rojo para destacar */
    font-weight: 600;
}

.user-menu-logout:hover[b-kb2j99nqwf] {
    color: #a71d2a;
    background-color: #ffe5e5;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */

/* Tablet (< 900px) */
@media (max-width: 900px) {
    .user-account-menu[b-kb2j99nqwf] {
        width: 500px;
        padding: 30px 60px 60px 60px;
    }

    .user-menu-header[b-kb2j99nqwf],
    .user-menu-list[b-kb2j99nqwf] {
        width: 100%;
    }

    .user-menu-title[b-kb2j99nqwf] {
        font-size: 36px;
    }
}

/* Mobile (< 600px) */
@media (max-width: 600px) {
    .user-account-menu[b-kb2j99nqwf] {
        width: 100%;
        max-width: 400px;
        padding: 30px 30px 60px 30px;
        border-radius: 15px 0 0 15px;
    }

    .user-menu-header[b-kb2j99nqwf],
    .user-menu-list[b-kb2j99nqwf] {
        width: 100%;
    }

    .user-menu-title[b-kb2j99nqwf] {
        font-size: 32px;
    }

    .user-menu-item[b-kb2j99nqwf] {
        font-size: 14px;
    }
}

/* Mobile muy pequeño (< 400px) */
@media (max-width: 400px) {
    .user-account-menu[b-kb2j99nqwf] {
        width: 100vw;
        border-radius: 0;
    }
}
