:root {
    --primary-blue: #007AC0;
    --yellow: #F6B003;
    --gray: #707070;
    --light-gray: #f7f7f7;
    --bs-border-radius: 0;
    --bs-border-radius-lg: 0;
}

* {
    font-family: 'Raleway', sans-serif;
}

a.blue {
    color: var(--primary-blue);
}

@-webkit-keyframes ld {
    0%   { transform: rotate(0deg) scale(1); }
    50%  { transform: rotate(180deg) scale(1.1); }
    100% { transform: rotate(360deg) scale(1); }
}
@-moz-keyframes ld {
    0%   { transform: rotate(0deg) scale(1); }
    50%  { transform: rotate(180deg) scale(1.1); }
    100% { transform: rotate(360deg) scale(1); }
}
@-o-keyframes ld {
    0%   { transform: rotate(0deg) scale(1); }
    50%  { transform: rotate(180deg) scale(1.1); }
    100% { transform: rotate(360deg) scale(1); }
}
@keyframes ld {
    0%   { transform: rotate(0deg) scale(1); }
    50%  { transform: rotate(180deg) scale(1.1); }
    100% { transform: rotate(360deg) scale(1); }
}

.m-progress {
    position: relative;
    opacity: .8;
    color: transparent !important;
    text-shadow: none !important;
}

.m-progress:hover,
.m-progress:active,
.m-progress:focus {
    cursor: default;
    color: transparent;
    outline: none !important;
    box-shadow: none;
}

.m-progress:before {
    content: '';

    display: inline-block;

    position: absolute;
    background: transparent;
    border: 1px solid #fff;
    border-top-color: transparent;
    border-bottom-color: transparent;
    border-radius: 50%;

    box-sizing: border-box;

    top: 50%;
    left: 50%;
    margin-top: -12px;
    margin-left: -12px;

    width: 24px;
    height: 24px;

    -webkit-animation: ld 1s ease-in-out infinite;
    -moz-animation:    ld 1s ease-in-out infinite;
    -o-animation:      ld 1s ease-in-out infinite;
    animation:         ld 1s ease-in-out infinite;
}

.btn-default.m-progress:before {
    border-left-color: #333333;
    border-right-color: #333333;
}

.btn-lg.m-progress:before {
    margin-top: -16px;
    margin-left: -16px;

    width: 32px;
    height: 32px;
}

.btn-sm.m-progress:before {
    margin-top: -9px;
    margin-left: -9px;

    width: 18px;
    height: 18px;
}

.btn-xs.m-progress:before {
    margin-top: -7px;
    margin-left: -7px;

    width: 14px;
    height: 14px;
}

.visibility-hidden {
    visibility: hidden;
}

/*HOME*/
#home body {
    color: #333;
    overflow-x: hidden;
    font-size: 17px;
    line-height: 20px;
}

/* Navbar */
#home .navbar {
    background-color: white;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    padding: 0.8rem 0;
}

#home .navbar-nav .nav-link {
    color: #555;
    margin: 0 15px;
    font-weight: 600;
}

#home .navbar-nav .nav-link:hover {
    color: var(--primary-blue);
}

#home .btn-iniciar {
    background-color: var(--yellow);
    color: #333;
    padding: 8px 25px;
    border-radius: 0;
    font-weight: 700;
    border: none;
}

#home .btn-iniciar:hover {
    background-color: #e6ad06;
}

/* Hero Section */
#home .hero-section {
    background-image: url('/assets/img/home/buceo.jpg');
    background-size: cover;
    background-position: center;
    height: 450px;
    position: relative;
    overflow: hidden;
    margin-top: 113px;
}

#home .hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0, 102, 204, 0.7) 0%, rgba(0, 204, 204, 0.7) 100%);
}

#home .hero-content {
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    text-align: center;
}

#home .hero-title {
    display: none;
}

#home .hero-subtitle {
    font-size: 4rem;
    font-weight: 800;
    font-style: italic;
    margin: 0;
    letter-spacing: 1px;
}

/* Sections */
#home .section-padding {
    padding: 70px 0;
}

#home .section-title {
    color: var(--primary-blue);
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 30px;
}

#home .section-text {
    color: var(--gray);
}

#home .link-blue {
    color: var(--primary-blue);
    text-decoration: underline;
    font-weight: normal;
}

#home .link-blue:hover {
    text-decoration: underline;
}

/* Image Grid */
#home .image-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin-top: 20px;
}

#home .image-grid img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}

/* Ventajas Section */
#home .ventajas-section {
    background-color: #f7f7f7;
}

#home .ventajas-title {
    color: var(--primary-blue);
    font-size: 1.9rem;
    font-weight: 700;
    margin-bottom: 25px;
}

#home .subtitle-blue {
    color: var(--primary-blue);
    font-size: 20px;
    line-height: 24px;
    margin-top: 25px;
    margin-bottom: 15px;
}

#home .ventajas-images {
    display: flex;
    flex-direction: column;
    /*gap: 15px;*/
    height: 840px;
    object-fit: cover;
    object-position: center;
}

#home .ventajas-images .ventajas-image {
    max-height: 390px;
    object-fit: cover;
    object-position: center;
}

#home .ventajas-text {
    max-width: 600px; 
    margin-left: auto; 
    margin-right: auto;
}

/* Como Participar */
#home .participar-section {
    background-color: white;
}

#home .participar-intro {
    text-align: center;
    margin-bottom: 50px;
}

#home .icon-card {
    text-align: center;
    padding: 30px 20px;
}

/*#home .icon-card i {
    font-size: 70px;
    color: var(--primary-blue);
    margin-bottom: 25px;
}*/

#home .icon-card h4 {
    color: var(--primary-blue);
    font-size: 20px;
    line-height: 1;
    font-weight: 600;
    margin-bottom: 15px;
}

#home .icon-card p, 
#home .participar-section p {
    color: var(--gray);
    font-size: 17px;
    line-height: 20px;
}

/* Solicitar Section */
#home .solicitar-section {
    background-color: var(--primary-blue);
    color: white;
    position: relative;
    overflow: hidden;
}

#home .solicitar-image-container {
    position: relative;
    height: 100%;
    min-height: 500px;
}

#home .solicitar-bg {
    height: 100%;
    max-width: 300%;
    max-height: 640px;
}

#home .btn-solicitar-container {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 10;
    width: 100%;
    background: rgba(0,122,192,0.7);
    left: 0px;
}

#home .solicitar-content {
    position: relative;
    z-index: 2;
    max-width: 600px;
    margin: auto;
}

#home .solicitar-title {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 30px;
}

#home .solicitar-steps {
    margin-top: 30px;
    color: #FFF;
}

#home .solicitar-steps h5 {
    margin-bottom: 10px;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
}

#home .solicitar-steps p {
    margin-bottom: 25px;
}

#home a.btn-solicitar {
    padding: 12px 35px;
    border-radius: 0;
    font-weight: 700;
    border: none;
    margin-top: 20px;
    font-size: 17px;
    line-height: 20px;
    margin-bottom: 20px;
    margin-left: calc(50% - 107px);
    border: 3px solid #FFFFFF;
    color: #FFF;
}

#home a.btn-solicitar:hover {
    background-color: #f0f0f0;
    color: var(--primary-blue);
}

