/* ==========================================================================
   tutrabajo-responsive-ajustes.css — CUSTOM: responsive 03-11 (documento
   «Cambios responsive tuTrabajo», 10/11/2026, jeferson)

   Ajustes puntuales del documento, uno por bloque y con su número. Se carga en
   layouts/app.blade.php DESPUÉS de tutrabajo-visor-ofertas.css y ANTES de
   tutrabajo-min13.css (que garantiza el mínimo de 13px y debe ir la última).
   Mismo prefijo de peso que min13 para ganar a los <style> de cada vista.
   ========================================================================== */

/* --- 03 · Inicio · bloque de los 3 pasos ---------------------------------
   - Títulos de paso: interlineado 36px -> 26px (el aire entre líneas baja de
     16px a 6px, menos de la mitad). Se aplica a todos los títulos para que las
     dos columnas sigan iguales; el margen inferior conserva la separación con
     el texto de debajo.
   - Botón «Más información»: 24px de separación con el texto del paso 3
     (antes 0). */
html body:not(#tt13a):not(#tt13b) .tt-howitworks .tt-step strong {
    line-height: 26px !important;
    margin-bottom: 6px !important;
}
html body:not(#tt13a):not(#tt13b) .tt-howitworks .tt-howitworks__more {
    margin-top: 24px !important;
}

/* --- 05 · Perfil público del candidato · botón «Volver al panel» ----------
   Solo cuando el candidato ve SU perfil (la barra .tt157-actions contiene el
   botón de volver). Cuando la ve una empresa, esa barra lleva el estado y las
   acciones de la candidatura y no se toca.
   - Fuera la caja blanca con borde que lo envolvía.
   - Botón verde de la marca (el de .tt-btn--primary), sin sombra, a su ancho. */
html body:not(#tt13a):not(#tt13b) .candidate-profile-page .tt157-actions:has(> .tt-back-candidate-panel) {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}
html body:not(#tt13a):not(#tt13b) .candidate-profile-page .tt157-actions .tt-back-candidate-panel {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: auto !important;
    flex: 0 0 auto !important;
    padding: 11px 22px !important;
    background: #24C022 !important;
    border: 1px solid #24C022 !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    color: #FFFFFF !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
}
html body:not(#tt13a):not(#tt13b) .candidate-profile-page .tt157-actions .tt-back-candidate-panel i {
    color: #FFFFFF !important;
}
html body:not(#tt13a):not(#tt13b) .candidate-profile-page .tt157-actions .tt-back-candidate-panel:hover,
html body:not(#tt13a):not(#tt13b) .candidate-profile-page .tt157-actions .tt-back-candidate-panel:focus-visible {
    background: #14A313 !important;
    border-color: #14A313 !important;
    color: #FFFFFF !important;
}

/* --- 06 · Descargar CV · el avatar se pegaba arriba y había franja blanca --
   La «franja blanca» era el margen superior del avatar (22px en móvil), que
   se salía por encima del bloque verde porque este no tenía relleno arriba.
   El relleno pasa al bloque verde y el avatar se queda sin margen: el verde
   empieza en el borde de la tarjeta y el avatar tiene 22px de verde encima.
   Solo móvil (en escritorio el CV se pinta como tabla de 800px y no ocurre). */
@media (max-width: 767px) {
    html body:not(#tt13a):not(#tt13b) .tt-resume-preview > table > tbody > tr > td[bgcolor="#24C022"]:first-child {
        padding-top: 22px !important;
    }
    html body:not(#tt13a):not(#tt13b) .tt-resume-preview td[bgcolor="#24C022"] .usercvimg {
        margin-top: 0 !important;
    }
}
