/* ============================================================
   legacy.css - Estilos Específicos INDESmed
   Mobile-First con media queries
   Estilos específicos temporales pendientes de migración
   
   NOTA: La mayoría de estilos ya han sido migrados a archivos específicos:
   - Home → /estilos/home.css
   - Categorías → /estilos/categorias.css
   - Producto → /estilos/product.css
   - Cesta → /estilos/cesta.css
   - Checkout → /estilos/checkout.css
   - Blog → /estilos/blog.css
   - Contacto → /estilos/contacto.css
   - Legal pages → /estilos/legal-pages.css
   
   Este archivo contiene solo estilos pendientes de migración o específicos
   que aún no tienen archivo dedicado.
   
   Última limpieza: 2024 - Reorganizado y limpiado comentarios redundantes
   ============================================================ */

/* ===== 1. ESTILOS DE /es/practicas-universitarias.php (BECARIOS) ===== */
/* NOTA: Estos estilos pertenecen a /es/practicas-universitarias.php
   TEMPORAL: Movidos desde categorias.css
   DESTINO FUTURO: Archivo específico para practicas-universitarias.php o about-us.css */

/* Imagen categoría TEAM */
img.categorias_TEAM_320x320 {
    display: block;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #005da5;
    padding: 4px;
    height: auto;
    width: 75%;
    border-radius: 10px;
}

#primeraFilaEquipo {
    display: flex;
    justify-content: center;
}

/* Estructura de becarios */
.filaBecarios {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2em;
    margin-top: 2em;
    margin-bottom: 3em;
}

.columnaBecario {
    flex: 0 0 30%;
    max-width: 320px;
    text-align: center;
}

.columnaBecario h2.Team {
    font-size: 1.2em;
    font-weight: bold;
    margin-top: 0.5em;
}

.columnaBecario p.cargoTeam {
    font-size: 0.95em;
    line-height: 1.4;
    color: #444;
    padding: 0 0.5em;
}

.categorias_TEAM_320x320 {
    width: 100%;
    max-width: 320px;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.15);
    transition: transform 0.2s ease-in-out;
}

.categorias_TEAM_320x320:hover {
    transform: scale(1.03);
}

/* Universidades colaboradoras */
.universidadesContainer {
    background-color: #f5f5f5;
    border-left: 4px solid #02478c;
    padding: 2em;
    margin-top: 3em;
    border-radius: 8px;
}

.universidadesContainer h2 {
    font-size: 1.4em;
    margin-bottom: 0.5em;
}

.universidadesContainer ul.listaUniversidades {
    list-style-type: disc;
    margin-left: 1.5em;
    margin-bottom: 1em;
    color: #222;
}

.universidadesContainer p {
    font-size: 0.95em;
    color: #444;
}

/* Instrucciones de contacto */
.instruccionesPracticas {
    background-color: #e8f2ff;
    border-left: 4px solid #0070c0;
    padding: 2em;
    margin-top: 3em;
    margin-bottom: 4em;
    border-radius: 8px;
}

.instruccionesPracticas h2 {
    font-size: 1.4em;
    margin-bottom: 0.5em;
}

.instruccionesPracticas p {
    font-size: 0.95em;
    color: #333;
    line-height: 1.5;
}

/* Responsive para becarios */
@media screen and (max-width: 900px) {
    .filaBecarios {
        flex-direction: column;
        align-items: center;
    }

    .columnaBecario {
        flex: 0 0 90%;
        max-width: 100%;
    }
}

/* ===== 2. ESTILOS ESPECÍFICOS DE CATEGORÍAS ===== */
/* NOTA: La mayoría de estilos de categorías migrados a /estilos/categorias.css (2024) */
/* Estos estilos son específicos de categorías individuales y aún están en uso */

/* Estilos específicos de categorías individuales */
#muletasBastonesH1_div {
    position: relative;
    float: left;
    top: 0px;
    max-width: 980px;
    height: auto;
    background-color: transparent;
    margin: 5px;
    text-align: left;
    display: none;
}

#accesoriosH1_div {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: auto;
    background-color: transparent;
    display: none;
}

/* ===== 3. ESTILOS GENÉRICOS DE TABLAS ===== */
/* NOTA: Estilos específicos de cesta y checkout migrados a /estilos/cesta.css y /estilos/checkout.css (2024) */
/* Estos estilos son genéricos de tablas y se usan en múltiples contextos (no solo cesta/checkout) */
table.socks {
    background-color: transparent;
    border: 1px solid #0000;
    text-align: left;
    width: 100%;
}