/* Footer */
#home .footer-section {
    background-color: #F7F7F7;
    padding: 50px 0 30px;
}

#home .footer-section .col-lg-4:nth-child(2) {
    border-right: 2px solid var(--primary-blue);
    border-left: 2px solid var(--primary-blue);
}

#home .footer-section .col-lg-4:nth-child(n+1) {
    padding: 0 25px;
}

#home .footer-logo {
    height: 68px;
    margin-top: 20px;
}

#home .footer-text {
    color: var(--gray);
}

#home p.footer-contact,
#home .footer-text a.footer-contact {
    font-weight: 600;
    text-decoration: underline;
    color: var(--gray);
}

#home .footer-bottom-wrapper {
    background-color: #f2f2f2;
    margin-top: 50px;
    padding-top: 30px;
    padding-bottom: 30px;
}

#home .footer-bottom-wrapper .footer-bottom {
    font-size: 17px;
    line-height: 20px;
    color: var(--primary-blue);
}

/* Responsive */
@media (max-width: 450px) {
    #home .hero-logo {
        width: 300px;
    }
}

@media (max-width: 767px) {
    #home body * {
        text-align: center;
    }

    #home .solicitar-bg {
        width: 100%;
        opacity: 0.2;
    }

    #home .navbar-nav {
        text-align: center;
    }

    #home .btn-iniciar {
        margin-top: 10px;
    }

    #home .btn-solicitar-container {
        position: static;
        text-align: center;
        margin-top: 30px;
    }

    #home .btn-solicitar {
        margin-left: auto;
    }

    #home .ventajas-images {
        gap: 15px;
        height: auto;
    }
}

@media (min-width: 768px) {
    #home .hero-logo {
        width: 430px;
    }
}

@media (max-width: 1024px) {
    #home #ventajas .container-fluid, 
    #home #solicitar .container-fluid {
        max-width: 720px;
    }

    #home #solicitar .solicitar-content {
        max-width: 100%;
    }

    #home .ventajas-text {
        max-width: 100%;
    }

    #home .footer-section .col-lg-4:nth-child(2) {
        border: none;
    }
}

@media (max-width: 1500) {
    #home .ventajas-images .ventajas-image {
        max-height: 100%;
    }
}

@media (min-width: 1600px) {
    #home .solicitar-bg {
        max-height: 800px;
        object-position: center;
        object-fit: none;
    }

    #home .solicitar-image-container {
        height: 100%;
        max-height: 600px;
    }
}


/*LOGIN*/

#login body {
    margin: 0;
    padding: 0;
    overflow: hidden;
    font-size: 17px;
    line-height: 20px;
    font-weight: 600;
}

#login .login-wrapper {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

#login .login-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('/assets/img/login/fondo-login.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

#login .login-container {
    position: relative;
    height: 100vh;
    display: flex;
    align-items: center;
    z-index: 2;
}

#login .login-box {
    background-color: rgba(0, 122, 192, 0.8);
    padding: 60px 50px 150px;
    border-radius: 0;
    max-width: 450px;
    width: 100%;
    margin-left: auto;
}

#login .logo-container {
    text-align: center;
    margin-bottom: 70px;
}

#login #login-form label {
    display: block;
    width: 85%;
    margin: auto;
}

#login #login-form input::placeholder {
    color: #FFF;
    opacity: 1;
}

#login #login-form .form-control {
    border: 1px solid #FFFFFF;
    background-color: transparent;
    color: #fff;
    height: 50px;
    width: 100%;
    padding: 10px;
    text-align: center;
    border-radius: 0;
}

#login #login-form .form-control:focus {
    background-color: transparent;
    border-color: white;
    color: white;
    box-shadow: none;
    outline: none;
}

#login .form-control:-webkit-autofill,
#login .form-control:-webkit-autofill:hover,
#login .form-control:-webkit-autofill:focus {
    -webkit-text-fill-color: white;
    -webkit-box-shadow: 0 0 0px 1000px rgba(0, 122, 192, 0.8) inset;
    transition: background-color 5000s ease-in-out 0s;
}

#login #login-form #login-form-submit {
    background-color: white;
    color: #007AC0;
    border: 1px solid #FFF;
    padding: 11px;
    font-size: 17px;
    font-weight: 600;
    text-transform: capitalize;
    text-align: center;
    width: 85%;
    margin: auto;
    line-height: 1.5;
}

#login #login-form #login-form-submit:hover {
    background-color: #f0f0f0;
    color: #007AC0;
    cursor: pointer;
}

#login .message-box {
    text-align: center;
    margin-top: 10px;
    color: #fff;
    opacity: 0;
    transition: 0.5s all;
}

#login .message-box i {
    font-size: 25px;
}

/* Responsive */
@media (max-width: 767px) {
    #login .login-box {
        max-width: 100%;
        margin: 0 auto;
        padding: 40px 30px 100px;
    }

    #login #login-form label {
        width: 90%;
    }

    #login #login-form #login-form-submit {
        width: 90%;
    }
}

@media (max-width: 576px) {
    #login .form-control {
        font-size: 16px;
    }

}

/*RESTO*/

body {
    margin: 0;
    padding: 0;
    font-size: 17px;
    line-height: 20px;
    font-weight: 400;
    color: var(--gray);
}

.modal .modal-dialog {
    border-radius: 0;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--primary-blue);
}


button.btn-yellow, a.btn-yellow {
    background-color: var(--yellow);
    color: #f7f7f7;
    padding: 8px 30px;
    border-radius: 0;
    font-weight: 700;
    border: none;
    cursor: pointer;
    text-decoration: none;
    margin: auto;
    display: block;
    text-align: center;
    width: fit-content;
}

button.btn-blue { /* para modal de salir sin guardar */
    background-color: var(--primary-blue);
    color: #f7f7f7;
    padding: 8px 30px;
    border-radius: 0;
    font-weight: 700;
    border: none;
    cursor: pointer;
    text-decoration: none;
    margin: auto;
    display: block;
    text-align: center;
    width: fit-content;
}

button.btn-blue:hover {
    background-color: #006DAD;
}

button.btn-yellow:hover, a.btn-yellow:hover {
    background-color: #e6ad06;
}

input[type="checkbox"],
input[type=radio] {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    border: 1px solid var(--gray);
    width: 15px;
    height: 15px;
    border-radius: 2px;
    margin: 0 5px 0 0;
    flex-shrink: 0;         /* evita que el checkbox se reduzca */
}

input[type="checkbox"]:checked,
input[type=radio]:checked,
body.formulario #formulario-col input[type="checkbox"]:checked {
    background: var(--primary-blue);
    border: 1px solid var(--primary-blue);
}

body#empresas #listado-grid input[type="checkbox"]:checked {
    background: #fff;
    border: 1px solid var(--primary-blue);
}

input[type="checkbox"]:focus,
input[type=radio]:focus{
    outline: none;
}

/*REGISTRO*/
#formulario-empresa.registro {
    background-color: #f7f7f7;
}

#formulario-empresa.registro #container-header-logos {
    background-color: #FFF;
    box-shadow: 0px -3px 6px #00000029;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}

div#form-registro-container {
    margin-top: 100px;
    padding-left: 50px;
    padding-right: 50px;
}

