/* Shared layout corrections; business logic, permissions and routes are unchanged. */
html { -webkit-text-size-adjust: 100%; }
body { height: 100vh; height: 100dvh; margin: 0; }
#appContainer { min-height: 0; height: 92vh; height: 92dvh; overflow-y: auto; }
.workspace-shell { display: flex; flex: 1; min-height: 0; width: 100%; }
.workspace-shell #sidebar { width: 16rem; min-height: 0; }
#sidebar > div, #sidebar nav { min-height: 0; }
#sidebar > div > :first-child, #sidebar > div > :last-child { flex-shrink: 0; }
#main-content, #chief-panel-content { min-width: 0; min-height: 0; }
.navigation-open #main-content { isolation: isolate; z-index: 0; }
#main-content .flex > *, #main-content .grid > * { min-width: 0; }
.mobile-workspace-header, .workspace-menu-backdrop { display: none; }
#appContainer img, #appContainer video { max-width: 100%; }
#appContainer :is(p, dd, h1, h2, h3, h4, label, a) { overflow-wrap: anywhere; }
#appContainer :is(.prose, .ql-editor) table { display: block; max-width: 100%; overflow-x: auto; }
.auth-layout { flex: 1 0 auto; padding: 1.5rem; }

@media (max-width: 1279px) {
    .certification-layout { flex-direction: column; height: auto; min-height: 100%; overflow: visible; }
    .certification-layout .certification-phases { width: 100%; height: auto; }
    .certification-phases > .overflow-y-auto { max-height: 16rem; flex: auto; }
    .certification-layout .certification-body { height: auto; overflow: visible; flex: auto; }
}

@media (max-width: 1023px) {
    #appContainer { width: 100%; height: 100vh; height: 100dvh; max-width: none; border: 0; border-radius: 0; }
    .workspace-shell { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); position: relative; }
    .mobile-workspace-header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-shrink: 0; padding: max(.5rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) .5rem max(1rem, env(safe-area-inset-left)); background: #0f172a; border-bottom: 1px solid #334155; z-index: 40; }
    .mobile-workspace-header span { font-size: .875rem; font-weight: 700; text-align: right; }
    #workspace-menu-toggle { min-height: 44px; padding: .5rem .75rem; border: 1px solid #475569; border-radius: .5rem; white-space: nowrap; }
    .workspace-shell #sidebar { position: absolute; grid-row: 2; grid-column: 1; top: 0; bottom: 0; left: 0; width: min(20rem, 88%); visibility: hidden; transform: translateX(-100%); z-index: 35; padding-bottom: env(safe-area-inset-bottom); }
    .navigation-open #sidebar { visibility: visible; transform: none; }
    .workspace-menu-backdrop:not([hidden]) { display: block; position: absolute; grid-row: 2; grid-column: 1; inset: 0; background: #0008; z-index: 30; }
    #main-content { padding: 1rem; padding-bottom: max(1rem, env(safe-area-inset-bottom)); scroll-padding-bottom: 2rem; -webkit-overflow-scrolling: touch; }
    #main-content.p-0 { padding: 0; }
    #cert-content-area, #chief-panel-content { padding: 1rem; }
    #main-content > .h-full:has(#chief-panel-content) { height: auto; min-height: 100%; }
    #chief-panel-content { flex: auto; overflow: visible; }
    #appContainer .fixed.inset-0 { padding: max(.75rem, env(safe-area-inset-top)) max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left)); overflow-y: auto; }
    #appContainer .fixed.inset-0 > :is(div, form) { max-width: 100%; max-height: calc(100dvh - 2rem); overflow-y: auto; margin-top: auto; margin-bottom: auto; }
    #appContainer input:not([type="checkbox"]):not([type="radio"]), #appContainer select, #appContainer textarea, .ql-editor { font-size: 16px; }
    #appContainer button, #appContainer .action-button { min-height: 44px; }
    #appContainer input[type="checkbox"]:not(.sr-only), #appContainer input[type="radio"]:not(.sr-only) { width: 1.25rem; height: 1.25rem; flex-shrink: 0; display: inline-block; }
    #verification-container { width: 100%; padding: 1rem; margin-top: 1rem; }
    #main-content table { display: block; width: 100%; max-width: 100%; overflow-x: auto; }
    #main-content .ql-toolbar { white-space: normal; }
    #main-content .ql-container { max-width: 100%; }
    #main-content iframe { max-width: 100%; }
}

@media (max-width: 639px) {
    .auth-layout { padding: 1rem; min-height: 100%; }
    .login-card { padding: 1.5rem 1rem; border-radius: 20px; }
    .login-card .py-8 { padding-top: 1rem; padding-bottom: 1rem; }
    h1.workspace-title { font-size: 2.25rem; }
    #main-content .grid.grid-cols-2, #main-content .grid.grid-cols-3, #main-content .grid.grid-cols-4 { grid-template-columns: minmax(0, 1fr); }
    #main-content .flex.justify-between { flex-wrap: wrap; gap: .75rem; }
    #main-content :is(.p-8, .p-10, .p-12) { padding: 1rem; }
    #main-content .text-4xl { font-size: 1.875rem; line-height: 1.2; }
    #main-content .text-3xl { font-size: 1.5rem; line-height: 1.25; }
    #chief-nav-bar { gap: .5rem; }
    #chief-nav-bar button { flex: 1 1 auto; }
}
