/* Portal del trabajador (plan FJ, FJ3): /fichar. Páginas estáticas con su propio marco (PortalTrabajadorLayout). Global
   porque lo comparten todas las páginas del portal y la tabla de jornadas, que son componentes distintos. */

.pt-tarjeta {
    background: #fff;
    border: 1px solid #e3e7ef;
    border-radius: 14px;
    padding: 22px 24px;
    margin-bottom: 18px;
    box-shadow: 0 1px 2px rgba(20, 30, 60, .04);
}

.pt-h1 { font-size: 1.4rem; margin: 0 0 6px; color: #1f2a44; }
.pt-h2 { font-size: 1.1rem; margin: 0 0 12px; color: #1f2a44; }
.pt-lema { color: #5b6478; margin: 4px 0 16px; }

.pt-form { display: flex; flex-direction: column; gap: 12px; max-width: 360px; }
.pt-filtro { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 16px; }
.pt-campo { display: flex; flex-direction: column; gap: 4px; font-size: .9rem; color: #3d4659; }
.pt-campo input { border: 1px solid #cfd5e2; border-radius: 8px; padding: 8px 10px; font-size: 1rem; }

.pt-boton {
    border: 1px solid #cfd5e2;
    background: #fff;
    border-radius: 10px;
    padding: 10px 18px;
    font-size: 1rem;
    cursor: pointer;
}
.pt-boton--primario { background: #2f5fd0; border-color: #2f5fd0; color: #fff; }

.pt-acciones { display: flex; gap: 12px; flex-wrap: wrap; margin: 16px 0; }
.pt-acciones .pt-boton { min-width: 180px; padding: 14px 20px; font-size: 1.05rem; }

.pt-estado { font-size: 1.1rem; font-weight: 500; padding: 10px 14px; border-radius: 10px; }
.pt-estado--fuera { background: #f1f3f8; color: #3d4659; }
.pt-estado--dentro { background: #e7f6ec; color: #1d6b39; }
.pt-estado--descanso { background: #fff5e0; color: #8a5a00; }

.pt-cifras { display: flex; gap: 24px; flex-wrap: wrap; margin-top: 8px; }
.pt-cifras div { display: flex; flex-direction: column; }
.pt-cifras strong { font-size: 1.4rem; color: #1f2a44; }
.pt-cifras span { color: #5b6478; font-size: .85rem; }

.pt-error { color: #b42318; background: #fdecea; border-radius: 8px; padding: 8px 12px; }
.pt-hecho { color: #1d6b39; background: #e7f6ec; border-radius: 8px; padding: 8px 12px; }
.pt-pin { font-size: 2.4rem; letter-spacing: .4em; font-weight: 700; color: #1f2a44; margin: 8px 0; }
.pt-enlace { display: inline-block; margin-top: 14px; color: #2f5fd0; }

.pt-tabla { width: 100%; border-collapse: collapse; font-size: .92rem; }
.pt-tabla th { text-align: left; color: #5b6478; font-weight: 500; border-bottom: 1px solid #e3e7ef; padding: 6px 8px; }
.pt-tabla td { border-bottom: 1px solid #f0f2f7; padding: 6px 8px; }
.pt-anulada td { color: #98a1b3; text-decoration: line-through; }
.pt-marcas { white-space: nowrap; }
.pt-chip { display: inline-block; font-size: .75rem; background: #f1f3f8; border-radius: 999px; padding: 1px 8px; margin-right: 4px; }
.pt-chip--aviso { background: #fff5e0; color: #8a5a00; }

/* FJ5: las ausencias (formulario más ancho, desplegables y comentario, acciones pequeñas por fila). Los desplegables toman su
   aspecto de desplegables.css: aquí solo el borde y el alto. */
.pt-form--ancho { max-width: 560px; }
.pt-campo select, .pt-campo textarea {
    border: 1px solid #cfd5e2; border-radius: 8px; padding: 8px 10px; font-size: 1rem; font-family: inherit;
}
.pt-campo textarea { resize: vertical; }
.pt-boton--pequeno { padding: 5px 10px; font-size: .85rem; }
.pt-en-linea { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: 4px 0; }
.pt-en-linea input { border: 1px solid #cfd5e2; border-radius: 8px; padding: 5px 8px; font-size: .85rem; min-width: 140px; }
.pt-tabla small { color: #5b6478; }
/* FJ6: incidencias y peticiones del portal. */
.pt-campo select, .pt-campo textarea { border: 1px solid #cfd5e2; border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 1rem; }
.pt-incidencia { border-top: 1px solid #eef1f6; padding: 12px 0; }
.pt-incidencia-cabecera { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.pt-texto { margin: 6px 0; white-space: pre-wrap; }