72 lines
1.5 KiB
CSS
72 lines
1.5 KiB
CSS
/* Reset default margins and padding */
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body, html {
|
|
width: 100%;
|
|
max-width: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
#root, #__next {
|
|
height: 100%;
|
|
}
|
|
|
|
/* App shell: viewport-bounded with internal scroll on content */
|
|
.content-area {
|
|
width: 100%;
|
|
max-width: 100%;
|
|
height: 100vh;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
overflow-wrap: break-word;
|
|
}
|
|
|
|
/* Allow flex/grid descendants to shrink below their content size,
|
|
* preventing horizontal overflow from long text or wide tables.
|
|
* Inline `min-width` styles still win (higher specificity). */
|
|
.content-area * {
|
|
min-width: 0;
|
|
}
|
|
|
|
/* Mobile: hide desktop sidebar, account for fixed topbar (56px) */
|
|
@media (max-width: 767px) {
|
|
.sidebar-desktop { display: none !important; }
|
|
.content-area {
|
|
margin-left: 0 !important;
|
|
width: 100% !important;
|
|
padding-top: calc(56px + 0.75rem) !important;
|
|
padding-left: 0.75rem !important;
|
|
padding-right: 0.75rem !important;
|
|
padding-bottom: 0.75rem !important;
|
|
}
|
|
}
|
|
|
|
/* Tablet */
|
|
@media (min-width: 768px) and (max-width: 1024px) {
|
|
.content-area {
|
|
padding: 1rem !important;
|
|
}
|
|
}
|
|
|
|
/* Desktop: hide mobile topbar */
|
|
@media (min-width: 768px) {
|
|
.topbar-mobile { display: none !important; }
|
|
}
|
|
|
|
/* Ensure responsive images and content */
|
|
img {
|
|
max-width: 100%;
|
|
height: auto;
|
|
display: block;
|
|
}
|
|
|
|
/* Ensure flex containers wrap properly */
|
|
.content-area > * {
|
|
min-width: 0;
|
|
max-width: 100%;
|
|
}
|