table.crutches {
    background-color: #dfe1e3;
    border: 2px solid #6b5e4f;
    text-align: left;
    margin-top: 10px;
    margin-bottom: 10px;
}

table.producto {
    background-color: transparent;
    border: none;
    text-align: left;
    table-layout: fixed;
    width: 100%;
    margin: auto;
    margin: 30px 0;
}

table.caracteristicas {
    background-color: transparent;
    border: none;
    text-align: left;
    table-layout: fixed;
    width: 100%;
}

table.distribuidores {
    background-color: transparent;
    border: 1px solid #0000;
    text-align: left;
    width: 100%;
}

/* Estilos genéricos de filas de tabla (no específicos de cesta/checkout) */
tr.filaDatos {
    background-color: transparent;
    text-align: left;
    font-family: 'Ubuntu', 'VERDANA';
    margin: 0px;
    font-weight: normal;
    font-size: 11pt;
}

tr.filaDatos td {
    padding: 10px 0;
}

tr.filaOculto {
    display: none;
}

tr.filaVisible {
    display: table-row;
}

tr.empresa {
    background-color: #f3f5f4;
    border: 1px solid #ada9a5;
    text-align: center;
    font-family: 'Ubuntu', 'VERDANA';
    margin: 5px;
    font-weight: normal;
    font-size: 12pt;
}

tr.encabezado {
    background-color: #02478c;
    border: 1px solid #ada9a5;
    text-align: left;
    font-family: 'Ubuntu', 'VERDANA';
    margin: 5px;
    font-weight: normal;
    font-size: medium;
    text-transform: uppercase;
    color: white;
}

tr.encabezado td {
    background-color: white;
    color: #736861;
}

td.encabezado {
    padding: 10px;
    text-align: left;
}

tr.filaCar {
    background-color: transparent;
    text-align: left;
    font-family: 'Ubuntu', 'VERDANA';
    margin: 5px;
    font-weight: normal;
    font-size: 10pt;
}

tr.precio {
    background-color: transparent;
    text-align: left;
    font-family: 'Ubuntu', 'VERDANA';
    margin: 5px;
    font-weight: normal;
    font-size: 12pt;
}

tr.paisEnvio {
    height: 50px;
}

tr.tiempoEnvio {
    height: 30px;
    font-size: 9pt;
    text-align: left;
    color: #02478c;
    font-family: 'Ubuntu', 'VERDANA';
}

.td1 {
    color: #736861;
    font-size: larger;
}

table.empresa {
    background-color: grey;
    border: 1px solid white;
    border-spacing: 1px;
    text-align: center;
}

table.form {
    background-color: grey;
    border: 1px solid grey;
}

tr.form_f {
    background-color: grey;
    border: 1px solid grey;
}

td.form_c {
    background-color: grey;
    border: 1px solid grey;
}

/* ===== 4. ESTILOS ESPECÍFICOS DE MENÚ PRODUCTOS (Mobile First) ===== */

#menu_productos_div {
    position: relative;
    left: 0px;
    top: 0px;
    width: auto;
    height: 300px;
    margin: 0px;
    display: none;
    position: absolute;
    left: 0px;
    top: 125px;
    width: 840px;
    height: 20px;
    margin: 5px;
}

#menu_productosBamboo_div {
    position: relative;
    left: 0px;
    top: 220px;
    width: auto;
    height: 35px;
    margin: 0px;
    position: relative;
    left: 0px;
    top: 140px;
    width: 250px;
    height: 35px;
    margin: 5px;
}

#menu_productos1,
#menu_productos2,
#menu_productos3,
#menu_productos4,
#menu_productos5,
#menu_productos6,
#menu_productos7,
#menu_productos8 {
    position: relative;
    left: 0px;
    top: 0px;
    width: 100%;
    text-align: center;
    height: auto;
    margin: 0px;
    padding: 2px;
    float: left;
    top: 10px;
    width: auto;
    height: 30px;
    margin: 5px;
}

#menu_productos1.menu_select,
#menu_productos7.menu_select,
#menu_productos8.menu_select,
#menu_productos2.menu_select {
    background-image: url(images/menu_select.jpg);
}

