.row{ margin-left:0 !important; margin-right:0 !important; }
/*.col-md-12{ padding-left:0 !important; padding-right:0 !important; }*/
.container-fluid{ padding-left:0 !important; padding-right:0 !important; }
.prod-action{ padding-bottom: 0; width:100%; display:flex; justify-content:center; }
.emptyBox5 {
    display: block;
    width: 100%;
    height: 5px;
    overflow: hidden;
}
.emptyBox10 {
    display: block;
    width: 100%;
    height: 10px;
    overflow: hidden;
}
.emptyBox15 {
    display: block;
    width: 100%;
    height: 15px;
    overflow: hidden;
}
.emptyBox20 {
    display: block;
    width: 100%;
    height: 20px;
    overflow: hidden;
}
.emptyBox25 {
    display: block;
    width: 100%;
    height: 25px;
    overflow: hidden;
}
.wdt100 { width: 100% !important; }

.line-separator-green {
    width:25px;
    text-align:left;
    border-top:3px solid #70d44a;
    margin:5px auto 15px 0;
}

#menuspace_desktop{
    overflow: visible;
    position: relative;
    z-index: 999999 !important;
}
#menuspace_desktop .navbar{
    background-color:#E11D2E !important;
    border:none !important;
    min-height:80px !important;
    height:80px !important;
    padding:0 !important;
    margin:0 !important;
    border-bottom-left-radius:20px !important;
    border-bottom-right-radius:20px !important;
    overflow: visible;
}
#menuspace_desktop .dropdown-menu{
    max-height: 320px;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

#menuspace_desktop .dropdown-menu a{
    white-space: normal;
}



/* ancla el dropdown al li */
#menuspace_desktop .navbar-nav > li.dropdown{
    position: relative !important;
}

/* posiciona el menu abajo del item */
#menuspace_desktop .navbar-nav > li.dropdown > .dropdown-menu{
    display: none;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    min-width: 220px;
    z-index: 999999 !important;
    background: #fff !important;
    border: 1px solid #ddd !important;
}

/* hover = muestra */
#menuspace_desktop .navbar-nav > li.dropdown:hover > .dropdown-menu{
    display: block !important;
}


#menuspace_desktop .navbar,
#menuspace_desktop .container-fluid,
#menuspace_desktop #navbar_categorias,
#menuspace_desktop .navbar-collapse{
    overflow: visible !important;
}
.navbar-nav .dropdown:hover > .dropdown-menu{
    display:block;
}
.navbar-nav .dropdown:hover > a{
    background-color:rgba(0,0,0,0.05);
}
#navbar_categorias .navbar-nav{
    float:none !important;
    width:100%;
    height:80px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:20px;
    padding:0 !important;
    margin:0 !important;
}
#navbar_categorias .icono-accesorios{
    width:60px !important;
    height:60px !important;
    object-fit:contain;
}
#navbar_categorias .navbar-nav > li{
    float:none !important;
}
#navbar_categorias a.menu-icon-link{
    color:#FFFFFF !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
    gap:1px !important;
}
#navbar_categorias img.icono-linea{
    width:36px !important;
    height:36px !important;
    object-fit:contain !important;
    display:block;
}
#navbar_categorias .dropdown-menu{
    max-height: 320px;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
.top-actions-wrap{
    display:flex;
    justify-content:flex-end;

}
.top-actions-btn{
    border:none;
    background:transparent;
    cursor:pointer;
    padding:6px 10px;
    border-radius:12px;
}
.top-actions-btn:hover{ background:rgba(0,0,0,0.06); }
.top-actions-panel{
    display:none;
    position:absolute;

    top: calc(100% + 6px);
    right: 0;
    left: auto;
    width: 260px;
    max-width: 260px;

    background:#fff;
    border:1px solid #e6e6e6;
    border-radius:12px;
    box-shadow:0 10px 18px rgba(0,0,0,0.12);
    padding:12px 14px;
    z-index:99999;
}
.top-actions-panel.open{ display:block; }



.top-action-item:hover{
    background: rgba(0,0,0,0.06);
}



.cats-bg{
    position: relative;
    width: 100%;
    padding: 40px 0;
    overflow: hidden;
    background-image: url("../img/Background_categorias_lapiz.JPG");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.cats-bg::after{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,.85);
    pointer-events: none;
    z-index: 0;
}
.cats-bg > .container{
    position: relative;
    z-index: 1;
}


