* { box-sizing: border-box; }
.brand-logo { width: 36px; height: 36px; object-fit: contain; flex-shrink: 0; }
.company-logo { max-width: 160px; max-height: 120px; object-fit: contain; }
.mobile-header strong { overflow-wrap: anywhere; min-width: 0; }
.mobile-header button { flex-shrink: 0; }
.app-brand { flex-direction: column; text-align: center; overflow-wrap: anywhere; }
.app-sidebar { overflow-wrap: anywhere; }
main { min-width: 0; padding-bottom: 2rem; }
button, a, input, select, textarea { touch-action: manipulation; }
button, nav a, .action { min-height: 44px; }
button:disabled { opacity: .5; cursor: not-allowed; }
:focus-visible { outline: 3px solid #d64752; outline-offset: 3px; }
p, td, main h1, main h3 { overflow-wrap: anywhere; }
.action { display: inline-flex; align-items: center; padding: .5rem .75rem; color: #af1723; font-weight: 600; }
.danger { color: #a52b24; }
.editor { max-width: 680px; margin: 1rem auto; padding: 1.25rem; background: white; border: 1px solid #e1e4df; border-radius: 16px; }
.editor label { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1rem; }
.editor input, .editor select, .editor textarea { width: 100%; border: 1px solid #cdd4cf; border-radius: 8px; padding: .7rem; }
.primary { background: #af1723; color: white; padding: .75rem 1rem; border-radius: 8px; }
.mobile-header { display: none; }
div[id^="modal-"] { padding: 1rem; z-index: 60; overflow-y: auto; }
[id^="modal-"] > div { max-width: 100%; max-height: calc(100dvh - 2rem); overflow-y: auto; }
#toast { max-width: calc(100vw - 2rem); z-index: 100; }
@media (max-width: 1023px) {
 div.app-layout { display: block; }
 .mobile-header { display: flex; align-items: center; justify-content: space-between; padding: .5rem 1rem; background: white; border-bottom: 1px solid #e1e4df; }
 aside.app-sidebar { display: none; width: 100%; }
 aside.app-sidebar.is-open { display: flex; }
 main .px-8 { padding-left: 1rem; padding-right: 1rem; }
 main .grid-cols-4 { grid-template-columns: repeat(2,minmax(0,1fr)); }
 main .grid-cols-3, main .grid-cols-2 { grid-template-columns: minmax(0,1fr); }
 main .col-span-2, main .col-span-3 { grid-column: auto; }
 main .flex.items-center, #timeline .flex { flex-wrap: wrap; gap: .5rem; }
 main .pt-7 { padding-top: 1.25rem; }
 input:not([type=radio]):not([type=checkbox]), select, textarea { font-size: 16px !important; min-height: 44px; }
 table, tbody { display: block; width: 100%; }
 thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
 tbody tr { display: block; padding: .75rem; border-bottom: 1px solid #dce1dc; }
 tbody td { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; padding: .35rem .25rem !important; }
 tbody td::before { content: attr(data-label); font-size: 12px; color: #5c6560; min-width: 110px; }
 tbody td[data-label="Acciones"]::before { width: 100%; }
 .editor { margin: 1rem; }
}