#menu_productos1:hover,
#menu_productos7:hover,
#menu_productos8:hover,
#menu_productos2:hover {
    background-image: url(images/menu_hover.jpg);
}

#menu_productos3.menu_select,
#menu_productos4.menu_select,
#menu_productos5.menu_select,
#menu_productos6.menu_select {
    background-image: url(images/menu_select.jpg);
}

#menu_productos3:hover,
#menu_productos4:hover,
#menu_productos5:hover,
#menu_productos6:hover {
    background-image: url(images/menu_hover.jpg);
}

#submenu2 {
    position: absolute;
    left: 225px;
    top: 15px;
    height: auto;
    width: 200px;
    text-align: left;
}

#menu1.con_solapa,
#menu2.con_solapa,
#menu3.con_solapa,
#menu4.con_solapa,
#menu5.con_solapa,
#menu6.con_solapa,
#menu7.con_solapa,
#menu8.con_solapa,
#menu10.con_solapa {
    border-bottom: 4px solid #a2a2a2;
}

h5.submenu {
    margin-left: 40px;
    font-size: 9pt;
}

/* ===== 5. ESTILOS ESPECÍFICOS DE ABOUT US / EQUIPO (Mobile First) ===== */

h2.Team {
    font-family: 'Ubuntu', 'VERDANA';
    font-weight: normal;
    margin: 30px 25px 10px 30px;
    color: #02478c;
    font-size: 13pt;
    text-align: center;
    text-transform: uppercase;
}

p.cargoTeam {
    font-family: 'Ubuntu', 'VERDANA';
    margin: 0 20px 30px 20px;
    font-weight: normal;
    font-size: 10pt;
    text-align: center;
    font-style: italic;
}

p.fraseGuay {
    font-family: 'Ubuntu', 'VERDANA';
    margin: 30px 30px 0 30px;
    font-weight: normal;
    font-size: 12pt;
    text-align: center;
}

p.email-equipo {
    font-family: 'Ubuntu', 'VERDANA';
    margin: 30px 30px 0 30px;
    font-weight: normal;
    font-size: 12pt;
    text-align: center;
    color: slategrey;
}

/* ===== 6. ESTILOS ESPECÍFICOS DE CONTACTO ===== */
/* NOTA: La mayoría de estilos de contacto migrados a /estilos/contacto.css (2024) */
/* Este estilo (#div_distribuidores) es específico y aún está en uso */

#div_distribuidores {
    color: #423D3D;
    background-color: transparent;
    position: relative;
    float: left;
    top: 0px;
    height: auto;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
    left: 0px;
    top: 0px;
    height: 400px;
    width: auto;
    display: block;
    margin: 0px;
}

/* ===== 7. ESTILOS ESPECÍFICOS DE AYUDA (Mobile First) ===== */

#ayuda_div {
    position: relative;
    left: 0px;
    top: 0px;
    max-width: 980px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    background-color: transparent;
    text-align: left;
    color: #423D3D;
    width: auto;
    margin: 0px;
}

/* ===== 8. ESTILOS ESPECÍFICOS DE FOOTER POR PÁGINA (Mobile First) ===== */
/* NOTA: Algunos estilos de footer específicos por página */
/* #pie.productos: estilos legacy eliminados en favor de layout moderno en estilos.css */
/* #pie.contacto: Estilos migrados a /estilos/contacto.css */
/* #pie.checkout1: Estilos migrados a /estilos/checkout.css */

#pie.ayuda {
    position: relative;
    left: 0px;
    top: 150px;
    bottom: -150px;
}

/* Estilos legacy de checkout - mantener temporalmente para compatibilidad */
#pie.checkout {
    left: 0px;
    top: 0px;
}

/* NOTA: #pie.checkout1 migrado a /estilos/checkout.css - ya no necesario aquí */
/* Estilos legacy de checkout2 y checkout3 - mantener temporalmente */
#pie.checkout2 {
    margin-left: 0px;
    bottom: 0px;
    left: 0px;
    top: 0px;
}

#pie.checkout3 {
    position: relative;
    left: 0px;
    top: 10px;
    display: inline-block;
}

#pie.blog {
    position: relative;
    top: 150px;
}

#pie.muletas_bastones {
    position: relative;
    float: left;
    top: 20px;
    display: inline-block;
    position: relative;
    left: 0px;
    top: 0px;
}