#formulario-empresa.registro #header-logos {
    background-color: #FFF;
}

#formulario-empresa.registro #header-logos .logo-arriba {
    height: 45px;
}

#formulario-empresa.registro #registro-submit-container {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
    background: #F7F7F7;
    box-shadow: 0px -3px 6px #00000029;
}

#formulario-empresa.registro h1 {
    font-size: 21px;
    line-height: 25px;
    font-weight: 500;

}

#formulario-empresa form#ficha-form {
    margin-bottom: 180px;
}

#formulario-empresa form#ficha-form .form-control:disabled,
#formulario-empresa .bootstrap-select .disabled .filter-option-inner-inner {
    color: #00000080; /* negro al 50% de opacidad */
    background-color: #fff;
}

#formulario-empresa .bootstrap-select .disabled {
    background: #fff;
    border: 1px solid #fff;
    opacity: 1;
}

#formulario-empresa.registro label {
    font-size: 15px;
    line-height: 18px;
    padding-bottom: 5px;
}

#formulario-empresa .bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
} 


.dropdown-item.active, 
.dropdown-item:active, 
.bootstrap-select .dropdown-menu li a.selected {
    color: #fff;
    text-decoration: none;
    background-color: var(--primary-blue);
}

button.btn.dropdown-toggle.btn-light.show {
    border: 1px solid #fff;
    background: #fff;
}

.bootstrap-select .dropdown-menu li a:hover {
    background-color: var(--primary-blue);
    color: #fff;
}

#formulario-empresa.registro #registro-submit-container button.submit-button {
    margin-right: 0;
}

body#formulario-empresa.registro #descripcion {
    height: 103px;
}

#formulario-empresa p.mini {
    font-size: 10px;
    line-height: 11px;
}

#formulario-empresa .listado-ficheros ul li {
    font-size: 12px;
    line-height: 13px;
}

#formulario-empresa .listado-ficheros i, 
#formulario-empresa .listado-imagenes i{
    color: red;
}

body.formulario input:not([type="checkbox"]), 
body.formulario select, 
body.formulario textarea, 
body.formulario .bootstrap-select,
body.formulario .bootstrap-select, .dropdown-toggle,
/*body.formulario .bootstrap-select .dropdown-menu li a,*/
select {
    /*border: 1px solid #95989A;*/
    border: 1px solid transparent;
    border-radius: 0;
    background: #fff;
    font-weight: 300;
    font-size: 13px;
    height: 30px;
    line-height: 2;
    padding-top: 2px;
    padding-bottom: 0;
}

.bootstrap-select:hover,
.bootstrap-select, .dropdown-toggle:hover,
.bootstrap-select .dropdown-toggle:hover,
.bootstrap-select .dropdown-toggle:focus {
    background-color: #fff;
    outline: 0 !important;
    border: none !important;
    border-radius: 0 !important;
}

#mailForm input, 
#mailForm select, 
#mailForm .bootstrap-select,
#mailForm .bootstrap-select .dropdown-toggle, 
#mailForm .bootstrap-select .dropdown-toggle li a,
#mailForm textarea {
    /*border: 1px solid #dee2e6;*/
    border: 1px solid transparent;
    border-radius: 0;
    background: #fff;
    font-weight: 300;
    font-size: 13px;
    height: 38px;
    line-height: 2;
    padding-top: 2px;
    padding-bottom: 0;
}


body.body-listado #localizacion-element .bootstrap-select .dropdown-toggle,
body.body-listado #nacionales-element .bootstrap-select .dropdown-toggle,
body.body-listado #internacionales-element .bootstrap-select .dropdown-toggle {
    height: 60px;
    border-radius: 0 !important;
    border: none !important;
    background-color: #fff;
    outline: 0 !important;
}

body.body-listado #localizacion-element .bootstrap-select .dropdown-toggle .filter-option-inner,
body.body-listado #nacionales-element .bootstrap-select .dropdown-toggle .filter-option-inner,
body.body-listado #internacionales-element .bootstrap-select .dropdown-toggle .filter-option-inner {
    font-size: 17px;
    line-height: 3;
    text-align: center;
}

/* Margen después del elemento "Todos" */
.bootstrap-select .dropdown-menu li.divider {
    margin-bottom: 15px;
    border-bottom: 1px solid #ddd;
}

#filtros #localizacion-ul {
    width: 60%;
    margin: auto;
}

#filtros #nacionales-ul,
#filtros #internacionales-ul {
    margin: auto;
    /* desplegable nuevo filtro */
    /*width: 30%;*/
    /**/
}

#filtros #business-ul {
    width: 80%;
    margin: auto;
}

#filtros {
    position: sticky;
    top: 80px;
    z-index: 100;
}

body.operadores #filtros, 
body.medios #filtros, 
body.bloggers #filtros {
    top: -135px;
}

#filtros #filtros-imagen {
    height: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

body.operadores #filtros #filtros-imagen,
body.medios #filtros #filtros-imagen,
body.bloggers #filtros #filtros-imagen {
    height: 216px;
}

body.operadores #filtros #filtros-imagen {
    background-image: url('/assets/img/listado/operadores.png');
}
body.medios #filtros #filtros-imagen {
    background-image: url('/assets/img/listado/medios.png');
}
body.bloggers #filtros #filtros-imagen {
    background-image: url('/assets/img/listado/bloggers.png');    
}

#filtros #filtros-imagen h1 {
    font-size: 36px;
    line-height: 42px;
    font-weight: bold;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 1100px;
    top: 50px;
}

body.operadores #filtros #filtros-imagen h1 {
    color: #F6B003;
}

body.medios #filtros  #filtros-imagen h1{
    color: #fff;
}

body.bloggers #filtros #filtros-imagen h1 {
    color: #E6523D;
}



body.registro #protocolos, body.registro #protocolos > div {
    display: none;
}

body.registro #protocolos > div img {
    vertical-align: baseline;
}

.bs-invalid {
    /* border: 1px solid red !important; */
    box-shadow: 1px 0px 2px rgba(255,0,0,0.5), -1px 0px 2px rgba(255,0,0,0.5), 0px 1px 2px rgba(255,0,0,0.5), 0px -1px 2px rgba(255,0,0,0.5);
}

#formulario-empresa.registro #instruccionesModal .modal-body {
    padding: 50px;
}
#formulario-empresa.registro #instruccionesModal h2 {
    font: normal normal bold 30px/35px Raleway;
    color: var(--primary-blue);
}

#formulario-empresa.registro #instruccionesModal p {
    font-weight: 500;
}

#formulario-empresa.registro #instruccionesModal ul li {
    margin-bottom: 5px;
}

#formulario-empresa.registro #instruccionesModal ul li::marker {
    color: var(--primary-blue);/* Cambia el color del punto */
}





/*EMPRESAS*/
body.body-listado .nav-item.dropdown {
    position: static !important;
}

body.body-listado .dropdown-menu.mega-dropdown {
display: none;
position: absolute;
top: 100%;
left: 50%;
right: auto;
width: 100vw;
margin-left: -50vw;  /* ← clave: mueve el bloque a ras del viewport */
border: none;
border-radius: 0;
background-color: var(--light-gray);
padding: 20px 0;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
transform: none !important;
z-index: 100;
}

