/* Preserve UMAR's charcoal, cream and gold; give content a bounded scroll area. */
html, body { height:100%; }
body { height:100dvh; overflow:hidden; }
#main-content { min-width:0; min-height:0; }
#workspace-scroll { min-height:0; min-width:0; overflow-y:auto; overflow-x:hidden;
    touch-action:pan-y; -webkit-overflow-scrolling:touch; overscroll-behavior-y:contain; }
#sidebar { height:100dvh; touch-action:pan-y; }
.umar-tab-strip { min-width:0; max-width:100%; touch-action:auto; scrollbar-width:thin;
    scrollbar-color:#B8860B #F4F1EA; padding-bottom:10px; }
.umar-tab-strip::-webkit-scrollbar { display:block; height:6px; }
.umar-tab-strip::-webkit-scrollbar-thumb { background:#B8860B; border-radius:4px; }
.umar-tab { min-height:44px; }
.umar-tab svg, .umar-card-title svg { width:18px; height:18px; flex-shrink:0; stroke-width:1.75; }
.tab-controls { display:flex; justify-content:flex-end; gap:8px; margin-top:-8px; margin-bottom:12px; }
.tab-controls button { width:44px; height:44px; border:1px solid #d6d3cb; border-radius:8px;
    color:#1D1D1B; background:#fff; font-size:22px; }
.tab-controls button:disabled { opacity:.35; }
button:focus-visible,a:focus-visible,[contenteditable]:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
    outline:2px solid #B8860B; outline-offset:3px; }
.editor-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(240px,1fr); gap:24px; }
.editor-layout label,.review-form label { display:block; margin:14px 0 5px; font-weight:600; font-size:14px; }
.editor-layout input,.editor-layout select,.editor-layout textarea,.review-form input,.review-form select,.review-form textarea {
    width:100%; min-height:44px; border:1px solid #b6b3aa; border-radius:8px; padding:10px 12px; background:#fff; color:#1D1D1B; }
.editor-toolbar { display:flex; flex-wrap:wrap; gap:6px; padding:8px 0; }
.editor-toolbar button,.cms-action { min-height:44px; padding:8px 14px; border:1px solid #b6b3aa; border-radius:8px; background:#fff; }
.cms-action.primary { background:#1D1D1B; color:#F4F1EA; border-color:#1D1D1B; }
#cms-editor { border:1px solid #b6b3aa; border-radius:8px; padding:20px; min-height:320px;
    background:#fff; color:#1D1D1B; overflow-wrap:anywhere; }
#cms-editor img { max-width:100%; height:auto; }
#cms-editor h2 { font-size:1.5rem; font-weight:700; margin:1em 0 .5em; }
#cms-editor ul { list-style:disc; padding-left:1.5em; }
#cms-preview { width:100%; min-height:550px; border:1px solid #d6d3cb; border-radius:8px; background:#fff; }
.cms-list-item,.review-item { padding:16px 0; border-bottom:1px solid #d6d3cb; }
#cms-message,#review-message { min-height:24px; margin-top:12px; }
.review-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; }
.review-item pre { white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; font-size:13px; }
html.dark .editor-layout input,html.dark .editor-layout textarea,html.dark .editor-layout select,
html.dark #cms-editor,html.dark .cms-action,html.dark .review-form input,html.dark .review-form textarea,
html.dark .review-form select { background:#24221f; color:#F4F1EA; }
@media(max-width:1023px) {
    #workspace-scroll { padding:16px; padding-bottom:max(24px,env(safe-area-inset-bottom)); }
    #main-content header { padding-left:12px; padding-right:12px; }
    #notif-dropdown { width:min(320px,calc(100vw - 24px)); }
    .umar-hero,.umar-module-hero { padding:16px; }
    .umar-hero-title,.umar-module-hero-title { font-size:1.1rem; }
    .umar-hero-quote { display:none; }
    .editor-layout,.review-grid { grid-template-columns:minmax(0,1fr); }
    .editor-layout input,.editor-layout textarea,.editor-layout select { font-size:16px; }
    #workspace-scroll .page-content { max-width:100%; min-width:0; }
    #workspace-scroll .overflow-x-auto { max-width:100%; touch-action:auto; }
    #btn-mobile-menu { min-width:44px; min-height:44px; }
}
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; } }

.tab-controls[hidden] { display:none; }

html.dark .editor-toolbar button,html.dark .tab-controls button {
    background:#24221f !important; color:#F4F1EA !important; border-color:#8b857a;
}
html.dark .editor-layout input::placeholder,html.dark .editor-layout textarea::placeholder {
    color:#b9b3a8; opacity:1;
}