#pie.muletas_accesorios {
    position: relative;
    top: 20px;
    display: inline-block;
    position: relative;
    left: 0px;
    top: 0px;
}

#pie.andadores {
    position: relative;
    top: 20px;
    display: inline-block;
}

/* ===== 9. ESTILOS ESPECÍFICOS VARIOS (Mobile First) ===== */

/* Estilos de breadcrumbs (usado en menuIdiomas.php) */
.two {
    font-family: 'Verdana', 'VERDANA';
    font-size: 14px;
    padding: 5px 0px 5px 0px;
    margin-bottom: 3px;
    display: inline-block;
    width: 98%;
    height: 30px;
}

/* Estilos de listas anidadas */
ul.nivel1 {
    list-style-type: none;
    padding-left: 0em;
}

ul.nivel2 {
    list-style-type: none;
    padding-left: 1.0em;
}

ul li:focus ul,
ul li:active ul,
ul li a:active ul {
    display: block;
}

ul li ul {
    display: none;
}

/* Estilos de reordenamiento de header (usado en home) */
#arriba_home.reorder #miCuenta_div {
    order: 1;
}

#arriba_home.reorder #contenedor_logo_div {
    order: 2;
}

#arriba_home.reorder #menus_bloque2_div {
    order: 4;
}

#arriba_home.reorder #menus_div {
    order: 3;
}

/* ===== 10. TABLA COMPARATIVA CATEGORÍAS (Mobile First) ===== */

.tablaComparativa_PC {
    display: none;
}

.tablaComparativa_mobile {
    display: inherit;
}

table#tablaComparativa {
    border-collapse: collapse;
}

td.tablaComparativa-bajo {
    background-color: #ffffff;
    border-color: #ffffff;
}

td.tablaComparativa-bajo-2 {
    border-color: #ffffff;
    border-bottom-color: #cccccc;
}

td.tablaComparativa-medio {
    background-color: #ffffff;
    color: #02478c;
}

td.tablaComparativa-alto {
    background-color: #0e92c6;
}

td.tablaComparativa-a {
    background-color: #ffffff;
    text-transform: uppercase;
    font-weight: 600;
    font-size: smaller;
    border-style: solid;
    border-color: #cccccc;
    border-width: 1px;
}

td.tablaComparativa-a-grey {
    background-color: #f9f9f9;
    text-transform: uppercase;
    font-weight: 600;
    font-size: smaller;
}

td.tablaComparativa-b {
    background-color: #ffffff;
    font-size: smaller;
    color: #736861;
    font-family: "ubuntu";
    border-style: solid;
    border-color: #cccccc;
    border-width: 1px;
}

td.tablaComparativa-b-grey {
    background-color: #f9f9f9;
    font-size: smaller;
    color: #736861;
    font-family: "ubuntu";
    border-style: solid;
    border-color: #cccccc;
    border-width: 1px;
}

td.tablaComparativa-c {
    background-color: #ffffff;
    color: #736861;
}

td.tablaComparativa-d {
    background-color: #f9f9f9;
    font-size: large;
    font-weight: 500;
    color: #0e92c6;
}

td.tablaComparativa-aaa {
    background-color: #ffffff;
    border-color: #ffffff;
}

td.tablaComparativa-bbb {
    background-color: #fff64f;
}

td.tablaComparativa-ccc {
    background-color: #ffff00;
}

thead.tablaComparativa-cabecera {
    background-color: #fff;
}

thead.tablaComparativa-cabecera tr td {
    font-size: large;
    font-weight: bold;
    border-bottom-color: #cccccc;
    font-family: "ubuntu";
    padding: 15px;
    text-align: center;
}

thead.tablaComparativa-cabecera tr.tablaComparativa-fila-A td.bajo-3 {
    border-bottom-color: #ffffff;
}

tfoot.tablaComparativa-pie tr td {
    font-size: 18px;
    font-weight: bold;
    font-family: "ubuntu";
    padding: 2px;
}

tbody.tablaComparativa-cuerpo tr td {
    text-align: center;
    padding: 10px;
    font-family: "ubuntu";
    border-style: solid;
    border-color: #cccccc;
    border-width: 1px;
}

tr.tablaComparatica-fila-A td.tablaComparativa-baja-3 {
    border-bottom-color: white;
}