/* Mostrar al pasar el ratón */
/*body.body-listado .nav-item.dropdown:hover > .dropdown-menu.mega-dropdown {
    display: block;
}*/

body.body-listado .nav-item.dropdown:not(.filtro-operador):hover > .dropdown-menu.mega-dropdown {
    display: block;
}

/* Prevenir hover específicamente en filtro-operador */
body.body-listado .nav-item.dropdown.filtro-operador:hover > .dropdown-menu.mega-dropdown {
    display: none !important;
}

/* Solo mostrar cuando tenga la clase .show */
body.body-listado .nav-item.dropdown.filtro-operador.show > .dropdown-menu.mega-dropdown {
    display: block !important;
}

body.body-listado .nav-item#localizacion-element.dropdown:hover > .dropdown-menu.mega-dropdown {
    min-height: 450px;
}

/*body.body-listado .nav-item#adhesion-element.dropdown:hover > .dropdown-menu.mega-dropdown,
body.body-listado .nav-item#business-element.dropdown:hover > .dropdown-menu.mega-dropdown {
    background-color: #fff;
    min-height: 300px;
}*/

body.body-listado .nav-item#nacionales-element.dropdown.show > .dropdown-menu.mega-dropdown,
body.body-listado .nav-item#internacionales-element.dropdown.show > .dropdown-menu.mega-dropdown {
    min-height: 300px;
    background-color: #fff;
    /* desplegable nuevo filtro */
    position: absolute;
    margin: auto;
}

/* desplegable nuevo filtro */
body.body-listado .nav-item#nacionales-element.dropdown.show > .dropdown-menu.mega-dropdown {
    left: 15px;
    width: 290px;
}

/* desplegable nuevo filtro */
body.body-listado .nav-item#internacionales-element.dropdown.show > .dropdown-menu.mega-dropdown {
    left: 308px;
    width: 326px;
}

/* desplegable nuevo filtro */
button#nacionales-tab, button#internacionales-tab {
    color: #fff;
    background: transparent;
    user-select: none;
    height: 100%;
}

#nacionales-ul .dropdown-menu, 
#internacionales-ul .dropdown-menu {
    border: none;
    width: 250px;
}

/* Contenido centrado dentro del mega-dropdown */
body.body-listado .mega-dropdown .container {
    /*max-width: 1140px;*/
    margin: 0 auto;
    padding: 0 15px;
}

/* desplegable nuevo filtro */
body.body-listado .nav-item#nacionales-element .mega-dropdown .container,
body.body-listado .nav-item#internacionales-element .mega-dropdown .container {
    padding: 0;
}

body.body-listado .nav-item#nacionales-element .dropdown-menu.show,
body.body-listado .nav-item#internacionales-element .dropdown-menu.show {
    /*display: block;*/
    transform: translate(0px, 0px) !important;
}

body.body-listado .nav-item.dropdown:hover,
body#estadisticas .nav-item.dropdown:hover,
body#estadisticas #filtros-listado .nav-item.dropdown.active {
    background: #008AC9;
}

body.body-listado .nav-item.dropdown.filtro-operador {
    cursor: pointer;
}
body.body-listado .nav-item.dropdown.filtro-operador.show {
    background: #008AC9;
}

body.body-listado .nav-tabs-custom .nav-item.dropdown:hover > .nav-link {
    color: #FFF;
}

body.body-listado ul.sub-nav-tabs {
    display: flex;
    justify-content: space-between; /* distribuye los botones */
    align-items: stretch;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 10px;
}

ul.sub-nav-tabs li.nav-item {
    flex: 1; /* todos los items ocupan el mismo ancho */
    text-align: center;
}

ul.sub-nav-tabs li.nav-item button.nav-link {
  width: 100%;
  height: 100%;
  padding: 12px 10px;
  background-color: #f5f5f5;
  border: none;
  cursor: pointer;
  transition: background-color 0.3s;
  white-space: normal; /* permite salto de línea en los textos largos */
}

body.body-listado .nav-tabs-custom .nav-item.dropdown:hover ul.sub-nav-tabs .nav-item .nav-link {
    color: var(--primary-blue);
    width: 100%;
    background-color: #fff;
}

body.body-listado ul.sub-nav-tabs .nav-item .nav-link {
    font-size: 16px;
    line-height: 19px;
    margin-bottom: 25px;
    height: 65px;
}

body.body-listado .sub-nav-wrapper .nav-link.active, 
#filtros #adhesion-element .nav-link.active,
#filtros #business-element .nav-link.active {
    background-color: var(--primary-blue) !important; 
    color: #FFF !important;
}

body.body-listado,
body#estadisticas {
    font-size: 17px;
    line-height: 20px;
    background-color: var(--light-gray);
    overflow-x: hidden;
}

#filtros input[type="date"] {
    font-size: 14px;
    line-height: 16px;
    color: var(--gray);
    display: block;
    width: 100%;
    height: 30px;
    margin-bottom: 5px;
    text-align: center;
}

/* Header */
header {
    padding: 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    position: fixed;
    width: 100%;
    z-index: 110;
    background: var(--light-gray);
    top: 0;
}

@media (max-width: 767px) {
    header {
        height: 85px;
    }
}

header .header-logos {
    position: absolute;
}

header .header-logos img {
    height: 45px;
}

header .header-links {
    display: flex;
    /*align-items: center;*/
    justify-content: flex-end;
}

header .header-links a {
    color: var(--primary-blue) !important;
    text-decoration: none;
    font-size: 17px;
    line-height: 20px;
    padding: 30px;
    background: transparent !important;
    border: none;
}

header .header-links > .dropdown a {
    padding-bottom: 50px;
}

header .header-links #selector-tipo ul.dropdown-menu {
    margin-top: -3px !important;
}

header .header-links #user-menu ul.dropdown-menu {
    margin-top: 37px !important;
}

header #user-menu .dropdown-toggle{
    padding: 20px;
}

header .header-links #selector-tipo ul.dropdown-menu a, 
header #user-menu ul.dropdown-menu a {
    padding: 15px;
}

header .header-links a.estadisticas {
    margin-right: 20px;
}

header .header-links a.active {
    background-color: #FFF !important;
}

header .user-circle {
    width: 40px;
    height: 40px;
    border: 2px solid var(--primary-blue);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-blue);
    font-weight: 700;
    font-size: 16px;
    overflow: hidden;
}

header #user-menu .dropdown-toggle::after {
    display: none;
}

body.esEmpresa header {
    height: 80px;
}

/* Navigation Tabs */
#filtros.nav-tabs-wrapper {
    background-color: var(--primary-blue);
    width: 100%;
    /*position: fixed;
    top: 80px;*/
    margin-top: 80px;
    z-index: 10;
}

body#estadisticas #filtros.nav-tabs-wrapper {
    height: 50px;
}

body.body-listado .nav-tabs-custom,
body#estadisticas .nav-tabs-custom {
    border: none;
}

body.body-listado ul.nav-tabs-custom > li.disabled {
    opacity: 0.3;
}

body.body-listado .nav-item.dropdown.disabled:hover > .dropdown-menu.mega-dropdown {
    display: none;
}

