.parte-save-status { position: sticky; top: 0; z-index: 2; padding: 10px 12px; margin-bottom: 12px; background: #edf7ee; border: 1px solid #9ec9a4; border-radius: 5px; color: #153d1e; font-size: 15px; }
.parte-save-status:not([data-state="error"]) { display: none; }
.parte-save-status[data-state="pending"] { background: #fff6d9; border-color: #d6b450; color: #5c4500; }
.parte-save-status[data-state="error"] { background: #ffeded; border-color: #ce8181; color: #751c1c; }
.parte-save-status button { margin: 6px 8px 0 0; padding: 6px 10px; cursor: pointer; }
#renew-session { max-width: 440px; padding: 24px; border: 1px solid #888; border-radius: 8px; }
#renew-session input { margin: 8px 0; max-width: 100%; }
#renew-session::backdrop { background: #0008; }
.parte-pdf-button { padding: 9px 16px; border: 1px solid #267da4; background: #fff; color: #155371; border-radius: 5px; cursor: pointer; font: inherit; }
.parte-pdf-button[hidden] { display: none; }
.parte-pdf-dialog { width: min(620px, calc(100vw - 32px)); max-height: 85vh; box-sizing: border-box; overflow: auto; border: 1px solid #75a8bc; border-radius: 8px; padding: 24px; color: #20303a; font: 16px Arial, sans-serif; }
.parte-pdf-dialog::backdrop { background: #0008; }
.parte-pdf-dialog h2 { margin-top: 0; color: #155371; }
.parte-pdf-dialog label { display: flex; gap: 8px; align-items: flex-start; margin: 10px 0; overflow-wrap: anywhere; }
.parte-pdf-dialog input { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; }
.parte-pdf-dialog fieldset { margin: 16px 0; border: 1px solid #b7cdd7; border-radius: 5px; min-width: 0; }
.parte-pdf-dialog legend { font-weight: bold; }
.parte-pdf-dialog .pdf-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px; }
.parte-pdf-dialog button { padding: 10px 16px; cursor: pointer; border: 1px solid #267da4; border-radius: 5px; font: inherit; }
.parte-pdf-dialog [data-action="download"] { background: #155371; color: white; }
.parte-pdf-dialog button:disabled { opacity: .6; cursor: wait; }
.parte-pdf-dialog .pdf-status { overflow-wrap: anywhere; }
.parte-with-pdf .modalFooter { flex-wrap: wrap; gap: 12px; }
.parte-pdf-dialog[open] { display: flex; flex-direction: column; overflow: hidden; }
.parte-pdf-dialog > :not(.pdf-selection) { flex-shrink: 0; }
.parte-pdf-dialog .pdf-selection { min-height: 70px; overflow-y: auto; padding-right: 4px; }

.parte-modal .modalBodyContenido > .botonGridEditable { box-sizing: border-box; }

/* Keep the part header and actions outside its single scrolling content area. */
@media (max-width: 800px), (max-height: 500px) {
    .parte-modal { top: var(--parte-viewport-top, 0px); height: min(var(--parte-viewport-height, 100dvh), calc(100dvh - var(--parte-viewport-top, 0px))); align-items: stretch; }
    .parte-modal > .modalContenido {
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        width: 100%;
        height: 100%;
        max-height: 100%;
        min-height: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        overflow: hidden;
    }
    .parte-modal .modalHeader {
        flex: 0 0 auto;
        min-height: 52px;
        box-sizing: border-box;
        padding: max(4px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 4px max(12px, env(safe-area-inset-left));
        margin: 0;
        gap: 12px;
        border-bottom: 1px solid #dbe3e8;
    }
    .parte-modal .cerrarModal {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 44px;
        height: 44px;
        flex-shrink: 0;
        scale: 1;
    }
    .parte-modal .modalBody { flex: 1 1 auto; min-height: 0; display: flex; }
    .parte-modal .modalBodyContenido {
        flex: 1 1 auto;
        box-sizing: border-box;
        width: 100%;
        min-width: 0;
        min-height: 0;
        height: auto;
        padding: 12px max(12px, env(safe-area-inset-right)) 16px max(12px, env(safe-area-inset-left));
        overscroll-behavior-y: contain;
        scroll-padding-block: 12px;
    }
    .parte-modal .modalBodyContenido > * { flex-shrink: 0; min-width: 0; max-width: 100%; box-sizing: border-box; }
    .parte-modal .modalFooter {
        flex: 0 0 auto;
        margin: 0;
        padding: 8px max(12px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
        gap: 8px;
        flex-wrap: wrap;
        background: #fff;
        border-top: 1px solid #dbe3e8;
    }
    .parte-modal .modalFooter > .modalBoton,
    .parte-modal .modalFooter > .parte-pdf-button {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1 1 auto;
        min-height: 44px;
        box-sizing: border-box;
        padding: 10px 12px;
        font-size: 16px;
        line-height: 1.25;
        text-align: center;
    }
    .parte-modal .modalFooter > .parte-pdf-button[hidden] { display: none; }
    .parte-modal .modalElemento { width: 100%; padding: 12px; margin-bottom: 16px; }
    .parte-modal .modalInputGroup { flex-direction: column; align-items: stretch; gap: 4px; width: 100%; min-width: 0; }
    .parte-modal .modalLabel { width: 100%; }
    .parte-modal .modalInputGroup input,
    .parte-modal .modalInputGroup select,
    .parte-modal .modalInputGroup textarea,
    .parte-modal .cardEditable input,
    .parte-modal .cardEditable select,
    .parte-modal .cardEditable textarea {
        box-sizing: border-box;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        min-height: 44px;
        padding: 10px;
        font: inherit;
        font-size: 16px;
        line-height: 1.35;
        border-radius: 5px;
    }
    .parte-modal textarea { resize: vertical; min-height: 108px; }
    .parte-modal .multi-btn-group { display: flex; flex-wrap: wrap; gap: 6px; }
    .parte-modal .multi-btn { min-height: 44px; margin: 0; padding: 8px 12px; font-size: 16px; }
    .parte-modal .gridCardsEditables { width: 100%; padding: 0; margin: 16px 0; }
    .parte-modal .headerGridEditable { gap: 12px; margin-bottom: 12px; }
    .parte-modal .botonGridEditable { width: 44px; height: 44px; flex-shrink: 0; }
    .parte-modal .gridEditable { width: 100%; min-width: 0; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 16px; align-items: start; }
    .parte-modal .cardEditable { box-sizing: border-box; min-width: 0; max-width: none; max-height: none; height: auto; }
    .parte-modal .cardEditableFormContainer { min-width: 0; padding: 14px; }
    .parte-modal .cardEditableFormInputs { gap: 12px; }
    .parte-modal .cardEditableFormInput { min-width: 0; }
    .parte-modal .cardEditableFormInput label { font-size: 16px; margin-bottom: 4px; }
    .parte-modal .cardEditableFechaUsuario { padding: 8px !important; overflow-wrap: anywhere; }
    .parte-modal .cardFooter { flex: 0 0 auto; gap: 12px; padding: 10px 14px; }
    .parte-modal .cardFooterEliminar,
    .parte-modal .cardFooterGuardar { box-sizing: border-box; min-height: 44px; display: flex; align-items: center; justify-content: center; padding: 10px 16px; font-size: 15px; }
    .parte-modal .cardEditableImagenContainer { height: auto; }
    .parte-modal .cardEditableImagen img { display: block; height: 240px; max-width: 100%; }
    .parte-modal .cardEditableVideoContainer { height: auto; }
    .parte-modal .cardEditableVideoContainer video { display: block; max-height: 260px; }
    .parte-modal .cardEditableArchivoContainer { gap: 10px; min-width: 0; }
    .parte-modal .cardEditableNombreArchivo { min-width: 0; overflow-wrap: anywhere; }
    .parte-modal .fichasContainer { width: 100%; grid-template-columns: minmax(0, 1fr); margin: 0 0 16px; }
    .parte-modal .ficha { grid-column: auto; width: 100%; min-width: 0; box-sizing: border-box; }
    .parte-modal .fichaCampo { display: block; overflow-wrap: anywhere; }
    .parte-modal .grid { grid-template-columns: minmax(0, 1fr); }
    .parte-modal .grid .card { grid-column: auto; min-width: 0; }
    .parte-modal .parte-save-status { width: 100%; overflow-wrap: anywhere; }
}
