/*
* EDIVIC HTML/CSS Repair Layer — 2026-07-26
* Loaded last on every rendered page. This file only hardens layout,
* accessibility and responsive behaviour; it does not change business logic.
*/
*,*::before,*::after{box-sizing:border-box}
html{width:100%;max-width:100%;overflow-x:clip;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--edivic-shell-topbar-h,var(--edv-public-h,76px)) + 16px)}
body{width:100%;max-width:100%;min-width:0;margin-left:0;margin-right:0;overflow-x:clip;overflow-wrap:break-word}
body>main,main,header,footer,nav,aside,section,article,form,fieldset,.page,.page-shell,.shell,.main,.content,.container,.wrapper,.workspace,.panel,.card{min-width:0;max-width:100%}
:where(.grid,.row,.split,.columns,.layout,.hero,.hero-grid,.stats-grid,.cards-grid,.plans-grid,.form-grid,.toolbar,.actions,.section-heading,.panel-head,.card-head)>*{min-width:0}
img,video,canvas,iframe{max-width:100%;height:auto}
svg{max-width:100%}
iframe{border:0}
:where(h1,h2,h3,h4,h5,h6,p,li,dd,dt,td,th,label,small,strong,span,a,button){overflow-wrap:anywhere}
pre,code,kbd,samp{max-width:100%;overflow-wrap:normal}
pre{overflow:auto;-webkit-overflow-scrolling:touch}
button,input,select,textarea{max-width:100%;font:inherit}
button,[type="button"],[type="submit"],[role="button"]{touch-action:manipulation}
textarea{resize:vertical}
input[type="search"]{-webkit-appearance:none;appearance:none}
[hidden]{display:none!important}
/* Reusable visually-hidden text for semantic headings and labels. */
.sr-only,.visually-hidden{
position:absolute!important;
width:1px!important;
height:1px!important;
padding:0!important;
margin:-1px!important;
overflow:hidden!important;
clip:rect(0,0,0,0)!important;
white-space:nowrap!important;
border:0!important;
}
/* Keyboard focus must remain visible above glass surfaces. */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
outline:3px solid rgba(255,190,0,.72)!important;
outline-offset:3px!important;
}
/* Keep responsive data tables usable instead of forcing page-level overflow. */
.table-wrap,.table-scroll,.responsive-table,[data-table-scroll]{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
table{max-width:100%}
/* Horizontal filters and tab bars scroll inside their own region on phones. */
:where(.filter-tabs,.tabs,.tab-list,.tab-row,.category-tabs,.status-tabs,.quick-replies){
max-width:100%;
min-width:0;
overflow-x:auto;
overflow-y:hidden;
overscroll-behavior-inline:contain;
-webkit-overflow-scrolling:touch;
scrollbar-width:thin;
}
:where(.filter-tabs,.tabs,.tab-list,.tab-row,.category-tabs,.status-tabs)>*{flex:0 0 auto}
/* Closed off-canvas navigation must not remain keyboard-focusable. */
.mobile-drawer:not(.open),
.drawer:not(.open),
.drawer.public-drawer:not(.open),
.edivic-public-drawer:not(.is-open){visibility:hidden;pointer-events:none}
.mobile-drawer.open,
.drawer.open,
.drawer.public-drawer.open,
.edivic-public-drawer.is-open{visibility:visible;pointer-events:auto}
/* Canonical shell drawer accessibility on tablet/mobile. */
@media(max-width:1100px){
body.edivic-app-shell-active:not(.edivic-shell-drawer-open) .edivic-app-sidebar{visibility:hidden;pointer-events:none}
body.edivic-app-shell-active.edivic-shell-drawer-open .edivic-app-sidebar{visibility:visible;pointer-events:auto}
body.edivic-app-shell-active .edivic-shell-content{width:100%!important;max-width:100%!important;min-width:0!important;margin-left:0!important;transform:none!important}
}
/* Legacy workspace sidebars used by a few pages. */
@media(max-width:980px){
.sidebar:not(.open),.admin-sidebar:not(.open){visibility:hidden;pointer-events:none}
.sidebar.open,.admin-sidebar.open{visibility:visible;pointer-events:auto}
}
/* The mobile chat panel lives off-canvas until a conversation is selected. */
@media(max-width:820px){
body:not(.chat-room-open) .chat-panel{visibility:hidden;pointer-events:none}
body.chat-room-open .chat-panel{visibility:visible;pointer-events:auto}
}
/* Prevent iOS form zoom and maintain comfortable touch targets. */
@media(max-width:760px){
input:not([type="checkbox"]):not([type="radio"]),select,textarea{font-size:16px!important}
button,.btn,.button,[role="button"],input[type="submit"],input[type="button"]{min-height:44px}
.icon-btn,.menu-btn,.hamburger,.hamb,.drawer-close,.mobile-back,.close{min-width:44px;min-height:44px}
table{display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.modal,.modal-card,.dialog,.dialog-card{max-width:calc(100vw - 24px)!important}
.modal-actions,.form-actions,.page-actions,.hero-actions{flex-wrap:wrap}
.modal-actions>* ,.form-actions>*{min-width:0}
}
@media(max-width:520px){
:root{--edv-mobile-gutter:12px}
.page,.page-shell,.shell,.main-content{max-width:100%}
:where(.btn,.button,.primary-button,.secondary-button):not(.icon-btn){white-space:normal;text-align:center}
.footer{gap:12px;flex-wrap:wrap}
}
/* Specific regressions found during the complete page audit. */
@media(max-width:760px){
body[data-edivic-shell-page="active-projects.html"] .filter-tabs,
body[data-edivic-shell-page="project-management.html"] .tabs{padding-bottom:6px;scroll-snap-type:x proximity}
body[data-edivic-shell-page="active-projects.html"] .filter-tab,
body[data-edivic-shell-page="project-management.html"] .tab{scroll-snap-align:start}
}
/* Preserve printable contract dimensions while keeping the screen view fluid. */
body[data-edivic-shell-page="project-contract.html"] .paper{max-width:calc(100% - 24px)}
@media(max-width:650px){
body[data-edivic-shell-page="project-contract.html"] .paper{padding:26px 20px;margin-top:16px}
body[data-edivic-shell-page="project-contract.html"] .toolbar{flex-wrap:wrap}
}
@media print{
html,body{overflow:visible!important}
body[data-edivic-shell-page="project-contract.html"] .paper{max-width:none}
}
/* Motion preferences. */
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto!important}
*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}