body.body-listado .nav-tabs-custom .nav-link, 
body#estadisticas .nav-tabs-custom .nav-link {
    background-color: transparent;
    color: white;
    border: none;
    border-radius: 0;
    padding: 15px 30px;
    font-size: 17px;
    line-height: 20px;
    cursor: pointer;
    pointer-events: none;
}

body#estadisticas .nav-tabs-custom li {
    cursor: pointer;
    height: 50px;
}

body#estadisticas .nav-tabs-custom .nav-link {
    height: auto;
    user-select: none;
}

body#estadisticas .nav-tabs-custom li#lexquisit-element .nav-link {
    padding-top: 5px;
}

body.body-listado .nav-item.dropdown {
    pointer-events: auto;
}

body.body-listado .nav-tabs-custom .nav-link::after {
    display: none;
}

body.body-listado .nav-tabs-custom .dropdown-toggle::after,
body#estadisticas .nav-tabs-custom .dropdown-toggle::after {
    display: none;
}

body.body-listado .nav-tabs-custom .nav-link:focus,
body.body-listado .nav-tabs-custom .nav-link:active {
    outline: none;
    box-shadow: none;
}

body#estadisticas #filtros 

body.body-listado .nav-tabs-custom .nav-link.show {
    background-color: white;
    color: var(--primary-blue);
}

/*body.body-listado .nav-tabs-custom .nav-link.active {
    background-color: white;
    color: var(--primary-blue);
}*/

body.body-listado #search-icon {
    background-color: transparent;
    color: white;
    border: none;
    padding: 15px 30px;
    cursor: pointer;
}

body.body-listado #search-icon:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

input#textSearch {
    display: none;
    position: absolute;
    left: 70px;
    right: 100px;
    top: 10px;
    height: 30px;
    font-size: 14px;
    line-height: 16px;
    color: #ffffff80;
    border: none;
    padding-left: 10px;
    background-color: #008AC9;
}

input#textSearch::placeholder {
    color: #ffffff80;
}

input#textSearch:focus-visible {
    outline: 0;
}

body.body-listado.search-open input#textSearch {
    display: block;
}

body.body-listado.search-open  .nav-item.dropdown {
    visibility: hidden;
}



/* Sub Navigation Tabs */
body.body-listado .sub-nav-wrapper {
    /*background-color: white;*/
    /*border-bottom: 1px solid #ddd;*/
}

body.body-listado .sub-nav-tabs {
    justify-content: center;
}

body.body-listado .sub-nav-tabs .nav-link {
    background-color: #fbfbfb;
    color: #333;
    border: none;
    border-radius: 0;
    padding: 15px 30px;
    font-size: 15px;
    cursor: pointer;
    border-bottom: 3px solid transparent;
}

body.body-listado .sub-nav-tabs .nav-link:hover {
    color: var(--primary-blue);
}

body.body-listado .sub-nav-tabs .nav-link.active, 
body.body-listado .sub-nav-tabs .nav-link:hover #areas-dropdown > div.sub-nav-wrapper > button.nav-link.active  {
    background-color: var(--primary-blue);
    color: white;
}

/* Collapse functionality */
body.body-listado .filters-collapse {
    background-color: white;
}

/* Hover para mostrar filtros */
/*body.body-listado .nav-item:hover .dropdown-menu {
    display: block;
}*/

/*body.body-listado .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    margin: 0;
    border: none;
    border-radius: 0;
    padding: 0;
}
*/
body.body-listado .dropdown-menu.show {
    display: block;
}

/* Filter Content */
body.body-listado .filter-content {
    /*background-color: white;*/
    padding: 30px;
    min-height: 300px;
}

body.body-listado .filter-columns {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    /*gap: 20px;*/
}

body.body-listado .filter-column h6 {
    color: var(--primary-blue);
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 15px;
}

body.body-listado .filter-item {
    margin-bottom: 10px;
}

body.body-listado .filter-item label {
    font-size: 14px;
    font-weight: 400;
    color: #333;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    text-align: left;
    user-select: none;
}

body.body-listado .filter-item label.sub {
    font-size: 13px;
    margin-top: 8px;
    margin-left: 20px;
}

/* Checkbox personalizado - usando tus estilos */
body.body-listado input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    border: 2px solid var(--primary-blue);
    border-radius: 0;
}

/* Results List */

.external-container {
    /*background-color: var(--light-gray);*/
    min-height: 400px;
    background: url('/assets/img/fondo.png') repeat top left 100% / cover;
    position: relative;
}

/*#external-container-listado.external-container {
    margin-top: 130px;
}

#external-container-listado.external-container.bloogers,
#external-container-listado.external-container.medios,
#external-container-listado.external-container.operadores {
    margin-top: calc(130px + 216px);
}*/

.external-container > .container {
    background-color: #fff;
    box-shadow: 0px 3px 6px #00000029;
    /*padding-top: 30px;*/
    padding-left: 50px;
    padding-right: 50px;
    min-height: calc(100vh - 130px);
}

    

body.body-listado #results-title {
    color: var(--primary-blue);
    font-size: 17px;
    line-height: 20px;
    margin-bottom: 20px;
    font-style: italic;
}


        /* Centrar correctamente el contenido de los filtros dentro del mega-dropdown */
body.body-listado .tab-content {
  /*background-color: #fff;*/
  width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
}

body.body-listado .tab-pane .filter-content {
  max-width: 1140px;
  margin: 0 auto;
}

/* Ocultar todas las pestañas de submenú y mostrar al hacer hover */
body.body-listado .sub-nav-tabs .nav-link {
  position: relative;
}

body.body-listado .tab-content .tab-pane {
  display: none;
}

/*body.body-listado .sub-nav-tabs .nav-link:hover,
body.body-listado .sub-nav-tabs .nav-link.active {
  background-color: var(--primary-blue);
  color: white;
}*/

/* Mostrar la pestaña correspondiente al hover */
body.body-listado .sub-nav-tabs .nav-link[data-bs-target]:hover ~ .tab-content .tab-pane {
  display: none;
}

/* Mostrar solo el tab-pane activo */
body.body-listado .tab-pane.active {
  display: block;
}

body.body-listado .sub-nav-wrapper .nav-item {
  position: relative;      /* crea contexto de apilamiento */
  z-index: 1100;           /* por encima de los filter-columns */
}

/* Los paneles de filtros deben quedar por debajo visualmente */
body.body-listado .sub-nav-wrapper .nav-item .filter-column {
  position: relative;
  z-index: 100;
}

/* Aseguramos que los enlaces reciban puntero */
body.body-listado .sub-nav-tabs .nav-link {
  pointer-events: auto;
}

/* Si por alguna razón hay márgenes/paddings negativos que hagan overlay,
   evita que los hijos ocupen el área del botón */
body.body-listado .sub-nav-wrapper .filter-column {
  pointer-events: auto; /* keep interactive normally */
}

/* Si necesitas visualizar solapamientos durante la depuración */
body.body-listado.debug-outline * {
  outline: 1px dashed rgba(0,0,0,0.08);
}

ul.sub-nav-tabs li.nav-item button.nav-link:hover,
ul.sub-nav-tabs li.nav-item button.nav-link.active {
  background-color: #e3e3e3;
}