.pe-blockui
{
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%);
    padding: 25px;
}

@keyframes blink {
    0%   { opacity: 0.2; transform: scale(0.95); }
    50%  { opacity: 1; transform: scale(1.05); }
    100% { opacity: 0.2; transform: scale(0.95); }
}

.ms-disabled{
    display: none !important;
}

#menuspace_mobile .navbar-header{
    display:none !important;   /* quita el boton hamburguesa */
}

#menuspace_mobile #navbar_categorias_movil{
    display:none !important;   /* quita el collapse de categorias */
}

.logos-full{
    width: 100%;
    padding: 0;
    margin: 0;
}
.logos-full-inner{
    width: 100vw;                  /* 100% del viewport */
    margin-left: calc(50% - 50vw); /* rompe el container y centra */
    margin-right: calc(50% - 50vw);
    padding: 0;
    padding-left: 44px;
    padding-right: 44px;
}
.logos-full,
.logos-full-inner,
.logos-carousel,
.logos-full .carousel,
.logos-full .flickity-viewport,
.logos-full .flickity-slider,
.logos-full .carousel-cell {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}
/*Style Card*/
.cardorange {border-bottom: 4px solid #DB2D2E!important; border-radius:12px!important; box-shadow: 0 2px 18px 0 rgba(0, 0, 0, 0.3)!important;}

.productos-grid{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:18px;
    padding:10px 0;
}
.productos-item{
    flex: 0 0 calc(16.666% - 18px); /* 100/6 = 16.666% */
    max-width: calc(16.666% - 18px);
}
.prod-card{
    background:#fff;
    border-radius:28px;
    border:1px solid rgba(0,0,0,.12);
    box-shadow:0 2px 10px rgba(0, 0, 0, .4);
    padding:12px 12px 14px;
    text-align:center;
    position:relative;
    display:flex;
    flex-direction:column;
    align-items:center;
}
.prod-imgbox{
    width:100%;
    height:150px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:10px;
}
.prod-imgbox img{
    max-width:120px;
    max-height:150px;
    width:auto;
    height:auto;
    display:block;
}

/* =======================================================================
   VISTA DE PRODUCTOS (CATALOGO) - PRODUCT CARDS (REPLICA)
   ======================================================================= */

/*Style Card*/
.cat-cardorange {
    border-bottom: 4px solid #DB2D2E!important;
    border-radius:12px!important;
    box-shadow: 0 2px 18px 0 rgba(0, 0, 0, 0.3)!important;
}

.cat-productos-grid{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:18px;
    padding:10px 0;
}
.cat-productos-item{
    flex: 0 0 calc(16.666% - 18px); /* 100/6 = 16.666% */
    max-width: calc(16.666% - 18px);
}
.cat-prod-card{
    background:#fff;
    border-radius:28px;
    border:1px solid rgba(0,0,0,.12);
    box-shadow:0 2px 10px rgba(0, 0, 0, .4);
    padding:12px 12px 14px;
    text-align:center;
    position:relative;
    display:flex;
    flex-direction:column;
    align-items:center;
}
.cat-prod-imgbox{
    width:100%;
    height:150px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:10px;
}
.cat-prod-imgbox img{
    max-width:120px;
    max-height:150px;
    width:auto;
    height:auto;
    display:block;
}
.cat-productos-item{
    flex: 0 0 calc(25% - 18px);
    max-width: calc(25% - 18px);
}

/* Precio */
.cat-prod-price{
    font-weight: 800;
    font-size: 15px;
    color: #ff7a00;
    margin-top: 6px;
}

/* Empuja el botón al fondo */
.cat-prod-spacer{
    flex-grow: 1;
}

/* Contenedor del botón */
.cat-prod-action{
    width:100%;
    display:flex;
    justify-content:center;
    margin-top: 10px;
}

/* Botón carrito (estilo similar al de tu screenshot) */
.cat-btn-add-cart{
    background: linear-gradient(90deg, #fcbf49 0%, #d62828 100%) !important;
    border:0 !important;
    font-size: 13px;!important;
    border-radius:12px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    min-height: 30px !important;
    font-weight:700 !important;
    color:#fff !important;
    box-shadow:none !important;
    white-space: nowrap !important;     /* no salto de linea */
    overflow: hidden !important;        /* no crece, recorta */
    text-overflow: ellipsis !important; /* ... */
    max-width: 100% !important;         /* se queda dentro del card */
    padding-left: 10px !important;      /* ajusta a tu gusto */
    padding-right: 10px !important;
    line-height: 1.1 !important;
    margin-bottom:20px;
}
.cat-btn-add-cart:hover{
    filter: brightness(0.98);
    transform: translateY(-1px);
}


.btnAddCart-Busqueda{
    background: linear-gradient(90deg, #fcbf49 0%, #d62828 100%) !important;
    border:0 !important;
    font-size: 12px;!important;
    border-radius:12px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    min-height: 30px !important;
    font-weight:700 !important;
    color:#fff !important;
    box-shadow:none !important;
    white-space: nowrap !important;     /* no salto de linea */
    overflow: hidden !important;        /* no crece, recorta */
    text-overflow: ellipsis !important; /* ... */
    max-width: 100% !important;         /* se queda dentro del card */
    padding-left: 0 !important;
    padding-right: 0 !important;
    line-height: 1.1 !important;
    margin-bottom:20px;
}
.btnAddCart-Busqueda:hover{
    filter: brightness(0.98);
    transform: translateY(-1px);
}

/* Responsivo mínimo (opcional pero recomendado) */
@media (max-width: 992px){
    .cat-productos-item{ flex:0 0 calc(33.333% - 18px); max-width: calc(33.333% - 18px); }
}
@media (max-width: 768px){
    .cat-productos-item{ flex:0 0 calc(50% - 18px); max-width: calc(50% - 18px); }
}
@media (max-width: 480px){
    .cat-productos-item{ flex:0 0 100%; max-width: 100%; }
}
/*------------------------------  Login ---------------------------------------------*/
.login-section {
    height: 100vh;
    background-image: url('../../resources/img/inicio_sesion.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;
    align-items: center;
}

/*------------------------------  LOST PASSWORD  ---------------------------------------------*/
.lostPassword-section {
    height: 100vh;
    background-image: url('../../resources/img/inicio_sesion.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;
    align-items: center;
}
.lostPassword-overlay {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}


.lostPassword-card {
    width: 420px;
    padding: 40px;
    border-radius: 20px;

    background: rgb(0 0 0 / 73%);
    /*backdrop-filter: blur(15px);*/
    /*-webkit-backdrop-filter: blur(15px);*/

    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    color: white;
}

/* Capa centradora */
.login-overlay {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Card con efecto blur */
.login-card {
    width: 420px;
    padding: 40px;
    border-radius: 20px;

    background: rgb(0 0 0 / 73%);
    /*backdrop-filter: blur(15px);*/
    /*-webkit-backdrop-filter: blur(15px);*/

    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    color: white;
}

.login-card .form-control {
    background: rgba(255, 255, 255, 0.25);
    border: none;
    color: white;
}
.botones-inicio-recuperacion {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.panel-recuperar {
    margin-top: 18px;
    border-radius: 16px !important;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.18) !important;
}



.panel-recuperar .ui-panel-titlebar {
    display: none !important;
}


.panel-recuperar .ui-panel-content {
    background: #34343414;
    border: none !important;
    padding: 20px !important;
    color: #000000 !important;
}


.panel-recuperar .ui-outputlabel,
.panel-recuperar .ui-outputtext,
.panel-recuperar span,
.panel-recuperar label {
    color: #000000 !important;
}


.panel-recuperar input[type="text"],
.panel-recuperar input[type="password"],
.panel-recuperar .ui-inputfield {
    width: 100% !important;
    margin-top: 8px;
    margin-bottom: 12px;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    border: 1px solid #000000 !important;
    background: #d9d9d9 !important;
    color: #000000 !important;
    box-shadow: none !important;
}

.panel-recuperar input[type="text"]:focus,
.panel-recuperar input[type="password"]:focus,
.panel-recuperar .ui-inputfield:focus {
    border: 1px solid #000000 !important;
    background: #d9d9d9 !important;
    color: #000000 !important;
    outline: none !important;
    box-shadow: none !important;
}

.btn-reenviar-codigo{
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-top: 6px !important;
    margin-bottom: 6px !important;
    min-width: auto !important;
}

.btn-reenviar-codigo .ui-button-text{
    color: #0d6efd !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.btn-reenviar-codigo:hover .ui-button-text{
    color: #0a58ca !important;
}

.btn-reenviar-codigo.ui-state-disabled .ui-button-text{
    color: #9e9e9e !important;
}
.panel-recuperar .ui-button,
.panel-recuperar .boton-blanco {
    margin-top: 8px;
    width: 100%;
}
/*------------------------------  LoginEnd ---------------------------------------------*/

/*------------------------------  Menu Principal ---------------------------------------------*/
.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    border: 1px solid #ccc;
    min-width: 180px;
    margin:0!important;
    z-index: 1000;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.2);
}
.submenu-group .submenu.submenu-frenado-scroll {
    max-height: 380px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding-right: 4px;
}
.dropdown:hover .dropdown-menu {
    display: block;
}
.submenu-group {
    position: relative;
}

.submenu-label {
    padding: 8px 14px;
    font-weight: bold;
    font-size: 13px;
    color: #333;
    background-color: #f0f0f0;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.submenu-label::after {
    content: "▶";
    font-size: 10px;
    color: #888;
}

.submenu-label:hover {
    background-color: #dce8f5;
    color: #1d6fa4;
}

/* Submenú en cascada */
.submenu {
    display: none;
    position: absolute;
    top: 0;
    left: 100%;
    background-color: #fff;
    border: 1px solid #ccc;
    min-width: 180px;
    z-index: 1001;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.2);
}

.submenu-group:hover .submenu {
    display: block;
}

/* Items individuales */
.menu-item {
    padding: 7px 14px;
    font-size: 13px;
    color: #333;
    cursor: pointer;
    white-space: nowrap;
}

.menu-item:hover {
    background-color: #dce8f5;
    color: #1d6fa4;
}

.menu-container {
    display: inline-block;
    padding: 5px;
}

/*------------------------------  Menu PrincipalEnd ---------------------------------------------*/


.divnaranja {background-color: #d87c34; padding: 15px 0 5px 43px;border-radius: 0 72px 0 71px;}
.divverdeazul {background-color: #0a9396; padding: 15px 0 5px 43px;border-radius: 0 72px 0 71px;}
.divazul {background-color: #10538c; padding: 15px 0 5px 43px;border-radius: 0 72px 0 71px;}
.divmorado{background-color: #660da9; padding: 15px 0 5px 43px;border-radius: 0 72px 0 71px;}
.divverde{background-color: #556c20; padding: 15px 0 5px 43px;border-radius: 0 72px 0 71px;}

.divtitulos{  color: #eaedd4;  background-color: #004a6e; padding: 15px 0 5px 43px; border-radius: 0 72px 0 71px;}
.divtitulos2{  color: #eaedd4;  background-color: #004a6e; padding: 5px 0 5px 43px; border-radius: 0 72px 0 71px;}


/*------------------------------  SelectOneMenu Inicio ---------------------------------------------*/
.select-calido.ui-selectonemenu { background: #f5f1ea; border: 1px solid #d6cfc4; border-radius: 8px; box-shadow: none; transition: all 0.2s ease; }
.select-calido .ui-selectonemenu-label { color: #3e3e3e; font-weight: 600; }
.select-calido .ui-selectonemenu-trigger { background: #e8e2d8; border-left: 1px solid #d6cfc4; border-radius: 0 8px 8px 0; }
.select-calido.ui-selectonemenu:hover { border-color: #c8bfb3; box-shadow: 0 2px 6px rgba(0,0,0,0.08); }
.ui-selectonemenu-panel { border-radius: 10px; border: 1px solid #ddd6c8; box-shadow: 0 6px 18px rgba(0,0,0,0.12); }
.ui-selectonemenu-panel .ui-selectonemenu-item { background: #ffffff; color: #3e3e3e; padding: 8px 12px; }
.ui-selectonemenu-panel .ui-selectonemenu-item.ui-state-highlight { background: #f3ece3; color: #000; }
/*------------------------------  SelectOneMenu End ---------------------------------------------*/

.borde_abajo{ border-bottom: 1px solid #b12a09; }

.tarjetas-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 15px;
}
.vehiculo-card {
    background: white;
    border-radius: 10px;
    padding: 15px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    border-left: 5px solid #ffbb9f;
}

.vehiculo-card p {
    margin: 5px 0;
}