tr.tablaComparatica-fila-A td.tablaComparativa-a {
    border-style: solid;
    border-color: #cccccc;
    border-width: 1px;
}

.tablaComparativa-button {
    background-color: #02478c;
    border: none;
    font-family: "ubuntu";
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;
    display: block;
    margin: 10px auto;
}

.tablaComparativa-button:hover {
    background-color: #0e92c6;
}

.tablaComparativa-nombre {
    font-weight: 900;
    color: #02478c;
}

.table-mov,
.table-mov * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.table-mov {
    float: left;
    margin-left: 116px;
    position: relative;
    width: calc(100% - 116px);
}

.table-mov table {
    border-collapse: collapse;
}

.table-mov .table-mov-sticky {
    position: relative;
    width: 116px;
    float: left;
    margin-left: -116px;
}

.table-mov .table-mov-scroll {
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    width: 100% !important;
    margin-left: -3px;
}

.table-mov table tr {
    height: 160px !important;
}

.table-mov table th {
    border-style: solid;
    border: none;
    border-color: #cccccc;
    border-width: 1px;
    background-color: white;
    color: #000;
    text-align: center;
    padding: 10px;
    font-family: "ubuntu";
    vertical-align: bottom;
}

.table-mov table td {
    border: 1px solid #aaa;
}

.table-mov .table-mov-sticky table td {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 160px;
    overflow: hidden;
    border: none;
}

.table-mov .table-mov-scroll table td {
    text-align: center;
    padding: 10px;
    font-family: "ubuntu";
}

.table-mov .table-mov-sticky table td > img {
    width: auto;
    height: 80px;
    border-radius: 10px;
}

.table-mov .table-mov-sticky table td > button {
    font-weight: bolder;
    background-color: #02478c;
    border: none;
    font-family: "ubuntu";
    color: white;
    padding: 5px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;
    display: block;
    margin: 10px;
}

/* ===== 11. MEDIA QUERIES (Desktop - min-width: 841px) ===== */
@media (min-width: 841px) {
    
    /* Categorías - Desktop Overrides */
    /* NOTA: Estilos de categorías migrados a /estilos/categorias.css (2024) */
    /* Esta sección eliminada - todos los estilos están en categorias.css */
    
    #muletasBastonesH1_div {
        display: block;
    }
    
    #accesoriosH1_div {
        display: block;
    }
    
    /* NOTA: Estilos de producto, cesta y checkout migrados a archivos específicos (2024) */
    
    /* Menú Productos - Desktop Overrides */
    #menu_productos_div {
        position: absolute;
        left: 0px;
        top: 125px;
        width: 840px;
        height: 20px;
        margin: 5px;
        display: block;
    }
    
    #menu_productosBamboo_div {
        position: relative;
        left: 0px;
        top: 140px;
        width: 250px;
        height: 35px;
        margin: 5px;
    }
    
    #menu_productos1,
    #menu_productos2,
    #menu_productos3,
    #menu_productos4,
    #menu_productos5,
    #menu_productos6,
    #menu_productos7,
    #menu_productos8 {
        float: left;
        top: 10px;
        width: auto;
        height: 30px;
        margin: 5px;
    }
    
    /* Tabla Comparativa - Desktop Overrides */
    .tablaComparativa_PC {
        display: inherit;
    }
    
    .tablaComparativa_mobile {
        display: none;
    }
    
    /* Contacto - Desktop Overrides */
    /* NOTA: La mayoría de estilos de contacto migrados a /estilos/contacto.css (2024) */
    
    #div_distribuidores {
        max-width: 980px;
    }
    
    /* Footer - Desktop Overrides */
    #pie.ayuda {
        position: relative;
        left: 0px;
        top: 150px;
    }
    
    /* Footer - Desktop Overrides */
    /* NOTA: #pie.productos: estilos legacy eliminados en favor de layout moderno en estilos.css */
    /* NOTA: #pie.checkout1: Estilos migrados a /estilos/checkout.css */
    
    #pie.checkout3 {
        position: relative;
        left: 0px;
        top: 10px;
        display: inline-block;
    }
    
    #pie.muletas_bastones {
        position: relative;
        float: left;
        top: 20px;
        display: inline-block;
    }
    
    #pie.muletas_accesorios {
        position: relative;
        top: 20px;
        display: inline-block;
    }
    
    #pie.andadores {
        position: relative;
        top: 20px;
        display: inline-block;
    }
    
}