/* --- Estilo de los checkboxes y etiquetas --- */
.filter-item label {
  display: flex;          /* convierte el label en contenedor flexible */
  align-items: flex-start;/* alinea checkbox y texto arriba */
  gap: 6px;               /* espacio entre checkbox y texto */
  word-wrap: break-word;  
  white-space: normal;  
}

#filtros #adhesion-element label,
#filtros #business-element label {
    font: normal normal normal 14px/16px Raleway;
    display: block;
    text-align: left;
    margin-bottom: 10px;
    color: var(--gray);
}

#filtros li#estado-element label {
    color: var(--primary-blue);
    display: block;
    margin-bottom: 10px;
}

#filtros li#estado-element .dropdown-menu.mega-dropdown {
    padding: 50px 0;
}


body.body-listado .external-container#external-container-listado .empresa-container:nth-child(even) {
    background-color: #fff;
}

body.body-listado .external-container#external-container-listado .empresa-container:nth-child(odd) {
    background-color: var(--light-gray);
}



body.body-listado .external-container#external-container-listado .empresa-container .row {
    margin: 10px 0;
}

body.body-listado .external-container#external-container-listado .empresa-container .row > div.listado-nombre, 
body.body-listado .external-container#external-container-listado .empresa-container .row > div.listado-otros-datos {
    padding-top: 6.5px;
    font-size: 15px;
    line-height: 18px;
    padding-bottom: 6.5px;
}

body.body-listado .external-container#external-container-listado .empresa-container .row input[type="checkbox"] {
    margin-left: 40px;
}

body.body-listado .external-container#external-container-listado .empresa-container .row > div.listado-nombre a {
    font-weight: 600;
    text-decoration: none;
    font-size: 17px;
    line-height: 20px;
    color: var(--primary-blue);
}

body.body-listado .external-container#external-container-listado .empresa-container .row > div.listado-otros-datos {
    border-top: 1px solid #e2e2e2;
}

body.body-listado .external-container#external-container-listado .empresa-container .row > div.listado-otros-datos span.separator {
    margin-left: 30px;
    margin-right: 30px;
}

.listado-fila-titulo .iconos img {
    height: 20px;
    width: auto;
}

body.body-listado #listado input[type="checkbox"] {
    margin-right: 20px;
}

body.body-listado #filtros-aplicados {
    justify-content: space-between;
    padding-bottom: 25px;
    font-size: 12px;
    line-height: 14px;
    font-style: italic;
    color: var(--primary-blue);
    position: sticky;
    top: 130px;
    background: #fff;
    z-index: 1;
    padding-top: 30px;
}

body.body-listado.bloggers #filtros-aplicados,
body.body-listado.medios #filtros-aplicados {
    display: none !important;
}

body.body-listado.operadores #filtros-aplicados {
    top: 131px;
}

body.body-listado #filtros-aplicados #eliminar-filtros {
    color: var(--primary-blue);
    width: max-content;
    display: block;
}

body.body-listado #results-header {
    justify-content: space-between;
    position: sticky;
    top: 199px;
    z-index: 1;
    background: #fff;
}

body.body-listado.bloggers #results-header,
body.body-listado.medios #results-header {
    top: 131px;
    padding-top: 30px;
}

body.body-listado.operadores #results-header {
    top: 200px;
}

body.body-listado #results-header #results-left-options,
body.body-listado #results-header #results-right-options {
    gap: 20px;
}

body.body-listado #results-header .separator{
    line-height: 16px;
    font-size: 14px;
    color: var(--primary-blue);
}

body.body-listado #results-header #results-right-options a {
    font-size: 14px;
    line-height: 16px;
    color: var(--primary-blue);
    text-decoration: none;
}

body.body-listado #results-header #results-left-options a {
    color: var(--primary-blue);
    text-decoration: none;
    width: 15px;
}

body.body-listado #results-header #results-left-options a:not(.active) {
    opacity: 0.3;
}

body.body-listado #results-header #results-left-options a#see-results-listado {
    width: 17px;
}
    



/** modal Enviar email **/

/*
#mailModal #creaturisme-logo-modal {
    width: 40%;
    position: absolute;
    left: -3px;
}*/

/*#mailModal h1 {
    margin-top: 50px;
    margin-bottom: 10px;
    padding-left: 0;
}*/

.modal .modal-content {
    background-color: var(--light-gray);
}

.modal .modal-content .modal-header {
    border-bottom: 0;
}

#passwordForm label, #mailForm label {
    font-size: 17px;
    line-height: 20px;
    color: var(--primary-blue);
    margin-top: 5px;
    margin-bottom: 5px;
}

#mailForm textarea {
    height: 150px;
}

#mailModal #enviadoMail, .btn-green {
    background-color: #008000;
    color: #fff; 
    padding: 8px 30px;
    border-radius: 0;
    font-weight: 700;
    border: none;
    cursor: pointer;
    text-decoration: none;
    margin: auto;
    text-align: center;
    width: fit-content;
    cursor: inherit;
    display: block;
}


/** listado rejilla **/

#listado-grid .listado-datos.card-body {
    padding-left: 15px;
    padding-right: 15px;
    background-color: var(--light-gray);
    /*border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;*/
}


#listado-grid .card .contenedor-logo {
    height: 210px;              /* Altura máxima */
    overflow: hidden;           /* Oculta lo que sobresalga */
}

#listado-grid .card .contenedor-logo img {
    width: 100%;                /* Ocupa todo el ancho */
    height: 100%;               /* Se ajusta a la altura del contenedor */
    object-fit: cover;          /* Recorta sin deformar */
    object-position: center;    /* Centra el recorte */
}

#listado-grid .listado-datos.card-body span {
    font-size: 12px;
    line-height: 15px;
    color: var(--gray);
}


.listado-fila-titulo {
    display: flex;
    align-items: center;
    justify-content: space-between; /* título a la izquierda, iconos a la derecha */
    padding: 15px;
    background-color: var(--light-gray);
    border-bottom: 1px solid #e2e2e2;
}

.listado-fila-titulo a.listado-nombre {
    font-size: 15px;
    line-height: 18px;
    font-weight: 600;
    text-decoration: none;
    color: var(--primary-blue);    
    /* Limitar el espacio y añadir puntos suspensivos */
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    flex: 1; /* ocupa todo el espacio disponible menos el de los iconos */
    margin-right: 10px; /* un pequeño margen entre el texto y los iconos */
}

#listado .iconos img,
#listado-grid .iconos img {
    height: 20px;     /* altura fija */
    width: auto;      /* mantener proporción */
}

#listado .iconos img:not(.active),
#listado-grid .iconos img:not(.active) {
    opacity: 0.3;
}

#empresas.medios #listado .iconos, 
#empresas.medios #listado-grid .iconos,
#empresas.operadores #listado .iconos, 
#empresas.operadores #listado-grid .iconos,
#empresas.bloggers #listado .iconos, 
#empresas.bloggers #listado-grid .iconos {
    display: none;
}

#listado a.editar {
    text-align: right;
    font-size: 12px;
    line-height: 14px;
    color: var(--primary-blue);
    text-decoration: none;
    padding-right: 8px;
}

#listado-grid a.editar {
    text-align: right;
    font-size: 12px;
    line-height: 14px;
    color: var(--primary-blue);
    text-decoration: none;
    position: absolute;
    right: 18px;
    bottom: 15px;
}

/** ficha empresas **/
body#formulario-empresa,
body#formulario-usuario {
    font-size: 15px;
    line-height: 18px;
    background-color: var(--light-gray);
}

.external-container > .container#contenedor-ficha {
    background-color: var(--light-gray);
    padding-top: 40px;
}

body#formulario-empresa h2,
body#formulario-usuario h2 {
    color: var(--primary-blue);
    font-size: 24px;
    line-height: 29px;
    margin-bottom: 20px;
    font-style: italic;   
    margin-top: 20px;
    margin-bottom: 20px;
}

body.noregistro #volver {
    position: absolute;
    top: 20px;
    right: 50px;
}

body.formulario.noregistro #volver img {
    width: 20px;
}

body.formulario.noregistro .external-container {
    margin-top: 80px;
}

body#formulario-empresa #descripcion {
    height: 88px;
}

body#formulario-empresa.esAdmin #descripcion {
    height: 143px;
}

body#formulario-empresa #datos-creaturisme ul,
body#formulario-empresa #datos-protocolos ul {
    margin-top: 10px;
}

body#formulario-empresa #datos-creaturisme ul li,
body#formulario-empresa #datos-protocolos ul li,
body#formulario-empresa #datos-protocolos ul li a {
    color: var(--primary-blue);
}

body#formulario-empresa #observaciones {
    height: 150px;
}

body#formulario-empresa .img-wrapper {
    width: 100%;
    height: 100px;      /* Altura fija */
    overflow: hidden;   /* Recorta lo que sobra */
    border-radius: 6px; /* Opcional */
}

body#formulario-empresa .fixed-img-container {
    width: 100%;
    height: 87px;           /* altura fija para TODAS las cajas */
    overflow: hidden;        /* oculta el recorte */
    display: flex;
    justify-content: center; 
    align-items: center;
    position: relative;
}

body#formulario-empresa #datos-imagenes .fixed-img-container {
    height: 100px;           /* altura fija para TODAS las cajas */
}

body#formulario-empresa .fixed-img-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;       /* ajusta sin deformar */
    object-position: center; /* centra la imagen */
}

body#formulario-empresa .add-wrapper {
    width: 100%;
    height: 100px; 
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    transition: 0.25s all;
    cursor: pointer;
}

body#formulario-empresa .add-wrapper:hover {
    background: #dee2e6;
}

body#formulario-empresa .add-text {
    text-decoration: none;
    font-weight: bold;
    color: var(--primary-blue); /* azul bootstrap */
    font-size: 16px;
}

body.noregistro .imagen-empresa .remove-image{
    position: absolute;
    top: 10px;
    right: 10px;
    color: red;
    z-index: 11;
}

body#formulario-empresa.blogger .fixed-img-container {
    height: 150px;           /* altura fija para TODAS las cajas */
}

.cursor-pointer {
    cursor: pointer;
}

body.noregistro button.add-button {
    border: 1px solid var(--primary-blue);
    border-radius: 3px;
    color: var(--primary-blue);
    background-color: #fff;
    display: block;
    font-size: 13px;
    line-height: 15px;
    padding: 3px 15px;
    text-decoration: underline;
}

body.noregistro #datosCreaturismeModal li.seleccion-item {
    text-align: center;
    cursor: pointer;
    color: var(--primary-blue);
    user-select: none;
}

.listado-acciones {
    list-style: none;
    padding-left: 0;
}

.listado-acciones .anyo-item {
    margin-bottom: 10px;
}

.anyo-header {
    cursor: pointer;
    display: flex;
    align-items: center;
}

.anyo-header .toggle-icon {
    margin-right: 6px;
    transition: transform 0.2s ease;
}

.anyo-item.open .toggle-icon {
    transform: rotate(90deg);
}

.acciones-por-anyo {
    margin-left: 22px;
    margin-top: 5px;
    display: none;
}

.anyo-item.open > .acciones-por-anyo {
    display: block;
}

.remove-item {
    color: red;
    margin-left: 10px;
    cursor: pointer;
}

body.noregistro footer { 
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 11;
    background: var(--primary-blue);
    box-shadow: 0px -3px 6px #00000029;
    padding-top: 15px;
    padding-bottom: 15px;
}

body.noregistro.esEmpresa footer {
    background-color: #F6B003;
}

button.btn-white, 
body.noregistro #empresa-form-submit,
body.noregistro #usuario-form-submit {
    transition: 0.25s all;
    color: var(--light-gray);
    background-color: transparent;
    padding: 13px 30px;
    border-radius: 0;
    font-weight: 600;
    font-size: 14px;
    line-height: 16px;
    border: 1px solid #fff;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    width: fit-content;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

button.btn-white:hover {
    color: var(--primary-blue) !important;
    background-color: white !important;
}

body.noregistro form#ficha-form {
    margin-bottom: 80px;
}

body.noregistro #empresa-form-submit.btn-green,
body.noregistro #usuario-form-submit.btn-green {
    background-color: #008000;
}

#menu-lateral-usuarios {
    height: 100vh;
    width: 300px;
    position: fixed;
    z-index: 100;
    background-color: #fff;
    right: -300px;
    top: 80px;
    box-shadow: -3px 0px 6px #00000029;
    padding-top: 40px;
    padding-left: 20px;
    transition: 0.5s all;
}

#menu-lateral-usuarios.open {
    right: 0;
}

#menu-lateral-usuarios a {
    font-size: 14px;
    line-height: 14px;
    color: #303030;
    display: block;
    margin-bottom: 25px;
    text-decoration: none;
}

/*#menu-lateral-usuarios #selector-tipo a {
    border: none;
    text-align: left;
    padding-left: 0;
    color: #303030;
    font-weight: 400;
    background-color: #fff;
}

#menu-lateral-usuarios #selector-tipo ul {
    border: none;
}

#menu-lateral-usuarios #selector-tipo ul li a {
    padding-left: 10px;
}

#menu-lateral-usuarios #selector-tipo ul li a:focus, 
#menu-lateral-usuarios #selector-tipo ul li a:focus-visible {
    border: none;
    outline: none !important;
}*/

#abrir-menu-lateral {
    padding-top: 28px;
    padding-bottom: 28px;
    width: 88px;
}

body#formulario-empresa.medio #observaciones {
    height: 86px;
}

@media(max-width:1199px) {
    .external-container > .container#contenedor-ficha {
        max-width: 97%;
    }
}

@media(min-width: 992px) and (max-width: 1199px) {
    body.medio .col-contenedor-medio {
        width: 533px;
    }
    body.medio .col-medio-observaciones {
        width: 351px;
    }
    body#formulario-empresa.blogger #descripcion,
    body#formulario-empresa.blogger #observaciones {
        height: 102px;
    }

    body#formulario-empresa,
    body#formulario-usuario {
        font-size: 14px;
    }
}

@media(min-width: 1200px) and (max-width: 1399px) {
    body.medio .col-contenedor-medio {
        width: 637px;
    }

    body.medio .col-medio-observaciones {
        width: 427px;
    }

    body#formulario-empresa.blogger #descripcion,
    body#formulario-empresa.blogger #observaciones {
        height: 125px;
    }
}

@media(min-width: 1400px) {
    body.medio .col-contenedor-medio {
        width: 746px;
    }

    body.medio .col-medio-observaciones {
        width: 498px;
    }

    body#formulario-empresa.blogger #descripcion {
        height: 150px;
    }
}

@media(min-width: 768px) {
    button.btn-white,
    body.noregistro #empresa-form-submit,
    body.noregistro #empresa-form-submit.btn-green,
    body.noregistro #usuario-form-submit,
    body.noregistro #usuario-form-submit.btn-green {
        margin-right: 0;
    } 
}


/*** Estadísticas ***/

body#estadisticas {
    overflow-y: hidden;
}

body#estadisticas h2 {
    font-size: 14px;
    line-height: 16px;
    display: block;
}

body#estadisticas #mapa {
    width: 100%;
    max-height: calc(100vh - 210px);
}

body#estadisticas #provincia-buttons {
    position: absolute;
    cursor: pointer;
    z-index: 1;
}

body#estadisticas button.chart-btn,
body#estadisticas button.provincia-btn {
    background: #F0F0F0;
    color: var(--gray);
    border: 1px solid #FFFFFF;
    font-size: 12px;
    line-height: 14px;
    width: 80px;
    height: 25px;
}

body#estadisticas button.chart-btn.active,
body#estadisticas button.provincia-btn.active {
    background-color: #e2e2e2;
    font-weight: 600;
}

body#estadisticas .datos-provincias#empresas-castellon {
    text-align: right;
    top: 15%;
    right: 160px;
}

body#estadisticas .datos-provincias#empresas-valencia {
    top: 47%;
    left: 160px;
}

body#estadisticas .datos-provincias#empresas-alicante {
    text-align: right;
    bottom: 12%;
    left: 140px;
}


body#estadisticas .datos-provincias .numero {
    font-size: 48px;
    line-height: 20px;
    font-weight: bold;
    margin-bottom: 14px;
}

body#estadisticas .datos-provincias.big .numero {
    font-size: 72px;
    line-height: 50px;
}

body#estadisticas .datos-provincias.big .texto {
    font-size: 18px;
    line-height: 24px;
    font-weight: bold;
}

body#estadisticas .datos-provincias#empresas-castellon .numero {
    color: var(--primary-blue);
}

body#estadisticas .datos-provincias .texto {
    font-size: 12px;
    line-height: 20px;
    color: var(--gray);
}
body#estadisticas .datos-provincias#empresas-valencia .numero {
    color: #F6B003;
}

body#estadisticas .datos-provincias#empresas-alicante .numero {
    color: #E6523D; 
}

body#estadisticas #col-datos {
    /*height: 930px;*/
    height: calc(100vh - 180px);
    max-height: 930px;
}

body#estadisticas #col-datos > div {
    margin-bottom: 40px;
}

body#estadisticas #col-datos .texto {
    color: var(--primary-blue);
    font-size: 14px;
    line-height: 16px;
}

body#estadisticas #col-datos .numero {
    color: var(--gray);
    font-size: 48px;
    line-height: 56px;
    font-weight: 600;
}

body#estadisticas #col-chart .scrollable-column {
    overflow-y: auto;
    height: calc(100vh - 190px);
}

body::-webkit-scrollbar,
body#estadisticas #col-chart .scrollable-column::-webkit-scrollbar {
  width: 5px;               /* width of the entire scrollbar */
}

body::-webkit-scrollbar-track,
body#estadisticas #col-chart .scrollable-column::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    width: 15px;        /* color of the tracking area */
}

body::-webkit-scrollbar-thumb,
body#estadisticas #col-chart .scrollable-column::-webkit-scrollbar-thumb {
  /*background-color: #9BCBE6; */   /* color of the scroll thumb */
  /*border-radius: 20px;*/       /* roundness of the scroll thumb */
  /*border: 1px solid var(--primary-blue);*/  /* creates padding around scroll thumb */
    background-color: var(--primary-blue);
    outline: 1px solid slategrey;
    border-radius: 10px;
}

body#estadisticas .chart-wrapper {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    position: relative;
    overflow: hidden;
}

/* CONTENEDOR GENERAL */
body#estadisticas .chart {
    position: relative;
}

/* GRID VERTICAL */
body#estadisticas .chart-grid {
    position: absolute;
    top: 10px;
    left: 240px;              /* ⬅️ empieza donde arrancan las barras */
    right: 0;
    bottom: 30px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    pointer-events: none;
    z-index: 1;
}

body#estadisticas .chart-grid span {
    /*border-left: 1px dashed #ddd;*/
    border-left: 1px solid var(--primary-blue)
}

body#estadisticas .chart-grid span:first-child {
    border-left: 3px solid var(--primary-blue)
}

body#estadisticas .chart-grid span:last-child {
    border-right: 2px solid var(--primary-blue)
}

/* BLOQUES */
body#estadisticas .chart-block {
    margin-bottom: 25px;
}

/*body#estadisticas .chart-block-title {
  font-weight: 600;
  margin-bottom: 10px;
}*/

body#estadisticas .chart-block-title {
    font-weight: 600;
    margin-bottom: 10px;
    width: 220px;
    font-size: 0.9rem;
    padding-right: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.chart-block-title .chevron {
    transition: transform 0.3s ease;
    font-size: 0.9rem;
}

.chart-block:not(.open) .chart-block-title .chevron i::before {
    transform: rotate(-90deg);
}


/* FILAS */
body#estadisticas .chart-row {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}

body#estadisticas .chart-row:last-child {
    margin-bottom: 20px;
}

/* ETIQUETAS */
body#estadisticas .chart-label {
    font-size: 14px;
    width: 220px;
    font-size: 0.9rem;
    padding-right: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* BARRA */
body#estadisticas .chart-bar-container {
    flex: 1;
    position: relative;
    height: 20px;
}

body#estadisticas .chart-bar {
    height: 100%;
    border-radius: 4px;
    width: 0;
    transition: width 0.9s ease;
}

body#estadisticas .chart-bar.blue {
    background: #9BCBE6;
}

body#estadisticas .chart-bar.grey {
    background: #f0f0f0;
}

/* TOOLTIP */
/*body#estadisticas .chart-bar::after {
  content: attr(data-value);
  position: absolute;
  right: -35px;
  top: -22px;
  font-size: 0.75rem;
  background: #000;
  color: #fff;
  padding: 2px 6px;
  border-radius: 4px;
  opacity: 0;
  transition: opacity 0.2s;
  white-space: nowrap;
}

body#estadisticas .chart-bar:hover::after {
  opacity: 1;
}
*/

body#estadisticas .chart-bar .chart-bar-value {
    font-size: 12px;
    text-align: right;
    padding-right: 5px;
    color: #000;
}

body#estadisticas .chart-bar.grey .chart-bar-value {
    color: #000;
}

body#estadisticas .chart-bar.blue .chart-bar-value {
    color: #fff;
}

body#estadisticas .chart-bar .chart-bar-value.absolute {
    position: absolute;
    left: 5px;
}


/* ANIMACIÓN ENTRADA */
body#estadisticas .animate .chart-bar {
    width: var(--value);
}