/* MOEOCC workspace UI. Load last. Palette is defined in tokens.css. Deliberate !important bridges legacy feature styles without changing their layouts. Breakpoints: desktop 1024px, table cards 768px, compact dialogs 640px. */ :root, :root[data-theme="dark"], :root[data-theme="light"] { --accent: var(--ui-accent); --accent-2: var(--ui-accent); --accent-3: var(--ui-success); --accent-rose: var(--ui-danger); --accent-grad: var(--ui-primary-bg); --accent-grad-soft: linear-gradient(135deg, var(--ui-accent-soft), var(--ui-surface)); --primary-color: var(--ui-accent); --primary-dark: var(--ui-primary-hover); --primary-gradient: var(--accent-grad); --bg-root: var(--ui-sidebar); --bg-0: var(--ui-bg); --bg-1: var(--ui-surface); --bg-2: var(--ui-surface-muted); --bg-3: var(--ui-surface-hover); --bg-page: var(--ui-bg); --bg-primary: var(--ui-surface); --bg-secondary: var(--ui-surface-muted); --bg-tertiary: var(--ui-surface-hover); --bg-glass: var(--ui-surface); --bg-glass-strong: var(--ui-surface); --bg-overlay: var(--ui-overlay); --text-0: var(--ui-text); --text-1: var(--ui-text); --text-2: var(--ui-muted); --text-3: var(--ui-subtle); --text-primary: var(--ui-text); --text-secondary: var(--ui-muted); --text-tertiary: var(--ui-subtle); --border: var(--ui-border); --border-strong: var(--ui-border-strong); --border-color: var(--ui-border); --border-accent: var(--ui-accent); --shadow-glow: none; --font: var(--ui-font); --font-display: var(--ui-font); --focus-ring: var(--ui-focus); --ds-accent-from: var(--ui-primary); --ds-accent-to: #3975ef; } html { scroll-padding-top: 100px; -webkit-text-size-adjust: 100%; } :root[data-theme] body { margin: 0; background: var(--ui-bg) !important; color: var(--ui-text) !important; font-family: var(--ui-font) !important; font-size: 14px; line-height: 1.55; -webkit-font-smoothing: antialiased; } *, *::before, *::after { box-sizing: border-box; } ::selection { background: var(--ui-accent-soft); color: var(--ui-text); } :root[data-theme] body::before { background: var(--ui-bg) !important; } :root[data-theme] body::after { display: none !important; } :root[data-theme] body :is(h1, h2, h3, h4, .brand-title, .section-title, .modal-title) { font-family: var(--ui-font) !important; text-wrap: balance; } :root[data-theme] body a { text-underline-offset: 3px; } :root[data-theme] body :is(button, input, select, textarea) { font-family: inherit; } :root[data-theme] body :is(.fa-solid, .fas) { font-family: 'Font Awesome 6 Free' !important; font-weight: 900 !important; } :root[data-theme] body :is(.fa-regular, .far) { font-family: 'Font Awesome 6 Free' !important; font-weight: 400 !important; } :root[data-theme] body :is(.fa-brands, .fab) { font-family: 'Font Awesome 6 Brands' !important; } :root[data-theme] body :is(button, a, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--ui-accent) !important; outline-offset: 3px; } :root[data-theme] body [hidden] { display: none !important; } :root[data-theme] body:is(.modal-open, .sidebar-open, .secondary-modal-open) { overflow: hidden !important; } .skip-link { position: fixed; left: 16px; top: -100px; z-index: 30000; padding: 12px 18px; border-radius: 8px; background: var(--ui-primary); color: #fff; } .skip-link:focus { top: 12px; } :root[data-theme] body.is-login .skip-link { display: none; } /* Entry screen */ :root[data-theme] body #loginPage :is(.login-card, .login-header, .login-brand, .form-group, .login-form-footer, .login-divider, .btn-login, .btn-tariffs, .btn-info-site) { animation: none !important; opacity: 1; } :root[data-theme] body #loginPage { grid-template-columns: minmax(0, 1.12fr) minmax(400px, .88fr); min-height: 100vh; min-height: 100dvh; background: var(--ui-bg) !important; } :root[data-theme] body #loginPage .login-hero { padding: clamp(32px, 5vw, 80px); background: #102343 !important; border-right: 0; align-items: center; } :root[data-theme] body #loginPage .login-hero::before { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(166,198,245,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(166,198,245,.035) 1px, transparent 1px); background-size: 44px 44px; } :root[data-theme] body #loginPage .login-hero__inner { max-width: 600px; width: 100%; } :root[data-theme] body #loginPage .login-hero__brand { margin-bottom: 40px; gap: 12px; } :root[data-theme] body #loginPage .login-hero__mark { background: #326de1 !important; width: 44px; height: 44px; border-radius: 12px; } :root[data-theme] body #loginPage .login-hero__mark img, :root[data-theme] body .sidebar-brand .brand-logo img, :root[data-theme] body .login-brand-icon img { filter: brightness(0) invert(1); } :root[data-theme] body #loginPage .login-hero__name { color: #fff !important; font: 700 20px var(--ui-font); letter-spacing: .08em; } :root[data-theme] body #loginPage .login-hero__eyebrow { color: #a7c6ff !important; font-size: 11px; letter-spacing: .13em; margin-bottom: 18px; } :root[data-theme] body #loginPage .login-hero__title { color: #fff !important; font-size: clamp(30px, 3.3vw, 48px); line-height: 1.16; font-weight: 650; letter-spacing: -.045em; max-width: 560px; } :root[data-theme] body #loginPage .login-hero__lead { color: #b7c8e3 !important; font-size: 15px; line-height: 1.8; max-width: 480px; } :root[data-theme] body #loginPage .login-hero__points { gap: 12px; } :root[data-theme] body #loginPage .login-hero__points li { color: #dce7f9 !important; font-size: 13px; padding-left: 26px; } :root[data-theme] body #loginPage .login-hero__points li::before { content: '✓'; display: grid; place-items: center; top: 1px; width: 17px; height: 17px; border-radius: 50%; font-size: 11px; background: #224673 !important; color: #bcd6ff; } :root[data-theme] body #loginPage .login-hero__info { display: none !important; } .login-workflow { margin-top: 32px; padding: 20px; border: 1px solid #345072; border-radius: 14px; background: #162e50; color: #fff; } .login-workflow__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; } .login-workflow__caption { font-size: 12px; font-weight: 600; color: #dfebff; } .login-workflow__badge { color: #a3e4cd; background: #214b4a; border-radius: 5px; padding: 3px 8px; font-size: 10px; } .login-workflow__steps { display: flex; align-items: center; gap: 10px; margin-top: 18px; } .login-workflow__step { flex: 1; min-width: 0; font-size: 11px; color: #b9cce8; } .login-workflow__step i { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: #234770; color: #afcfff; margin-bottom: 8px; font-size: 13px; } .login-workflow__line { width: 20px; height: 1px; background: #40618b; margin-top: -20px; } :root[data-theme] body #loginPage .login-container { background: var(--ui-surface) !important; padding: 48px clamp(24px, 5vw, 80px); border: none !important; min-width: 0; } :root[data-theme] body #loginPage .login-container { position: relative; } :root[data-theme] body #loginPage .login-theme-toggle { position: absolute; top: 20px; right: 24px; background: var(--ui-surface-muted); color: var(--ui-muted); border-color: var(--ui-border); box-shadow: none; } :root[data-theme] body :is(#loginPage, .standalone-reset) .login-card { width: 100%; max-width: 390px; padding: 0 !important; margin: 0 auto; background: transparent !important; border: none !important; box-shadow: none !important; border-radius: 0 !important; } :root[data-theme] body #loginPage .login-brand { margin-bottom: 28px; } :root[data-theme] body #loginPage .login-brand-text { font-family: var(--ui-font) !important; font-weight: 700; } :root[data-theme] body #loginPage .login-brand-icon { transform: none !important; animation: none !important; } :root[data-theme] body #loginPage .login-brand { justify-content: flex-start; } :root[data-theme] body #loginPage .login-hero__points li::after { display: none !important; } :root[data-theme] body .login-brand-icon { background: var(--ui-primary) !important; border-radius: 10px; box-shadow: none !important; } :root[data-theme] body .login-brand-text { color: var(--ui-text) !important; font-size: 15px; letter-spacing: .04em; } :root[data-theme] body #loginPage .login-header { text-align: left; margin-bottom: 28px; } :root[data-theme] body #loginPage .login-title { font-size: 28px !important; font-weight: 650; letter-spacing: -.035em; color: var(--ui-text) !important; margin-bottom: 10px; } :root[data-theme] body #loginPage .login-subtitle { color: var(--ui-muted) !important; font-size: 13px; line-height: 1.7; } :root[data-theme] body #loginPage .login-form { gap: 18px; } :root[data-theme] body #loginPage .form-group { margin: 0; } :root[data-theme] body #loginPage .form-input { min-height: 48px; border-radius: 9px !important; } :root[data-theme] body #loginPage .password-input-wrapper input { padding-right: 48px !important; } :root[data-theme] body #loginPage .password-toggle { width: 44px !important; height: 44px !important; right: 3px !important; color: var(--ui-muted) !important; } :root[data-theme] body #loginPage .login-form-footer { margin: -6px 0 0; } :root[data-theme] body #loginPage .forgot-link { color: var(--ui-accent) !important; font-size: 12px; } :root[data-theme] body #loginPage :is(.btn-login, .btn-tariffs, .btn-info-site) { min-height: 46px; padding: 12px 16px !important; border-radius: 9px !important; font-size: 13px !important; font-weight: 600; } :root[data-theme] body #loginPage .btn-login { background: var(--ui-primary-bg) !important; color: var(--ui-on-primary) !important; border: 1px solid var(--ui-primary) !important; box-shadow: none !important; } :root[data-theme] body #loginPage .btn-login:hover { background: var(--ui-primary-hover-bg) !important; transform: none !important; } :root[data-theme] body #loginPage .btn-tariffs { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; box-shadow: none !important; } :root[data-theme] body #loginPage .btn-info-site { color: var(--ui-muted) !important; background: transparent !important; border: 0 !important; min-height: 36px; box-shadow: none !important; } :root[data-theme] body #loginPage .login-divider { margin: 0; color: var(--ui-subtle); } :root[data-theme] body #loginPage .login-divider span { background: var(--ui-surface) !important; color: var(--ui-muted); text-transform: none; font-size: 12px; } :root[data-theme] body #loginPage > .site-legal { background: var(--ui-bg) !important; padding: 12px 20px; } :root[data-theme] body.standalone-reset .login-brand-icon { transform: none !important; animation: none !important; box-shadow: none !important; } :root[data-theme] body.standalone-reset .login-brand-text { color: var(--ui-text) !important; font-family: var(--ui-font) !important; } :root[data-theme] body.standalone-reset .btn-login { min-height: 46px; background: var(--ui-primary-bg) !important; color: var(--ui-on-primary) !important; border: 1px solid var(--ui-primary) !important; border-radius: 9px; box-shadow: none !important; font-weight: 600; } :root[data-theme] body.standalone-reset .btn-login:hover { background: var(--ui-primary-hover-bg) !important; transform: none !important; } /* Workspace shell */ :root[data-theme] body #mainApp.app-shell { grid-template-columns: var(--ui-sidebar-width) minmax(0, 1fr); } :root[data-theme] body #mainApp .app-shell-sidebar { background: var(--ui-sidebar) !important; border-right: 1px solid var(--ui-border) !important; padding: 0 !important; } :root[data-theme] body #mainApp .sidebar-inner { padding: 26px 16px 20px; gap: 28px; background: var(--ui-sidebar) !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; height: 100vh; height: 100dvh; top: 0; overflow-y: auto; overscroll-behavior: contain; } :root[data-theme] body #mainApp .sidebar-brand { padding: 0 8px; gap: 10px; } :root[data-theme] body #mainApp .sidebar-brand .brand-logo { background: var(--ui-primary) !important; width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0; } :root[data-theme] body #mainApp .sidebar-brand .brand-logo img { width: 25px; height: 25px; } :root[data-theme] body #mainApp .sidebar-brand__name { font: 750 16px var(--ui-font); letter-spacing: .055em; color: var(--ui-text); } :root[data-theme] body #mainApp .sidebar-brand__tag { font-size: 10px; letter-spacing: .025em; color: var(--ui-muted); text-transform: none; margin-top: 2px; } :root[data-theme] body #mainApp :is(.sidebar-collapse-btn, .sidebar-close-btn) { background: var(--ui-surface-muted) !important; color: var(--ui-muted) !important; border: 1px solid var(--ui-border); border-radius: 8px; } :root[data-theme] body #mainApp .sidebar-collapse-btn { width: 28px; height: 36px; } :root[data-theme] body #mainApp .app-shell-sidebar .main-sections { gap: 6px !important; } :root[data-theme] body #mainApp .app-shell-sidebar .main-section-btn { min-height: 46px; border-radius: 9px !important; color: var(--ui-muted) !important; font-size: 13px; font-weight: 550; padding: 11px 12px !important; border-color: transparent !important; box-shadow: none !important; transition: background .15s ease, color .15s ease; } :root[data-theme] body #mainApp .app-shell-sidebar .main-section-btn:hover { background: var(--ui-surface-muted) !important; color: var(--ui-text) !important; transform: none !important; } :root[data-theme] body #mainApp .app-shell-sidebar .main-section-btn.active { color: var(--ui-accent) !important; background: var(--ui-accent-soft) !important; border-color: transparent !important; box-shadow: none !important; } :root[data-theme] body #mainApp .app-shell-sidebar .nav-icon { color: inherit !important; font-size: 17px !important; } :root[data-theme] body #mainApp .sidebar-foot { border-top: 1px solid var(--ui-border); color: var(--ui-subtle); padding: 18px 12px 0; font-size: 10px; letter-spacing: .04em; } :root[data-theme] body #mainApp .app-shell-main { min-width: 0; padding: 0 clamp(20px, 2.5vw, 40px) 28px; background: var(--ui-bg) !important; } :root[data-theme] body #mainApp .app-header { top: 0 !important; margin: 0 0 28px !important; min-height: 80px; padding: 16px 0 !important; background: var(--ui-bg) !important; border: 0 !important; border-bottom: 1px solid var(--ui-border) !important; border-radius: 0 !important; box-shadow: none !important; backdrop-filter: none !important; z-index: 100; } :root[data-theme] body #mainApp .header-content { gap: 16px; width: 100%; padding: 0; } :root[data-theme] body #mainApp .header-content { background: transparent !important; box-shadow: none !important; border: 0 !important; } :root[data-theme] body #mainApp .app-header::before, :root[data-theme] body #mainApp .app-header::after { display: none !important; } :root[data-theme] body #mainApp .header-brand { min-width: 0; } :root[data-theme] body #mainApp .header-title { font-size: 14px !important; line-height: 1.5; letter-spacing: -.015em; font-weight: 600 !important; color: var(--ui-text) !important; } :root[data-theme] body #mainApp .brand-subtitle { font-size: 11px; color: var(--ui-muted) !important; margin-top: 2px; } :root[data-theme] body #mainApp .brand-subtitle { text-transform: none; letter-spacing: .015em; } :root[data-theme] body #mainApp .header-user { gap: 12px; min-width: 0; flex-shrink: 0; } :root[data-theme] body #mainApp .organization-display { background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--ui-muted) !important; max-width: 240px; font-size: 12px; } :root[data-theme] body #mainApp #headerOrganizationName { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } :root[data-theme] body #mainApp .user-org-badge { background: var(--ui-success) !important; width: 6px; height: 6px; box-shadow: none !important; } :root[data-theme] body #mainApp :is(.user-menu-btn, .nav-burger-btn, .theme-toggle-btn) { width: 44px; height: 44px; min-width: 44px; background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: 10px !important; color: var(--ui-muted) !important; box-shadow: none !important; } :root[data-theme] body #mainApp .user-menu-dropdown:not(.show), :root[data-theme] body #mainApp .user-menu-container:hover .user-menu-dropdown:not(.show) { display: none !important; } :root[data-theme] body #mainApp .user-menu-dropdown.show { display: block !important; background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; box-shadow: var(--ui-shadow-lg) !important; border-radius: 12px; padding: 8px; min-width: 230px; max-width: calc(100vw - 32px); } :root[data-theme] body #mainApp .user-menu-item { color: var(--ui-text) !important; border-radius: 6px; min-height: 44px; } :root[data-theme] body #mainApp .user-menu-item:hover { background: var(--ui-surface-muted) !important; } :root[data-theme] body #mainApp .user-menu-item.danger { color: var(--ui-danger) !important; } /* Hierarchy and navigation */ :root[data-theme] body #mainApp .section-header { gap: 16px; margin-bottom: 24px; flex-wrap: wrap; } :root[data-theme] body #mainApp .section-title { font-size: clamp(23px, 2.2vw, 30px) !important; font-weight: 650 !important; line-height: 1.3; letter-spacing: -.035em; color: var(--ui-text) !important; } :root[data-theme] body #mainApp .section-title-icon { width: 38px; height: 38px; border-radius: 10px !important; flex-shrink: 0; background: var(--ui-accent-soft) !important; color: var(--ui-accent) !important; box-shadow: none !important; font-size: 16px; } :root[data-theme] body #mainApp .section-title-icon i { color: var(--ui-accent) !important; } :root[data-theme] body #mainApp .section-subtitle { color: var(--ui-muted) !important; font-size: 13px; line-height: 1.65; margin-top: 8px; } :root[data-theme] body #mainApp :is(.section-actions, .toolbar, .filters, .contracts-filters, .oss-meetings-filters) { gap: 10px; flex-wrap: wrap; min-width: 0; } :root[data-theme] body #mainApp :is(.sub-tabs, .meeting-tabs, .admin-tabs-main, #adminSubTabs) { gap: 4px !important; padding: 5px !important; border: 1px solid var(--ui-border) !important; background: var(--ui-surface-muted) !important; border-radius: 10px !important; box-shadow: none !important; max-width: 100%; } :root[data-theme] body #mainApp :is(.sub-tab-btn, .meeting-tab-btn, .admin-tab-btn, .admin-group-btn, .admin-connect-link), :root[data-theme] body #mainApp #adminSection :is(.admin-tabs-main, #adminSubTabs) :is(.admin-tab-btn, .admin-connect-link) { min-height: 40px; padding: 9px 14px !important; color: var(--ui-muted) !important; font-size: 12px; font-weight: 550; border: 1px solid transparent !important; border-radius: 7px !important; background: transparent !important; box-shadow: none !important; white-space: nowrap; } :root[data-theme] body #mainApp :is(.sub-tab-btn, .meeting-tab-btn, .admin-tab-btn, .admin-group-btn):hover, :root[data-theme] body #mainApp #adminSection :is(.admin-tabs-main, #adminSubTabs) .admin-tab-btn:hover { background: var(--ui-surface-hover) !important; color: var(--ui-text) !important; transform: none; } :root[data-theme] body #mainApp :is(.sub-tab-btn, .meeting-tab-btn, .admin-tab-btn, .admin-group-btn).active, :root[data-theme] body #mainApp #adminSection :is(.admin-tabs-main, #adminSubTabs) .admin-tab-btn.active { background: var(--ui-surface) !important; color: var(--ui-accent) !important; -webkit-text-fill-color: var(--ui-accent) !important; background-clip: border-box !important; border-color: var(--ui-border) !important; box-shadow: 0 1px 3px rgba(0,0,0,.04) !important; } /* Controls */ :root[data-theme] body #mainApp :is(.sub-tab-btn, .meeting-tab-btn, .admin-tab-btn, .admin-group-btn):is(.active)::before, :root[data-theme] body #mainApp :is(.sub-tab-btn, .meeting-tab-btn, .admin-tab-btn, .admin-group-btn):is(.active)::after { display: none !important; } :root[data-theme] body #mainApp :is(.sub-tab-btn, .meeting-tab-btn, .admin-tab-btn, .admin-group-btn) { text-transform: none !important; letter-spacing: 0 !important; } :root[data-theme] body .btn, :root[data-theme] body #mainApp .btn { min-height: 42px; padding: 10px 16px; font-size: 12px; font-weight: 600; line-height: 1.4; border-radius: 8px !important; box-shadow: none !important; letter-spacing: 0; transition: background .15s ease, border-color .15s ease; white-space: normal; overflow-wrap: normal; align-items: center; justify-content: center; } :root[data-theme] body .btn:hover, :root[data-theme] body #mainApp .btn:hover { transform: none !important; } :root[data-theme] body .btn-primary, :root[data-theme] body #mainApp .btn-primary { background: var(--ui-primary-bg) !important; color: var(--ui-on-primary) !important; border: 1px solid var(--ui-primary) !important; -webkit-text-fill-color: var(--ui-on-primary); } :root[data-theme] body .btn-primary:hover, :root[data-theme] body #mainApp .btn-primary:hover { background: var(--ui-primary-hover-bg) !important; border-color: var(--ui-primary-hover) !important; } :root[data-theme] body .btn-secondary, :root[data-theme] body #mainApp .btn-secondary { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; } :root[data-theme] body .btn-secondary:hover, :root[data-theme] body #mainApp .btn-secondary:hover { background: var(--ui-surface-muted) !important; border-color: var(--ui-border-strong) !important; } :root[data-theme] body .btn-danger, :root[data-theme] body #mainApp .btn-danger { background: var(--ui-danger-soft) !important; color: var(--ui-danger) !important; border: 1px solid var(--ui-danger) !important; } :root[data-theme] body .btn-success, :root[data-theme] body #mainApp .btn-success { background: var(--ui-success-soft) !important; color: var(--ui-success) !important; border: 1px solid var(--ui-success) !important; } :root[data-theme] body :is(button, .btn):disabled, :root[data-theme] body #mainApp .btn:disabled { opacity: .5; cursor: not-allowed !important; transform: none !important; box-shadow: none !important; } :root[data-theme] body :is(.form-group, .form-field) > label { color: var(--ui-text) !important; font-size: 12px; font-weight: 600; margin-bottom: 8px; text-transform: none !important; letter-spacing: 0 !important; } :root[data-theme] body #loginPage .form-group > label { text-transform: none !important; letter-spacing: 0 !important; } :root[data-theme] body :is(.form-input, .form-control, .news-comment-textarea), :root[data-theme] body #mainApp :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea) { max-width: 100%; min-width: 0; min-height: 42px; border: 1px solid var(--ui-border) !important; background-color: var(--ui-surface) !important; color: var(--ui-text) !important; border-radius: 8px !important; font-size: 13px; line-height: 1.5; box-shadow: none !important; } :root[data-theme] body input::placeholder, :root[data-theme] body textarea::placeholder { color: var(--ui-subtle) !important; opacity: 1; } :root[data-theme] body :is(input, textarea, select):focus, :root[data-theme] body #mainApp :is(input, textarea, select):focus { border-color: var(--ui-accent) !important; box-shadow: var(--ui-focus) !important; } :root[data-theme] body :is(input, textarea, select):disabled { background-color: var(--ui-surface-muted) !important; color: var(--ui-muted) !important; cursor: not-allowed; } :root[data-theme] body :is(input, textarea)[readonly] { background-color: var(--ui-surface-muted) !important; } :root[data-theme] body input:is([type="checkbox"], [type="radio"]) { accent-color: var(--ui-primary); min-width: 18px; min-height: 18px; } :root[data-theme] body input[type="file"] { padding: 7px; } :root[data-theme] body input[type="file"]::file-selector-button { background: var(--ui-surface-muted); color: var(--ui-text); border: 1px solid var(--ui-border); border-radius: 5px; padding: 5px 8px; margin-right: 10px; font: inherit; cursor: pointer; } :root[data-theme] body .app-select-menu { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: 10px; box-shadow: var(--ui-shadow-lg) !important; max-width: calc(100vw - 16px); } :root[data-theme] body .app-select-menu__opt { color: var(--ui-text) !important; min-height: 40px; } :root[data-theme] body .app-select-menu__opt:is(:hover, :focus-visible, .is-selected) { background: var(--ui-accent-soft) !important; color: var(--ui-accent) !important; } :root[data-theme] body :is(.field-error, .error-message, .login-error) { color: var(--ui-danger) !important; font-size: 12px; } :root[data-theme] body :is(.error-message, .login-error) { background: var(--ui-danger-soft) !important; border-color: var(--ui-danger) !important; border-radius: 8px; padding: 12px; } /* Cards */ :root[data-theme] body #mainApp :is(#profileSection, #houses-infoSection, #adminSection, #housesSection) :is(.news-card, .house-card, .stat-card, .card, .profile-card, .organization-card, .document-export-card, .meeting-info-panel, .question-item) { background: var(--ui-surface) !important; color: var(--ui-text); border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; box-shadow: var(--ui-shadow) !important; } :root[data-theme] body #mainApp #profileSection .profile-card h3 { color: var(--ui-text) !important; font-size: 16px; border-bottom: 1px solid var(--ui-border) !important; padding-bottom: 14px; } :root[data-theme] body #mainApp #profileSection .info-row { background: transparent !important; border-bottom: 1px solid var(--ui-border) !important; box-shadow: none !important; } :root[data-theme] body #mainApp :is(.news-card, .house-card, .stat-card, .card, .profile-card, .organization-card, .document-export-card, .meeting-info-panel, .question-item, .dashboard-chart-card, .dashboard-section, .dash-card) { background: var(--ui-surface) !important; color: var(--ui-text); border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; box-shadow: var(--ui-shadow) !important; backdrop-filter: none !important; } :root[data-theme] body #mainApp :is(.news-card, .house-card, .organization-card):hover { border-color: var(--ui-border-strong) !important; transform: none !important; box-shadow: var(--ui-shadow) !important; } :root[data-theme] body #mainApp :is(.news-card, .house-card, .stat-card, .organization-card)::before { display: none !important; } :root[data-theme] body #mainApp :is(.news-card-title, .house-card-title, .house-card__title, .organization-card-title, .organization-card-value, .profile-card-title) { color: var(--ui-text) !important; letter-spacing: -.02em; font-weight: 600; } :root[data-theme] body #mainApp :is(.house-card-header, .organization-card-header, .profile-card-header) { background: transparent !important; border-bottom-color: var(--ui-border) !important; } :root[data-theme] body #mainApp :is(.house-card-address, .organization-card-label, .news-card-meta, .news-card-excerpt) { color: var(--ui-muted) !important; } :root[data-theme] body #mainApp .news-cards-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 310px), 1fr)); gap: 20px; } :root[data-theme] body #mainApp .news-card-title { font-size: 17px; line-height: 1.45; } :root[data-theme] body #mainApp :is(.empty-state, .empty-state-container) { padding: 48px 24px; background: var(--ui-surface); border: 1px dashed var(--ui-border-strong); border-radius: 12px; color: var(--ui-muted); text-align: center; } :root[data-theme] body #mainApp :is(.news-skel, .skeleton) { background: var(--ui-surface-muted) !important; border: 1px solid var(--ui-border); border-radius: 12px; } :root[data-theme] body #mainApp :is(.badge, .status-badge, .meeting-status, .news-card-category) { border-radius: 5px; font-size: 11px; font-weight: 600; letter-spacing: 0; } :root[data-theme] body #mainApp .badge { box-shadow: none !important; border: 0 !important; padding: 4px 8px; line-height: 1.5; } :root[data-theme] body #mainApp .badge .badge-dot { box-shadow: none !important; width: 5px; height: 5px; background: currentColor !important; } :root[data-theme] body #mainApp .badge-success { background: var(--ui-success-soft) !important; color: var(--ui-success) !important; } :root[data-theme] body #mainApp .badge-warning { background: var(--ui-warning-soft) !important; color: var(--ui-warning) !important; } :root[data-theme] body #mainApp .badge-danger { background: var(--ui-danger-soft) !important; color: var(--ui-danger) !important; } :root[data-theme] body #mainApp :is(.badge-info, .badge-accent) { background: var(--ui-accent-soft) !important; color: var(--ui-accent) !important; } :root[data-theme] body #mainApp .badge-neutral { background: var(--ui-surface-muted) !important; color: var(--ui-muted) !important; } /* Tables: preserve specialized layouts and .keep-table semantics. */ :root[data-theme] body #mainApp :is(.table-container, .oss-meetings-table-scroll, .meetings-table-container, .contracts-table-container) { max-width: 100%; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; background: var(--ui-surface) !important; box-shadow: none !important; overscroll-behavior-x: contain; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table, .rooms-table, .decisions-table, .analytics-table, .rights-table) { color: var(--ui-text); background: var(--ui-surface) !important; font-size: 12px; border-spacing: 0; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table, .rooms-table, .decisions-table, .analytics-table, .rights-table) th { background: var(--ui-surface-muted) !important; color: var(--ui-muted) !important; border-color: var(--ui-border) !important; padding: 13px 16px; font-size: 10px; font-weight: 650; letter-spacing: .035em; line-height: 1.5; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table, .rooms-table, .decisions-table, .analytics-table, .rights-table) td { border-color: var(--ui-border) !important; padding: 14px 16px; color: var(--ui-text); background-color: transparent !important; line-height: 1.6; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table, .rooms-table, .decisions-table, .analytics-table, .rights-table) tbody tr { background: var(--ui-surface) !important; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table, .rooms-table, .decisions-table, .analytics-table, .rights-table) tbody tr:hover { background: var(--ui-surface-muted) !important; } :root[data-theme] body #mainApp :is(.data-table, .oss-meetings-table) td[colspan] { text-align: center !important; color: var(--ui-muted); padding: 36px 20px !important; } :root[data-theme] body #mainApp :is(.data-table, .oss-meetings-table) td[colspan]::before { display: none !important; } :root[data-theme] body #mainApp .meetings-filter-empty strong { display: block; color: var(--ui-text); font-size: 16px; margin-bottom: 8px; } :root[data-theme] body #mainApp .meetings-filter-empty p { margin: 0 0 18px; font-size: 13px; color: var(--ui-muted); } :root[data-theme] body #mainApp :is(.pagination, .pagination-controls) { gap: 6px; flex-wrap: wrap; } /* Admin overview */ :root[data-theme] body #mainApp #adminSection .admin-container { padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; } :root[data-theme] body #mainApp #adminSection :is(.admin-tabs-main, #adminSubTabs) { background: var(--ui-surface-muted) !important; border: 1px solid var(--ui-border) !important; border-radius: 10px !important; box-shadow: none !important; scrollbar-color: var(--ui-border-strong) transparent; scrollbar-width: thin; } :root[data-theme] body #mainApp #adminSection :is(.admin-tabs-main, #adminSubTabs) { flex-direction: row !important; } :root[data-theme] body #mainApp :is(.data-table, .rooms-table, .decisions-table) tbody tr.selected, :root[data-theme] body #mainApp :is(.data-table, .rooms-table, .decisions-table) tbody tr.selected:hover { background: var(--ui-accent-soft) !important; box-shadow: inset 3px 0 0 var(--ui-accent); } :root[data-theme] body #mainApp .rooms-table tbody tr.room-share-invalid, :root[data-theme] body #mainApp .rooms-table tbody tr.room-share-invalid:hover { background: var(--ui-danger-soft) !important; box-shadow: inset 3px 0 0 var(--ui-danger); } :root[data-theme] body #mainApp #adminDashboardTab .dash-os { --dash-text: var(--ui-text); --dash-secondary: var(--ui-muted); --dash-muted: var(--ui-subtle); --dash-line: var(--ui-border); --dash-card: var(--ui-surface); max-width: none; padding: 4px 0 28px; } :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-card, .dashboard-chart-card, .dashboard-section) { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; box-shadow: var(--ui-shadow) !important; border-radius: var(--ui-radius) !important; } :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-overview__value, .dashboard-card__value, .stat-card-value, .dash-mini__value) { background: none !important; color: var(--ui-text) !important; -webkit-text-fill-color: var(--ui-text) !important; font-weight: 650; font-variant-numeric: tabular-nums; } :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-card__title, .dash-overview__title, .dash-event__addr, .dash-event__date strong, .dash-cstat__count, .dash-action, .dash-overview__split strong) { color: var(--ui-text) !important; } :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-card__sub, .dash-overview__label, .dash-mini__label, .dash-event__meta, .dash-cstat__label, .dash-overview__split span, .dash-cstat__sum, .dash-events__empty, .dash-event__date span) { color: var(--ui-muted) !important; } :root[data-theme] body #mainApp #adminDashboardTab .dash-overview::after { display: none; } :root[data-theme] body #mainApp #adminDashboardTab .dash-card__head { flex-wrap: wrap; } :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-filter, .dash-action, .dash-event, .dash-cstat) { background: var(--ui-surface-muted) !important; border-color: var(--ui-border) !important; box-shadow: none !important; } :root[data-theme] body #mainApp #adminDashboardTab .dash-apply { background: var(--ui-primary-bg) !important; color: var(--ui-on-primary) !important; border-radius: 8px; box-shadow: none !important; min-height: 42px; } :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-mini__icon, .stat-card-icon, .dashboard-card__icon) { background: var(--ui-accent-soft) !important; color: var(--ui-accent) !important; border-radius: 10px !important; } :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-all, .dash-contracts__count) { color: var(--ui-accent) !important; } /* Dialogs */ :root[data-theme] body #modalOverlay .progress-modal__done { color: var(--ui-success) !important; background: var(--ui-success-soft) !important; } :root[data-theme] body #modalOverlay .progress-modal__fail { color: var(--ui-danger) !important; background: var(--ui-danger-soft) !important; } :root[data-theme] body #modalOverlay .bulk-vote-progress-modal__hint { color: var(--ui-muted) !important; } :root[data-theme] body :is(#mainApp, #modalOverlay, #tariffsModal, #forgotPasswordModal, #tariffOrderModal, #newsDetailModal) .btn-primary { background: var(--ui-primary-bg) !important; color: var(--ui-on-primary) !important; border-color: var(--ui-primary) !important; } :root[data-theme] body :is(#mainApp, #modalOverlay, #tariffsModal, #forgotPasswordModal, #tariffOrderModal, #newsDetailModal) .btn-secondary { background: var(--ui-surface) !important; color: var(--ui-text) !important; border-color: var(--ui-border) !important; } :root[data-theme] body :is(.modal-overlay, .tariffs-modal-overlay, .news-modal-overlay) { background: var(--ui-overlay) !important; backdrop-filter: blur(4px); padding: 24px; overscroll-behavior: contain; } :root[data-theme] body :is(#modalOverlay .modal, .tariffs-modal-content, .news-modal-card) { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: 16px !important; box-shadow: var(--ui-shadow-lg) !important; height: auto !important; max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); overflow-y: auto; overscroll-behavior: contain; margin: auto; } :root[data-theme] body #modalOverlay .modal { width: min(100%, 620px); } :root[data-theme] body #modalOverlay .modal > .close-btn { position: sticky !important; top: 0 !important; float: right; margin: 0 0 4px 12px; } :root[data-theme] body #modalOverlay .modal.modal--wide { width: min(100%, 1120px); max-width: 1120px; } :root[data-theme] body #modalOverlay :is(.modal-content, #modalContent), :root[data-theme] body .tariffs-modal-body { height: auto !important; max-height: none !important; overflow: visible; min-width: 0; } :root[data-theme] body :is(.modal-header, .modal-footer) { border-color: var(--ui-border) !important; background: var(--ui-surface) !important; } :root[data-theme] body :is(.close-btn, .tariffs-modal-close, .news-modal-close-btn) { display: grid; place-items: center; width: 40px; height: 40px; color: var(--ui-muted) !important; background: var(--ui-surface-muted) !important; border: 1px solid var(--ui-border) !important; border-radius: 9px !important; box-shadow: none !important; line-height: 1; z-index: 10; } :root[data-theme] body :is(.modal-actions, .modal-footer) { gap: 10px; flex-wrap: wrap; } :root[data-theme] body :is(.form-buttons, #forgotPasswordForm > .flex) { display: flex; gap: 10px; flex-wrap: wrap; } :root[data-theme] body :is(.form-buttons, #forgotPasswordForm > .flex) > .btn { flex: 1 1 130px; width: auto !important; } :root[data-theme] body :is(.tariff-card, #tariffsModal .tariff-card, #tariffsModal .tariffs-period-selector) { background: var(--ui-surface-muted) !important; color: var(--ui-text) !important; border-color: var(--ui-border) !important; border-radius: 12px !important; box-shadow: none !important; } :root[data-theme] body #tariffsModal :is(.tariff-price, .tariff-name, .tariff-title) { color: var(--ui-text) !important; } :root[data-theme] body #tariffsModal .tariff-scope { color: var(--ui-muted) !important; } :root[data-theme] body :is(.tariff-period-btn, .period-btn) { border-color: var(--ui-border) !important; background: var(--ui-surface) !important; color: var(--ui-text) !important; min-height: 42px; } :root[data-theme] body :is(.tariff-period-btn, .period-btn).active { background: var(--ui-primary) !important; color: #fff !important; border-color: var(--ui-primary) !important; } :root[data-theme] body .site-legal { color: var(--ui-subtle) !important; border-color: var(--ui-border) !important; font-size: 11px; } :root[data-theme] body .site-legal a { color: var(--ui-accent) !important; } :root[data-theme] body .notification { background: var(--ui-surface) !important; color: var(--ui-text) !important; border-radius: 10px; box-shadow: var(--ui-shadow-lg) !important; max-width: calc(100vw - 32px); } @media (min-width: 1024px) { :root[data-theme] body.sidebar-collapsed #mainApp.app-shell { grid-template-columns: 80px minmax(0, 1fr) !important; } :root[data-theme] body.sidebar-collapsed #mainApp .sidebar-inner { padding: 24px 12px 20px; height: 100dvh; top: 0; gap: 24px; } :root[data-theme] body.sidebar-collapsed #mainApp .sidebar-brand { gap: 16px; } :root[data-theme] body.sidebar-collapsed #mainApp .app-shell-sidebar .main-section-btn { width: 44px; height: 44px; min-height: 44px; padding: 0 !important; } :root[data-theme] body #mainApp .nav-burger-btn { display: none !important; } } @media (max-width: 1199px) and (min-width: 1024px) { :root[data-theme] body #mainApp .organization-display { max-width: 160px; } :root[data-theme] body #mainApp .header-title { max-width: 340px; } } @media (max-width: 1199px) { :root[data-theme] body #mainApp #adminDashboardTab .dash-overview .dash-card__head { flex-direction: column; } :root[data-theme] body #mainApp #adminDashboardTab .dash-filter { width: 100%; } } @media (max-width: 1023px) { :root[data-theme] body #mainApp.app-shell { grid-template-columns: minmax(0, 1fr) !important; } :root[data-theme] body #mainApp .app-shell-main { padding: 0 24px 24px; } :root[data-theme] body #mainApp .app-shell-sidebar { position: fixed; top: 0; bottom: 0; left: 0; width: min(300px, calc(100vw - 48px)); height: 100vh; height: 100dvh; min-height: 0; z-index: 1200; transform: translateX(-100%); visibility: hidden; transition: transform .2s ease, visibility .2s; } :root[data-theme] body #mainApp .app-shell-sidebar.is-open { transform: translateX(0); visibility: visible; } :root[data-theme] body #mainApp .sidebar-inner { padding: 24px 16px; } :root[data-theme] body #mainApp .sidebar-close-btn { display: grid; place-items: center; width: 40px; height: 40px; margin-left: auto; } :root[data-theme] body #mainApp .sidebar-collapse-btn { display: none !important; } :root[data-theme] body #mainApp .sidebar-backdrop.is-visible { display: block !important; position: fixed; inset: 0; z-index: 1199; background: var(--ui-overlay); } :root[data-theme] body #mainApp .nav-burger-btn { display: flex !important; } :root[data-theme] body #mainApp .app-header { min-height: 76px; margin-bottom: 24px !important; } :root[data-theme] body #mainApp .header-content { flex-wrap: nowrap; } :root[data-theme] body #mainApp .header-content { display: flex !important; flex-direction: row !important; align-items: center !important; } :root[data-theme] body #mainApp .header-brand { flex: 1; width: auto !important; order: 0 !important; text-align: left !important; } :root[data-theme] body #mainApp .header-user { flex: 0 0 auto; width: auto !important; order: 1 !important; margin: 0 !important; } :root[data-theme] body #mainApp .header-title { font-size: 13px !important; max-width: 350px; } :root[data-theme] body #mainApp .user-organization-selector { display: none; } :root[data-theme] body #mainApp .header-user { gap: 8px; } :root[data-theme] body #mainApp #adminSection :is(.admin-tabs-main, #adminSubTabs) { flex-wrap: nowrap !important; overflow-x: auto !important; } :root[data-theme] body #mainApp #adminSection :is(.admin-tabs-main, #adminSubTabs) .admin-tab-btn { flex: 0 0 auto !important; width: auto !important; } :root[data-theme] body #mainApp .app-shell-sidebar .main-sections { display: flex !important; position: static !important; transform: none !important; visibility: visible !important; width: 100% !important; max-height: none !important; } :root[data-theme] body #mainApp #adminDashboardTab .dash-os-grid { grid-template-columns: minmax(0, 1fr); } :root[data-theme] body #mainApp #adminDashboardTab .dash-side-stats { grid-column: 1; grid-row: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 767px) { :root[data-theme] body #loginPage { grid-template-columns: minmax(0, 1fr); } :root[data-theme] body #loginPage .login-hero { display: none !important; } :root[data-theme] body #loginPage .login-container { padding: 40px 24px; min-height: calc(100dvh - 70px); } :root[data-theme] body #loginPage .login-card { max-width: 400px; } :root[data-theme] body #loginPage .login-title { font-size: 27px !important; } :root[data-theme] body #mainApp .app-shell-main { padding: 0 16px 20px; } :root[data-theme] body #mainApp .app-header { padding: 12px 0 !important; min-height: 68px; margin-bottom: 22px !important; } :root[data-theme] body #mainApp .header-title { font-size: 12px !important; max-width: 240px; } :root[data-theme] body #mainApp .brand-subtitle { display: none; } :root[data-theme] body #mainApp .section-header { gap: 14px; margin-bottom: 20px; align-items: flex-start; } :root[data-theme] body #mainApp .section-title { font-size: 23px !important; gap: 10px; } :root[data-theme] body #mainApp .section-title-icon { width: 34px; height: 34px; border-radius: 8px !important; } :root[data-theme] body #mainApp .section-subtitle { font-size: 12px; } :root[data-theme] body #mainApp :is(.section-actions, .contracts-filters, .oss-meetings-filters) { width: 100%; } :root[data-theme] body #mainApp :is(.sub-tabs, .meeting-tabs, .admin-tabs-main, #adminSubTabs) { overflow-x: auto !important; flex-wrap: nowrap !important; scrollbar-width: thin; } :root[data-theme] body #mainApp :is(.sub-tab-btn, .meeting-tab-btn, .admin-tab-btn, .admin-group-btn) { flex: 0 0 auto; } :root[data-theme] body #mainApp :is(.form-grid, .form-row) { grid-template-columns: minmax(0, 1fr) !important; } :root[data-theme] body #mainApp :is(.toolbar, .filters, .section-actions) { flex-wrap: wrap; } :root[data-theme] body #mainApp :is(.toolbar, .filters) > :is(input, select, .form-group) { width: 100% !important; } :root[data-theme] body :is(.form-input, .form-control, .news-comment-textarea), :root[data-theme] body #mainApp :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) { font-size: 16px !important; min-height: 44px; } :root[data-theme] body .btn, :root[data-theme] body #mainApp .btn { min-height: 44px; } :root[data-theme] body #mainApp :is(.table-container, .oss-meetings-table-scroll, .meetings-table-container) { border: 0 !important; background: transparent !important; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table):not(.keep-table) { background: transparent !important; width: 100%; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table):not(.keep-table) tbody tr { border: 1px solid var(--ui-border) !important; border-radius: 12px; padding: 16px; margin-bottom: 12px; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table):not(.keep-table) td { padding: 8px 0; gap: 12px; font-size: 12px; overflow-wrap: anywhere; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table):not(.keep-table) td::before { color: var(--ui-muted) !important; font-size: 11px; font-weight: 500; text-transform: none; letter-spacing: 0; white-space: normal; min-width: 85px; max-width: 40%; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table):not(.keep-table) td[colspan] { display: block !important; width: 100%; padding: 20px 8px !important; } :root[data-theme] body #mainApp :is(.table-container, .contracts-table-container):has(.keep-table) { overflow-x: auto !important; border: 1px solid var(--ui-border) !important; } :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-side-stats, .dashboard-charts-row) { grid-template-columns: minmax(0, 1fr); } :root[data-theme] body #mainApp #adminDashboardTab .dash-filter { width: 100%; } :root[data-theme] body #mainApp #adminDashboardTab .dash-filter { display: grid !important; grid-template-columns: minmax(0, 1fr); padding: 12px; border-radius: 10px; gap: 8px; } :root[data-theme] body #mainApp #adminDashboardTab .dash-filter label { display: grid !important; grid-template-columns: 24px minmax(0, 1fr); align-items: center; flex: initial; min-width: 0; gap: 8px; } :root[data-theme] body #mainApp #adminDashboardTab .dash-filter input { width: 100%; height: 44px !important; min-height: 44px !important; padding: 8px; } :root[data-theme] body #mainApp #adminDashboardTab .dash-apply { height: 44px; width: 100%; } :root[data-theme] body #mainApp #adminDashboardTab .dash-card { padding: 20px 16px; } :root[data-theme] body #mainApp .profile-card { padding: 20px 16px; } :root[data-theme] body .notification-container { left: 16px; right: 16px; width: auto; } :root[data-theme] body .notification { max-width: 100%; } } @media (max-width: 640px) { :root[data-theme] body :is(.modal-overlay, .tariffs-modal-overlay, .news-modal-overlay) { padding: 12px !important; align-items: center !important; } :root[data-theme] body :is(#modalOverlay .modal, .tariffs-modal-content, .news-modal-card) { width: 100% !important; max-width: 100% !important; height: auto !important; max-height: calc(100vh - 24px) !important; max-height: calc(100dvh - 24px) !important; border-radius: 14px !important; margin: auto !important; padding: 20px 16px !important; padding-bottom: max(20px, env(safe-area-inset-bottom)) !important; } :root[data-theme] body #modalOverlay :is(.modal-content, #modalContent), :root[data-theme] body :is(.tariffs-modal-body, .news-detail-content) { height: auto !important; max-height: none !important; padding: 0 !important; overflow: visible !important; border-radius: 0 !important; } :root[data-theme] body :is(.close-btn, .tariffs-modal-close, .news-modal-close-btn) { width: 40px; height: 40px; top: 12px !important; right: 12px !important; } :root[data-theme] body :is(.modal-title, .tariffs-modal-body > h2, #newsDetailTitle) { padding-right: 42px; font-size: 21px; line-height: 1.4; } :root[data-theme] body :is(.modal-actions, .modal-footer) > .btn { flex: 1 1 120px; } :root[data-theme] body #mainApp :is(.section-actions, .profile-actions) .btn { flex: 1 1 auto; } } @media (max-width: 389px) { :root[data-theme] body #mainApp .header-title { max-width: 170px; } :root[data-theme] body #loginPage .login-container { padding: 32px 20px; } :root[data-theme] body #mainApp .app-shell-main { padding-right: 12px; padding-left: 12px; } :root[data-theme] body #mainApp .header-user { gap: 6px; } } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } } @media print { :root[data-theme] body #mainApp :is(.app-shell-sidebar, .app-header), .skip-link { display: none !important; } :root[data-theme] body #mainApp.app-shell { display: block !important; } :root[data-theme] body #mainApp .app-shell-main { padding: 0; } } /* Feature surfaces */ :root[data-theme] body #mainApp #houses-infoSection.main-section-content .houses-info-container, :root[data-theme] body #mainApp #profileSection .profile-container { padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; backdrop-filter: none !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content { border: 0 !important; background: transparent !important; box-shadow: none !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .section-header { border-bottom: 0 !important; padding-bottom: 0 !important; margin-bottom: 24px !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .houses-cards-grid { gap: 20px; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card { border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; background: var(--ui-surface) !important; box-shadow: var(--ui-shadow) !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__media { height: 118px !important; border-radius: 11px 11px 0 0 !important; border-bottom: 1px solid var(--ui-border); } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__media-bg { background: linear-gradient(135deg, var(--ui-accent-soft), var(--ui-surface-muted)) !important; border-radius: 11px 11px 0 0 !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__media-icon { width: 48px; height: 48px; margin: -24px 0 0 -24px; color: var(--ui-accent); opacity: .5; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__body { padding: 20px; gap: 14px; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__title { color: var(--ui-text) !important; font-size: 15px; font-weight: 600; line-height: 1.5; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content :is(.house-card__meta-row, .house-card__meta-icon, .house-card__created) { color: var(--ui-muted); font-size: 12px; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__footer { border-color: var(--ui-border); gap: 12px; flex-wrap: wrap; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__more-btn { color: var(--ui-accent); min-height: 36px; font-size: 12px; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__type { background: var(--ui-accent-soft); color: var(--ui-accent); border-radius: 5px; font-size: 10px; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card .house-actions-dropdown-panel { border: 1px solid var(--ui-border) !important; border-radius: 10px !important; background: var(--ui-surface) !important; box-shadow: var(--ui-shadow-lg) !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card .house-actions-dropdown-item { color: var(--ui-text) !important; background: transparent !important; min-height: 40px; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card .house-actions-dropdown-item:hover { background: var(--ui-accent-soft) !important; color: var(--ui-accent) !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card .house-actions-dropdown-item--danger { color: var(--ui-danger) !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card .house-actions-dropdown-item--danger:hover { background: var(--ui-danger-soft) !important; color: var(--ui-danger) !important; } /* This filter is a single surface; its inputs stay integrated into that surface. */ :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-filters { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: 10px !important; padding: 4px 8px 4px 14px !important; box-shadow: none !important; gap: 8px; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-filters:focus-within { border-color: var(--ui-accent) !important; box-shadow: var(--ui-focus) !important; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-filters__search { background: transparent !important; color: var(--ui-muted) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; min-width: 0; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-filters__search-icon { color: var(--ui-muted) !important; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content #meetingsFilterSearch { background: transparent !important; color: var(--ui-text) !important; border: 0 !important; box-shadow: none !important; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content #meetingsFilterSearch::placeholder { color: var(--ui-subtle) !important; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-search-clear { background: transparent; color: var(--ui-muted); min-width: 36px; min-height: 36px; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-search-clear:hover { background: var(--ui-accent-soft); color: var(--ui-accent); } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-filters__select-wrap { background: transparent !important; border-color: var(--ui-border) !important; min-width: 0; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content #meetingsFilterStage { background-color: transparent !important; color: var(--ui-text) !important; border: 0 !important; border-left: 1px solid var(--ui-border) !important; border-radius: 0 !important; box-shadow: none !important; } /* The house information dialog is mounted outside the application shell. */ :root[data-theme] body #houseDetailModal.house-detail-modal { padding: 24px; } :root[data-theme] body #houseDetailModal .house-detail-modal__backdrop { background: var(--ui-overlay) !important; backdrop-filter: blur(4px); } :root[data-theme] body #houseDetailModal .house-detail-modal__panel { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; box-shadow: var(--ui-shadow-lg) !important; backdrop-filter: none !important; max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); padding: 28px; overscroll-behavior: contain; } :root[data-theme] body #houseDetailModal .house-detail-modal__close { background: var(--ui-surface-muted) !important; color: var(--ui-muted) !important; border: 1px solid var(--ui-border) !important; border-radius: 9px !important; width: 40px; height: 40px; } :root[data-theme] body #houseDetailModal .house-detail-modal__title { color: var(--ui-text); font-size: 21px; font-weight: 600; } :root[data-theme] body #houseDetailModal :is(.house-detail-modal__subtitle, .house-detail-modal__cell-label, .house-detail-modal__created) { color: var(--ui-muted); } :root[data-theme] body #houseDetailModal .house-detail-modal__cell { background: var(--ui-surface-muted); border: 1px solid var(--ui-border); border-radius: 10px; } :root[data-theme] body #houseDetailModal .house-detail-modal__cell-label { text-transform: none; letter-spacing: 0; font-size: 11px; } :root[data-theme] body #houseDetailModal .house-detail-modal__cell-value { color: var(--ui-text); font-size: 14px; font-weight: 600; } :root[data-theme] body #houseDetailModal .house-detail-modal__gis a { color: var(--ui-accent); } /* News editor: keep its existing fixed header/body/footer scroll layout. */ :root[data-theme] body #newsEditorModal.news-editor-modal { background: var(--ui-overlay) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; backdrop-filter: blur(4px); } :root[data-theme] body #newsEditorModal.news-editor-modal .news-editor-modal__card { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; box-shadow: var(--ui-shadow-lg) !important; height: auto !important; max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); } :root[data-theme] body #newsEditorModal.news-editor-modal :is(.news-editor-modal__header, .news-editor-modal__footer) { background: var(--ui-surface) !important; border-color: var(--ui-border) !important; } :root[data-theme] body #newsEditorModal.news-editor-modal #newsModalTitle { color: var(--ui-text) !important; font-family: var(--ui-font) !important; font-size: 20px; font-weight: 600; } :root[data-theme] body #newsEditorModal.news-editor-modal :is(.news-editor-modal__group, .news-editor-modal__field) label { color: var(--ui-text) !important; text-transform: none; letter-spacing: 0; font-size: 12px; } :root[data-theme] body #newsEditorModal.news-editor-modal :is(#newsTitleInput, #newsCategoryInput, #newsVideoInput, #newsCoverInput) { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: 8px !important; box-shadow: none !important; min-height: 42px; } :root[data-theme] body #newsEditorModal.news-editor-modal :is(#newsTitleInput, #newsCategoryInput, #newsVideoInput, #newsCoverInput):focus { border-color: var(--ui-accent) !important; box-shadow: var(--ui-focus) !important; } :root[data-theme] body #newsEditorModal.news-editor-modal #newsCategoryInput option { background: var(--ui-surface); color: var(--ui-text); } :root[data-theme] body #newsEditorModal.news-editor-modal #newsCoverInput::file-selector-button { border: 1px solid var(--ui-border); background: var(--ui-surface-muted); color: var(--ui-text); box-shadow: none; border-radius: 6px; min-height: 36px; } :root[data-theme] body #newsEditorModal.news-editor-modal #newsCoverPreview { background: var(--ui-surface-muted) !important; color: var(--ui-muted) !important; border: 1px dashed var(--ui-border-strong) !important; border-radius: 10px; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-editor-modal__toolbar { background: var(--ui-surface-muted) !important; border-color: var(--ui-border) !important; border-radius: 10px 10px 0 0; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-tool-btn { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: 6px; box-shadow: none !important; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-tool-btn:hover { background: var(--ui-accent-soft) !important; color: var(--ui-accent) !important; border-color: var(--ui-accent) !important; } :root[data-theme] body #newsEditorModal.news-editor-modal #newsContentEditor { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: 0 0 10px 10px; } :root[data-theme] body #newsEditorModal.news-editor-modal #newsContentEditor:focus { border-color: var(--ui-accent) !important; box-shadow: var(--ui-focus) !important; outline: none; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-editor-hint { color: var(--ui-muted) !important; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-modal-close { background: var(--ui-surface-muted) !important; color: var(--ui-muted) !important; border: 1px solid var(--ui-border) !important; border-radius: 8px; width: 40px; height: 40px; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-modal-footer .btn-primary { background: var(--ui-primary-bg) !important; color: var(--ui-on-primary) !important; border: 1px solid var(--ui-primary) !important; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-modal-footer .btn-secondary { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; } /* Profile details and contract document uploads use the same surface hierarchy. */ :root[data-theme] body #mainApp #profileSection .profile-card::before, :root[data-theme] body #mainApp #profileSection .profile-card h3::before { display: none !important; } :root[data-theme] body #mainApp #profileSection .info-row { border-color: var(--ui-border); gap: 16px; } :root[data-theme] body #mainApp #profileSection .info-label { color: var(--ui-muted); text-transform: none; letter-spacing: 0; font-size: 12px; } :root[data-theme] body #mainApp #profileSection .info-value { color: var(--ui-text); min-width: 0; overflow-wrap: anywhere; } :root[data-theme] body #mainApp :is(.contract-item, .contract-documents-section) { background: var(--ui-surface) !important; color: var(--ui-text); border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius); box-shadow: none !important; } :root[data-theme] body #mainApp .contract-item:hover { border-color: var(--ui-border-strong) !important; box-shadow: none !important; transform: none !important; } :root[data-theme] body #mainApp .contract-item-title { color: var(--ui-text); } :root[data-theme] body #mainApp .contract-item-meta { color: var(--ui-muted); } :root[data-theme] body #mainApp .contract-doc-card { --doc-accent: var(--ui-accent) !important; background: var(--ui-surface-muted) !important; border: 1px dashed var(--ui-border-strong) !important; border-radius: 10px; box-shadow: none !important; } :root[data-theme] body #mainApp .contract-doc-card::before { display: none; } :root[data-theme] body #mainApp .contract-doc-card:hover { transform: none; border-color: var(--ui-accent) !important; box-shadow: none !important; } :root[data-theme] body #mainApp .contract-doc-card.is-dragover { background: var(--ui-accent-soft) !important; border-color: var(--ui-accent) !important; border-style: solid !important; } :root[data-theme] body #mainApp .contract-doc-card.is-loaded { border-color: var(--ui-border-strong) !important; border-style: solid !important; } :root[data-theme] body #mainApp .contract-doc-card__icon { background: var(--ui-accent-soft); color: var(--ui-accent); border-radius: 8px; } :root[data-theme] body #mainApp .contract-doc-card__title { color: var(--ui-text); font-weight: 600; } :root[data-theme] body #mainApp .contract-doc-card__status { color: var(--ui-muted); } :root[data-theme] body #mainApp .contract-doc-card__status--ok { color: var(--ui-success); } :root[data-theme] body #mainApp .contract-doc-card__action { background: var(--ui-primary); color: #fff; border-radius: 7px; min-height: 40px; box-shadow: none; } :root[data-theme] body #mainApp .contract-doc-file { background: var(--ui-surface); border: 1px solid var(--ui-border); } :root[data-theme] body #mainApp .contract-doc-file__btn { color: var(--ui-muted); width: 36px; height: 36px; } :root[data-theme] body #mainApp .contract-doc-file__btn:hover { background: var(--ui-accent-soft); color: var(--ui-accent); } :root[data-theme] body #mainApp .contract-doc-file__btn--danger:hover { background: var(--ui-danger-soft); color: var(--ui-danger); } /* The address picker has custom checkboxes, so checked styling is explicit. */ :root[data-theme] body #mainApp #contractAddressPicker.addr-picker { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: 10px; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__search { background: var(--ui-surface-muted) !important; color: var(--ui-muted) !important; border-color: var(--ui-border) !important; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__search-icon { color: var(--ui-muted) !important; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__search:focus-within { box-shadow: inset 0 -2px 0 var(--ui-accent); } :root[data-theme] body #mainApp #contractAddressPicker #contractAddressSearch { background: transparent !important; color: var(--ui-text) !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; } :root[data-theme] body #mainApp #contractAddressPicker #contractAddressSearch::placeholder { color: var(--ui-subtle) !important; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__clear { background: transparent; color: var(--ui-muted); min-width: 36px; min-height: 36px; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__clear:hover { background: var(--ui-accent-soft); color: var(--ui-accent); } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__chip { background: var(--ui-accent-soft) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: 7px; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__chip:hover { border-color: var(--ui-accent) !important; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__chip-x { color: var(--ui-accent) !important; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__item { color: var(--ui-text) !important; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__item:is(:hover, .is-selected) { background: var(--ui-accent-soft) !important; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__item input { background-color: var(--ui-surface); border-color: var(--ui-border-strong); min-width: 18px; min-height: 18px; } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__item input:checked { background-color: var(--ui-primary); border-color: var(--ui-primary); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.2l3 3.1 6-6.4' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); } :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__item input:focus-visible { outline-color: var(--ui-accent); } :root[data-theme] body #mainApp :is(#contractAddressCount, .addr-picker__hint), :root[data-theme] body #mainApp #contractAddressPicker .addr-picker__empty { color: var(--ui-muted); border-color: var(--ui-border); } @media (max-width: 767px) { :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__media { height: 104px !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__body { padding: 18px; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-filters { padding: 10px !important; gap: 6px; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-filters__search, :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content .oss-meetings-filters__select-wrap { width: 100%; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root.main-section-content #meetingsFilterStage { border-left: 0 !important; border-top: 1px solid var(--ui-border) !important; min-height: 44px; width: 100%; padding: 10px 28px 10px 0; } :root[data-theme] body #mainApp #profileSection .info-row { align-items: flex-start; flex-direction: column; gap: 4px; } :root[data-theme] body #mainApp #profileSection .info-label { min-width: 0; } :root[data-theme] body #mainApp .contract-doc-card__action { min-height: 44px; } } @media (max-width: 640px) { :root[data-theme] body #houseDetailModal.house-detail-modal { padding: 12px; } :root[data-theme] body #houseDetailModal .house-detail-modal__panel { padding: 24px 20px; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); } :root[data-theme] body #newsEditorModal.news-editor-modal { padding: 12px; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-editor-modal__card { max-width: 100%; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); padding: 0 !important; } :root[data-theme] body #newsEditorModal.news-editor-modal :is(.news-editor-modal__header, .news-editor-modal__body, .news-editor-modal__footer) { padding-left: 16px; padding-right: 16px; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-editor-modal__body { height: auto !important; } :root[data-theme] body #newsEditorModal.news-editor-modal .news-editor-modal__toolbar .news-tool-btn { min-height: 40px; } :root[data-theme] body #newsEditorModal.news-editor-modal :is(#newsTitleInput, #newsCategoryInput, #newsVideoInput, #newsCoverInput, #newsContentEditor) { font-size: 16px; } } /* Meeting detail */ :root[data-theme] body #mainApp #meetingDetailView.meeting-detail-view { padding: 0 !important; color: var(--ui-text); } :root[data-theme] body #mainApp #meetingDetailView > .house-selector-bar { display: flex; flex-wrap: wrap; align-items: flex-start !important; gap: 16px; padding: 0; margin-bottom: 20px; background: transparent !important; border: 0 !important; box-shadow: none !important; } :root[data-theme] body #mainApp #meetingDetailView > .house-selector-bar > div:last-child { display: none; } :root[data-theme] body #mainApp #meetingDetailView #meetingDetailTitle { flex: 1 1 260px !important; min-width: 0; color: var(--ui-text) !important; -webkit-text-fill-color: var(--ui-text) !important; background: none !important; font-size: clamp(20px, 2.1vw, 27px) !important; font-weight: 600; line-height: 1.4; letter-spacing: -.03em; text-align: left !important; overflow-wrap: anywhere; margin: 4px 0 0 !important; } :root[data-theme] body #mainApp #meetingDetailView #meetingDetailContent { min-width: 0; max-width: 100%; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tabs { display: flex; flex-wrap: nowrap !important; gap: 4px !important; max-width: 100%; margin: 0 0 20px !important; padding: 5px !important; background: var(--ui-surface-muted) !important; border: 1px solid var(--ui-border) !important; border-radius: 10px !important; box-shadow: none !important; overflow-x: auto !important; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: var(--ui-border-strong) transparent; -webkit-overflow-scrolling: touch; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tabs::-webkit-scrollbar { height: 4px; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tabs::-webkit-scrollbar-thumb { background: var(--ui-border-strong); border-radius: 4px; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tabs::-webkit-scrollbar-track { background: transparent; } /* These six source labels are uppercase; lowercase + first-letter presents sentence case. */ :root[data-theme] body #mainApp #meetingDetailView .meeting-tab-btn { display: block; flex: 0 0 auto; min-height: 40px; padding: 9px 14px !important; text-transform: lowercase !important; letter-spacing: 0 !important; font-size: 12px; line-height: 1.5; font-weight: 550; color: var(--ui-muted) !important; -webkit-text-fill-color: var(--ui-muted) !important; border: 1px solid transparent !important; border-radius: 7px !important; background: transparent !important; box-shadow: none !important; white-space: nowrap; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tab-btn::first-letter { text-transform: uppercase; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tab-btn:is(:hover, .active) { color: var(--ui-accent) !important; -webkit-text-fill-color: var(--ui-accent) !important; background: var(--ui-surface) !important; border-color: var(--ui-border) !important; transform: none !important; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tab-btn::after { display: none !important; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tab-content { min-height: 0; margin-top: 0 !important; padding: 0 !important; background: transparent !important; color: var(--ui-text) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; } :root[data-theme] body #mainApp #meetingDetailView :is(h3, .form-section-label) { color: var(--ui-text) !important; -webkit-text-fill-color: var(--ui-text); font-weight: 600; line-height: 1.5; } :root[data-theme] body #mainApp #meetingDetailView #meetingMainInfoForm { background: var(--ui-surface) !important; color: var(--ui-text); border: 1px solid var(--ui-border); border-radius: var(--ui-radius); padding: 24px; gap: 24px !important; } :root[data-theme] body #mainApp #meetingDetailView #meetingMainInfoForm > div { min-width: 0; } :root[data-theme] body #mainApp #meetingDetailView #meetingMainInfoForm .form-section { background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; padding: 0 !important; margin: 0 0 24px !important; } :root[data-theme] body #mainApp #meetingDetailView #meetingMainInfoForm .form-section + .form-section { padding-top: 20px !important; border-top: 1px solid var(--ui-border) !important; } :root[data-theme] body #mainApp #meetingDetailView .form-section-label { font-size: 12px; letter-spacing: 0; margin-bottom: 12px; text-transform: none; } :root[data-theme] body #mainApp #meetingDetailView #initiatorsList { min-height: 0 !important; max-height: 300px !important; background: var(--ui-surface-muted) !important; border: 1px solid var(--ui-border) !important; border-radius: 8px; padding: 8px !important; scrollbar-width: thin; scrollbar-color: var(--ui-border-strong) transparent; } :root[data-theme] body #mainApp #meetingDetailView #initiatorsList:not(:has(.initiator-item)) > div { padding: 20px 12px !important; font-size: 12px; color: var(--ui-muted) !important; } :root[data-theme] body #mainApp #meetingDetailView .initiator-item { padding: 10px !important; background: var(--ui-surface); color: var(--ui-text); border: 1px solid var(--ui-border) !important; border-radius: 6px !important; font-size: 12px; line-height: 1.6; box-shadow: none !important; } :root[data-theme] body #mainApp #meetingDetailView .initiator-item:is(:hover, .selected) { background: var(--ui-accent-soft) !important; border-color: var(--ui-accent) !important; } :root[data-theme] body #mainApp #meetingDetailView :is(.btn-primary, .decisions-search__btn, .qr-upload-btn, .document-export-card__btn--amber) { background: var(--ui-primary-bg) !important; color: var(--ui-on-primary) !important; -webkit-text-fill-color: var(--ui-on-primary) !important; border: 1px solid var(--ui-primary) !important; box-shadow: none !important; } :root[data-theme] body #mainApp #meetingDetailView :is(.btn-primary, .decisions-search__btn, .qr-upload-btn, .document-export-card__btn--amber) :is(span, i) { color: var(--ui-on-primary) !important; -webkit-text-fill-color: var(--ui-on-primary) !important; } :root[data-theme] body #mainApp #meetingDetailView :is(.reception-docs-block, .decisions-bulk-toolbar) { background: var(--ui-surface-muted) !important; color: var(--ui-text); border: 1px solid var(--ui-border) !important; border-radius: 10px; box-shadow: none !important; padding: 14px; } :root[data-theme] body #mainApp #meetingDetailView :is(.meeting-info-panel, .decisions-registry-panel) { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; color: var(--ui-text); box-shadow: none !important; padding: 20px; } :root[data-theme] body #mainApp #meetingDetailView :is(.decisions-header, .decisions-actions, .decisions-bulk-toolbar) { flex-wrap: wrap; gap: 12px; border-color: var(--ui-border); } :root[data-theme] body #mainApp #meetingDetailView .decisions-summary { color: var(--ui-text); line-height: 1.6; } :root[data-theme] body #mainApp #meetingDetailView .decisions-search__field { background: var(--ui-surface) !important; border: 1px solid var(--ui-border) !important; border-radius: 8px; color: var(--ui-muted); box-shadow: none; } :root[data-theme] body #mainApp #meetingDetailView .decisions-search__field:focus-within { border-color: var(--ui-accent) !important; box-shadow: var(--ui-focus); } :root[data-theme] body #mainApp #meetingDetailView .decisions-search__field svg { color: var(--ui-muted); } :root[data-theme] body #mainApp #meetingDetailView #decisionsSearchInput { background: transparent !important; color: var(--ui-text) !important; border: 0 !important; box-shadow: none !important; } :root[data-theme] body #mainApp #meetingDetailView .decisions-search__meta { color: var(--ui-muted); } :root[data-theme] body #mainApp #meetingDetailView :is(.rooms-table-container, .decisions-table-container) { max-width: 100%; background: var(--ui-surface); border-color: var(--ui-border); border-radius: 10px; } :root[data-theme] body #mainApp #meetingDetailView #ownersTab > div:first-child { flex-wrap: wrap; gap: 16px; } :root[data-theme] body #mainApp #meetingDetailView #ownersTab > div:first-child > div { min-width: 0; flex-wrap: wrap; } :root[data-theme] body #mainApp #meetingDetailView .filter-bar { display: flex; flex-wrap: wrap; gap: 10px; background: var(--ui-surface-muted); padding: 12px; border: 1px solid var(--ui-border); border-radius: 10px; } :root[data-theme] body #mainApp #meetingDetailView .filter-bar > :is(input, select, button) { min-width: 0; margin-left: 0 !important; } :root[data-theme] body #mainApp #meetingDetailView .rooms-count-pill { background: var(--ui-accent-soft); color: var(--ui-accent); border: 1px solid var(--ui-border); box-shadow: none; } /* Document actions retain their native button semantics and match the current theme. */ :root[data-theme] body #mainApp #meetingDetailView :is(.document-group, .document-export-card) { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; box-shadow: none !important; padding: 20px; } :root[data-theme] body #mainApp #meetingDetailView :is(.document-group__title, .document-export-card__hint) { color: var(--ui-muted) !important; } :root[data-theme] body #mainApp #meetingDetailView button.document-item { background: var(--ui-surface-muted) !important; color: var(--ui-text) !important; -webkit-text-fill-color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: 8px !important; box-shadow: none !important; padding: 12px !important; min-height: 48px; line-height: 1.5; } :root[data-theme] body #mainApp #meetingDetailView button.document-item span { color: var(--ui-text) !important; -webkit-text-fill-color: var(--ui-text) !important; } :root[data-theme] body #mainApp #meetingDetailView button.document-item span:first-child { color: var(--ui-accent) !important; -webkit-text-fill-color: var(--ui-accent) !important; } :root[data-theme] body #mainApp #meetingDetailView button.document-item:hover { background: var(--ui-accent-soft) !important; border-color: var(--ui-accent) !important; transform: none !important; } :root[data-theme] body #mainApp #meetingDetailView .document-export-card:hover { transform: none !important; box-shadow: none !important; } :root[data-theme] body #mainApp #meetingDetailView .document-export-card__btn--amber:hover:not(:disabled) { background: var(--ui-primary-hover) !important; color: #fff !important; } /* Analytics surfaces override both hardcoded dark values and legacy light rules. */ :root[data-theme] body #mainApp #meetingDetailView #analyticsContent :is(.analytics-qcard, .quorum-section) { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; padding: 20px; box-shadow: none !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent :is(.analytics-qcard, .quorum-section).is-accepted, :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .quorum-section.is-met { box-shadow: inset 3px 0 0 var(--ui-success) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-qcard.is-rejected, :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .quorum-section.is-short { box-shadow: inset 3px 0 0 var(--ui-danger) !important; } :root[data-theme] body #mainApp #meetingDetailView :is(.analytics-qcard__text, .quorum-section__title) { color: var(--ui-text) !important; -webkit-text-fill-color: var(--ui-text) !important; font-weight: 550; } :root[data-theme] body #mainApp #meetingDetailView .analytics-qcard__num { width: 36px; height: 36px; background: var(--ui-accent-soft) !important; color: var(--ui-accent) !important; -webkit-text-fill-color: var(--ui-accent) !important; font-size: 14px; border-radius: 9px; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-qcard__head { grid-template-columns: 36px minmax(0, 1fr) auto; gap: 12px; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-qcard__verdict { border-radius: 5px; font-weight: 600; font-size: 11px; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-qcard.is-accepted .analytics-qcard__verdict { background: var(--ui-success-soft) !important; color: var(--ui-success) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-qcard.is-rejected .analytics-qcard__verdict { background: var(--ui-danger-soft) !important; color: var(--ui-danger) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .aq-stat { background: var(--ui-surface-muted) !important; border: 1px solid var(--ui-border) !important; border-radius: 8px; padding: 12px; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent :is(.aq-stat__label, .aq-stat small, .analytics-qcard__meta, .current-value-label, .max-value-label, .analytics-toolbar > span, .quorum-stat-item > span) { color: var(--ui-muted) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .aq-stat__label { text-transform: none; letter-spacing: 0; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent :is(.aq-stat strong, .quorum-stat-item strong) { color: var(--ui-text) !important; -webkit-text-fill-color: var(--ui-text) !important; font-variant-numeric: tabular-nums; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .aq-stat--yes strong { color: var(--ui-success) !important; -webkit-text-fill-color: var(--ui-success) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .aq-stat--no strong { color: var(--ui-danger) !important; -webkit-text-fill-color: var(--ui-danger) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .aq-stat--abs strong { color: var(--ui-warning) !important; -webkit-text-fill-color: var(--ui-warning) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent :is(.analytics-progress-bar, .quorum-section .progress-bar) { background: var(--ui-surface-muted) !important; box-shadow: none !important; border: 1px solid var(--ui-border); } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-progress-bar .progress-bar-fill { background: var(--ui-primary) !important; box-shadow: none !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-qcard.is-rejected .progress-bar-fill { background: var(--ui-danger) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-progress-dot { background: var(--ui-accent) !important; border-color: var(--ui-surface) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .threshold-line { background: var(--ui-accent) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .threshold-label { color: var(--ui-accent) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .quorum-stat-item.quorum-warning strong { color: var(--ui-warning) !important; -webkit-text-fill-color: var(--ui-warning) !important; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .quorum-warning-box { background: var(--ui-warning-soft) !important; color: var(--ui-warning) !important; border: 1px solid var(--ui-warning); border-radius: 8px; box-shadow: none; } @media (max-width: 767px) { :root[data-theme] body #mainApp #meetingDetailView > .house-selector-bar { gap: 12px; align-items: stretch !important; } :root[data-theme] body #mainApp #meetingDetailView > .house-selector-bar > .btn { width: auto; align-self: flex-start; } :root[data-theme] body #mainApp #meetingDetailView #meetingDetailTitle { flex-basis: auto !important; width: 100%; font-size: 21px !important; margin-top: 0 !important; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tabs { margin-bottom: 16px !important; } :root[data-theme] body #mainApp #meetingDetailView .meeting-tab-btn { min-height: 44px; padding: 10px 12px !important; } :root[data-theme] body #mainApp #meetingDetailView #meetingMainInfoForm { padding: 16px; gap: 20px !important; } :root[data-theme] body #mainApp #meetingDetailView #meetingMainInfoForm .form-section { margin-bottom: 20px !important; } :root[data-theme] body #mainApp #meetingDetailView #meetingMainInfoForm :is(.form-section > div:last-child, .meeting-completed-actions) { flex-wrap: wrap; gap: 10px !important; } :root[data-theme] body #mainApp #meetingDetailView :is(.meeting-info-panel, .decisions-registry-panel, .document-group, .document-export-card) { padding: 16px; } :root[data-theme] body #mainApp #meetingDetailView #questionsTab .meeting-info-panel > div:first-child { flex-wrap: wrap; gap: 12px; } :root[data-theme] body #mainApp #meetingDetailView #questionsTab .meeting-info-panel > div:first-child > div { flex-wrap: wrap; } :root[data-theme] body #mainApp #meetingDetailView .question-actions { flex-wrap: wrap; max-width: 80px; gap: 6px; } :root[data-theme] body #mainApp #meetingDetailView .filter-bar > :is(input, select, button) { width: 100%; flex-basis: 100%; } :root[data-theme] body #mainApp #meetingDetailView #ownersTab > div:first-child > div:last-child { gap: 8px !important; width: 100%; } :root[data-theme] body #mainApp #meetingDetailView #ownersTab > div:first-child .btn { flex: 1 1 145px; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent :is(.analytics-qcard, .quorum-section) { padding: 16px; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-qcard__head { grid-template-columns: 36px minmax(0, 1fr); } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-qcard__verdict { grid-column: 2; justify-self: start; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .analytics-qcard__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .aq-stat { padding: 10px; } :root[data-theme] body #mainApp #meetingDetailView #analyticsContent .aq-stat strong { font-size: 20px; } } @media (max-width: 389px) { :root[data-theme] body #mainApp #meetingDetailView #meetingMainInfoForm { padding: 12px; } :root[data-theme] body #mainApp #meetingDetailView :is(.meeting-info-panel, .decisions-registry-panel, .document-group, .document-export-card) { padding: 12px; } } :root body #mainApp #meetingDetailView .decisions-search { background: transparent !important; border: 0 !important; box-shadow: none !important; } :root[data-theme] body #mainApp #meetingDetailView :is(#selectedCount, #decisionsSearchMeta) { color: var(--ui-muted) !important; } /* /info visual language: graphite, translucent panels and soft blue light. This theme changes presentation only; responsive layouts and state classes above stay shared. */ :root[data-theme] body::before { content: ''; display: block; position: fixed; inset: 0; z-index: 0; opacity: 1 !important; pointer-events: none; background: radial-gradient(ellipse 900px 540px at 16% -10%, rgba(61,125,255,.14), transparent 72%), radial-gradient(ellipse 700px 650px at 100% 65%, rgba(70,180,220,.045), transparent 70%), linear-gradient(var(--ui-grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--ui-grid-line) 1px, transparent 1px) !important; background-size: auto, auto, 72px 72px, 72px 72px !important; mask-image: linear-gradient(#000, rgba(0,0,0,.24)); animation: none !important; transform: none !important; } :root[data-theme] body :is(#mainApp.app-shell, #loginPage) { position: relative; z-index: 1; background: transparent !important; } :root[data-theme] body #mainApp .app-shell-main { background: transparent !important; } :root[data-theme] { scrollbar-color: #363b46 var(--ui-field-bg); } :root[data-theme] body #mainApp .app-shell-sidebar { background: transparent !important; border-right: 0 !important; } :root[data-theme] body #mainApp .sidebar-inner { top: 16px; margin: 16px 0 16px 16px; height: calc(100dvh - 32px); padding: 26px 14px 20px; gap: 30px; background: linear-gradient(180deg, rgba(255,255,255,.018), transparent 42%), var(--ui-sidebar) !important; border: 1px solid var(--ui-border) !important; border-radius: 20px !important; box-shadow: 0 18px 60px rgba(0,0,0,.2) !important; backdrop-filter: blur(16px); } :root[data-theme] body #mainApp .sidebar-brand { gap: 8px; padding: 0 10px; } :root[data-theme] body #mainApp .sidebar-brand .brand-logo { display: none !important; } :root[data-theme] body #mainApp .sidebar-brand__name { font-size: 20px; font-weight: 650; letter-spacing: -.04em; } :root[data-theme] body #mainApp .sidebar-brand__tag { color: var(--ui-subtle); font-size: 10px; letter-spacing: .04em; margin-top: 4px; } :root[data-theme] body #mainApp .app-shell-sidebar .main-sections::before { content: 'РАБОЧЕЕ ПРОСТРАНСТВО'; display: block; padding: 0 12px 12px; font: 9px var(--ui-mono); letter-spacing: .09em; color: var(--ui-subtle); white-space: nowrap; } :root[data-theme] body #mainApp .app-shell-sidebar .main-section-btn { min-height: 46px; font-weight: 500; border-radius: 10px !important; } :root[data-theme] body #mainApp .app-shell-sidebar .main-section-btn:hover { background: var(--ui-shell-hover) !important; } :root[data-theme] body #mainApp .app-shell-sidebar .main-section-btn.active { background: var(--ui-accent-soft) !important; color: var(--ui-text) !important; box-shadow: inset 2px 0 0 var(--ui-accent) !important; } :root[data-theme] body #mainApp .app-shell-sidebar .main-section-btn.active .nav-icon { color: var(--ui-accent) !important; } :root[data-theme] body #mainApp .sidebar-foot { display: grid; gap: 14px; padding: 18px 12px 0; text-transform: none; } :root[data-theme] body #mainApp .sidebar-foot a { color: var(--ui-muted); display: flex; justify-content: space-between; text-decoration: none; font-size: 12px; letter-spacing: 0; } :root[data-theme] body #mainApp .sidebar-foot a:hover { color: var(--ui-accent); } :root[data-theme] body #mainApp .sidebar-foot__domain { font: 10px var(--ui-mono); color: var(--ui-subtle); } :root[data-theme] body #mainApp .app-header { top: 16px !important; min-height: 68px; margin: 16px 0 32px !important; padding: 12px 18px !important; background: var(--ui-header-glass) !important; backdrop-filter: blur(16px) !important; border: 1px solid var(--ui-border) !important; border-radius: 16px !important; box-shadow: 0 8px 32px rgba(0,0,0,.12) !important; } :root[data-theme] body #mainApp .header-title { font-weight: 500 !important; color: var(--ui-text) !important; letter-spacing: -.02em; } :root[data-theme] body #mainApp .brand-subtitle { margin-top: 4px; font: 9px var(--ui-mono); letter-spacing: .035em; } :root[data-theme] body #mainApp :is(.user-menu-btn, .nav-burger-btn, .theme-toggle-btn, .sidebar-collapse-btn, .sidebar-close-btn) { background: var(--ui-shell-soft) !important; color: var(--ui-muted) !important; border-radius: 11px !important; } :root[data-theme] body #mainApp :is(.user-menu-btn, .nav-burger-btn, .theme-toggle-btn):hover { background: var(--ui-shell-hover) !important; color: var(--ui-text) !important; } :root[data-theme] body #mainApp :is(.user-menu-dropdown.show, .app-select-menu) { background: var(--ui-surface-muted) !important; } :root[data-theme] body #mainApp .section-title { font-size: clamp(28px, 2.6vw, 36px) !important; font-weight: 600 !important; letter-spacing: -.045em; line-height: 1.2; } :root[data-theme] body #mainApp .section-title-icon { display: none !important; } :root[data-theme] body #mainApp .section-subtitle { color: var(--ui-muted) !important; font-size: 13px; line-height: 1.7; margin-left: 0 !important; padding-left: 0 !important; } :root[data-theme] body #mainApp #meetingsSectionHeader { padding-bottom: 0 !important; border-bottom: 0 !important; margin-bottom: 24px; } :root[data-theme] body #mainApp #meetingsSectionHeader > div:first-child::before, :root[data-theme] body #mainApp #newsSection > .section-header > div:first-child::before, :root[data-theme] body #mainApp #houses-infoSection .houses-info-container > .section-header > div:first-child::before { content: 'ОСС / СОБРАНИЯ'; display: block; margin-bottom: 12px; color: var(--ui-accent); font: 10px var(--ui-mono); letter-spacing: .13em; } :root[data-theme] body #mainApp #newsSection > .section-header > div:first-child::before { content: 'ПЛАТФОРМА / СОБЫТИЯ'; } :root[data-theme] body #mainApp #houses-infoSection .houses-info-container > .section-header > div:first-child::before { content: 'ОБЪЕКТЫ / НЕДВИЖИМОСТЬ'; } :root[data-theme] body #mainApp :is(.sub-tabs, .meeting-tabs) { background: var(--ui-shell-soft) !important; } :root[data-theme] body #mainApp :is(.sub-tab-btn, .meeting-tab-btn, .admin-tab-btn, .admin-group-btn).active, :root[data-theme] body #mainApp #adminSection :is(.admin-tabs-main, #adminSubTabs) .admin-tab-btn.active, :root[data-theme] body #mainApp #meetingDetailView .meeting-tab-btn.active { background: var(--ui-accent-soft) !important; color: var(--ui-text) !important; -webkit-text-fill-color: var(--ui-text) !important; border-color: rgba(110,162,255,.36) !important; box-shadow: 0 2px 12px rgba(0,0,0,.08) !important; } :root[data-theme] body #mainApp #adminSection :is(.admin-tabs-main, #adminSubTabs) { background: var(--ui-shell-soft) !important; padding: 6px !important; border-radius: 13px !important; } :root[data-theme] body #mainApp #housesSection .oss-meetings-toolbar { padding: 0 0 22px; margin-bottom: 20px; border-bottom: 1px solid var(--ui-border); } :root[data-theme] body #mainApp #housesSection .oss-meetings-toolbar .sub-tabs { flex: 0 1 auto; width: auto !important; margin-bottom: 0; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root .oss-meetings-filters { background: var(--ui-surface) !important; border-radius: 13px !important; padding: 7px 10px 7px 16px !important; } :root[data-theme] body #mainApp :is(.table-container, .oss-meetings-table-scroll, .meetings-table-container, .contracts-table-container) { background: var(--ui-panel-bg) !important; border-radius: 18px !important; box-shadow: var(--ui-shadow) !important; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table, .rooms-table, .decisions-table, .analytics-table, .rights-table) th { background: var(--ui-shell-soft) !important; font-weight: 500; font-size: 10px; letter-spacing: .06em; padding: 16px; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table, .rooms-table, .decisions-table, .analytics-table, .rights-table) td { padding: 18px 16px; font-size: 12px; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table) tbody tr:hover { background: rgba(110,162,255,.045) !important; } :root[data-theme] body #mainApp .oss-meetings-table .oss-meetings-td--address { font-size: 13px; font-weight: 550; } :root[data-theme] body #mainApp .oss-meetings-table .oss-meetings-td--period, :root[data-theme] body #mainApp .oss-meetings-table .oss-meetings-td--muted { font: 11px/1.8 var(--ui-mono); color: var(--ui-muted); } :root[data-theme] body #mainApp .oss-meetings-row-actions .btn-icon { width: 36px; height: 36px; min-height: 36px; padding: 0; border-radius: 9px !important; } :root[data-theme] body #mainApp :is(.data-table, .rooms-table, .decisions-table) tbody tr.selected, :root[data-theme] body #mainApp :is(.data-table, .rooms-table, .decisions-table) tbody tr.selected:hover { background: var(--ui-accent-soft) !important; box-shadow: inset 3px 0 0 var(--ui-accent); } :root[data-theme] body #mainApp .rooms-table tbody tr.room-share-invalid, :root[data-theme] body #mainApp .rooms-table tbody tr.room-share-invalid:hover { background: var(--ui-danger-soft) !important; box-shadow: inset 3px 0 0 var(--ui-danger); } :root[data-theme] body #mainApp .badge { border: 1px solid var(--ui-shell-soft) !important; font-weight: 500; border-radius: 7px; } :root[data-theme] body #mainApp .badge .badge-dot { border-radius: 50%; } :root[data-theme] body #mainApp :is(.progress-bar, .dash-acol__track) { background: var(--ui-shell-hover) !important; border-radius: 99px; } :root[data-theme] body #mainApp .progress-bar-fill { background: linear-gradient(90deg, #3d7dff, #8ec5ff) !important; box-shadow: 0 0 14px rgba(61,125,255,.18); } :root[data-theme] body #mainApp :is(#profileSection, #houses-infoSection, #adminSection, #housesSection) :is(.news-card, .house-card, .stat-card, .card, .profile-card, .organization-card, .document-export-card, .meeting-info-panel, .question-item), :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-card, .dashboard-chart-card, .dashboard-section), :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card, :root[data-theme] body #mainApp #meetingDetailView #analyticsContent :is(.analytics-qcard, .quorum-section), :root[data-theme] body #mainApp #meetingDetailView :is(.document-group, .document-export-card, .meeting-info-panel, .decisions-registry-panel) { background: var(--ui-card-bg) !important; border: 1px solid var(--ui-border) !important; border-radius: 18px !important; box-shadow: var(--ui-shadow) !important; } :root[data-theme] body #mainApp :is(.news-card, .house-card, .organization-card):hover { border-color: var(--ui-border-strong) !important; box-shadow: 0 20px 64px rgba(0,0,0,.26) !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__media-bg { background: radial-gradient(ellipse at 50% 25%, rgba(110,162,255,.12), transparent 75%), var(--ui-field-bg) !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__media { height: 132px !important; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__media-icon { color: #8eb6ff; opacity: .7; } :root[data-theme] body #mainApp #adminDashboardTab .dash-overview { background: radial-gradient(ellipse at 80% 0, rgba(110,162,255,.065), transparent 65%), var(--ui-surface) !important; } :root[data-theme] body #mainApp #adminDashboardTab .dash-filter { border-radius: 12px; background: var(--ui-shell-soft) !important; } :root[data-theme] body #mainApp #adminDashboardTab .dash-overview__value { letter-spacing: -.055em; font-weight: 600; } :root[data-theme] body :is(.btn, #mainApp .btn) { border-radius: 11px !important; font-size: 12px; font-weight: 550; } :root[data-theme] body :is(#mainApp, #modalOverlay, #tariffsModal, #forgotPasswordModal, #tariffOrderModal, #newsEditorModal) .btn-primary, :root[data-theme] body #mainApp #meetingDetailView :is(.btn-primary, .decisions-search__btn, .qr-upload-btn, .document-export-card__btn--amber), :root[data-theme] body #mainApp #adminDashboardTab .dash-apply { background: var(--ui-primary-bg) !important; color: var(--ui-on-primary) !important; -webkit-text-fill-color: var(--ui-on-primary) !important; border-color: rgba(142,182,255,.25) !important; box-shadow: 0 6px 24px rgba(61,125,255,.2) !important; } :root[data-theme] body :is(#mainApp, #modalOverlay, #tariffsModal, #forgotPasswordModal, #tariffOrderModal, #newsEditorModal) .btn-primary:hover { background: var(--ui-primary-hover-bg) !important; box-shadow: 0 8px 30px rgba(61,125,255,.28) !important; } :root[data-theme] body #mainApp #meetingDetailView :is(.btn-primary, .decisions-search__btn, .qr-upload-btn, .document-export-card__btn--amber) :is(span, i) { color: var(--ui-on-primary) !important; -webkit-text-fill-color: var(--ui-on-primary) !important; } :root[data-theme] body :is(.btn-secondary, #mainApp .btn-secondary) { background: var(--ui-shell-soft) !important; } :root[data-theme] body :is(.btn-secondary, #mainApp .btn-secondary):hover { background: var(--ui-shell-hover) !important; border-color: var(--ui-border-strong) !important; } :root[data-theme] body :is(.form-input, .form-control, .news-comment-textarea), :root[data-theme] body #mainApp :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea) { background-color: var(--ui-field-bg) !important; border-radius: 10px !important; } :root[data-theme] body :is(#modalOverlay .modal, .tariffs-modal-content, .news-modal-card), :root[data-theme] body #newsEditorModal .news-editor-modal__card, :root[data-theme] body #houseDetailModal .house-detail-modal__panel { background: var(--ui-panel-bg) !important; border-radius: 20px !important; box-shadow: var(--ui-shadow-lg) !important; } :root[data-theme] body #loginPage .login-hero { background: transparent !important; padding: clamp(32px,5vw,80px); } :root[data-theme] body #loginPage .login-hero::before { display: none; } :root[data-theme] body #loginPage .login-hero__mark { display: none; } :root[data-theme] body #loginPage .login-hero__brand { margin-bottom: 48px; } :root[data-theme] body #loginPage .login-hero__name { font-size: 24px; font-weight: 650; letter-spacing: -.045em; } :root[data-theme] body #loginPage .login-hero__eyebrow { color: var(--ui-accent) !important; font: 10px var(--ui-mono); letter-spacing: .13em; } :root[data-theme] body #loginPage .login-hero__title { font-size: clamp(38px,4.2vw,64px); font-weight: 600; line-height: 1.06; letter-spacing: -.055em; } :root[data-theme] body #loginPage .login-hero__title span { display: block; color: var(--ui-accent); } :root[data-theme] body #loginPage .login-hero__lead { color: var(--ui-muted) !important; font-size: 15px; line-height: 1.75; margin-top: 24px; } :root[data-theme] body #loginPage .login-hero__points li { color: var(--ui-muted) !important; } :root[data-theme] body #loginPage .login-hero__points li::before { background: rgba(110,162,255,.1) !important; color: var(--ui-accent); } :root[data-theme] body #loginPage .login-workflow { background: var(--ui-panel-bg); border-color: var(--ui-border); border-radius: 16px; } :root[data-theme] body #loginPage .login-workflow__caption { color: var(--ui-muted); font: 10px var(--ui-mono); } :root[data-theme] body #loginPage .login-workflow__badge { background: var(--ui-success-soft); color: var(--ui-success); } :root[data-theme] body #loginPage .login-workflow__step { color: var(--ui-muted); } :root[data-theme] body #loginPage .login-workflow__step i { background: var(--ui-shell-soft); border: 1px solid var(--ui-border); color: var(--ui-accent); border-radius: 10px; } :root[data-theme] body #loginPage .login-workflow__line { background: var(--ui-border-strong); } :root[data-theme] body #loginPage .login-container { background: transparent !important; } :root[data-theme] body #loginPage .login-card { max-width: 430px; padding: 36px !important; background: var(--ui-panel-bg) !important; border: 1px solid var(--ui-border) !important; border-radius: 24px !important; box-shadow: var(--ui-shadow-lg) !important; } :root[data-theme] body #loginPage .login-brand-logo { display: none !important; } :root[data-theme] body #loginPage .login-brand-text { color: var(--ui-muted) !important; font: 600 12px var(--ui-font) !important; letter-spacing: .08em; } :root[data-theme] body #loginPage .login-title { font-size: 30px !important; font-weight: 600; } :root[data-theme] body #loginPage .btn-login { background: var(--ui-primary-bg) !important; color: var(--ui-on-primary) !important; -webkit-text-fill-color: var(--ui-on-primary); border-color: rgba(142,182,255,.25) !important; box-shadow: 0 8px 28px rgba(61,125,255,.22) !important; } :root[data-theme] body #loginPage .btn-login:hover { background: var(--ui-primary-hover-bg) !important; } :root[data-theme] body #loginPage .btn-tariffs { background: var(--ui-shell-soft) !important; } :root[data-theme] body #loginPage .login-divider span { background: var(--ui-surface) !important; } :root[data-theme] body #loginPage > .site-legal { background: transparent !important; } @media (min-width: 1024px) { :root[data-theme] body.sidebar-collapsed #mainApp .sidebar-inner { top: 16px; margin: 16px 0 16px 12px; padding: 22px 8px; height: calc(100dvh - 32px); } :root[data-theme] body.sidebar-collapsed #mainApp .sidebar-brand .brand-logo { display: grid !important; width: 32px; height: 32px; background: var(--ui-primary-bg) !important; } :root[data-theme] body.sidebar-collapsed #mainApp .app-shell-sidebar .main-sections::before { display: none; } :root[data-theme] body #mainApp .oss-meetings-table th:first-child { width: 26%; } } @media (min-width: 768px) { :root[data-theme] body #mainApp #housesSection .oss-meetings-table-scroll { overflow-x: auto !important; scrollbar-width: thin; scrollbar-color: #363b46 transparent; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table { width: 100% !important; min-width: 1080px !important; table-layout: auto !important; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table :is(th, td) { width: auto !important; padding: 16px 12px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table :is(th, td):nth-child(1) { min-width: 200px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table :is(th, td):nth-child(2) { min-width: 108px; white-space: nowrap !important; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table :is(th, td):nth-child(3) { min-width: 112px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table :is(th, td):nth-child(4) { min-width: 114px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table :is(th, td):nth-child(5) { min-width: 140px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table :is(th, td):nth-child(6) { min-width: 144px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table :is(th, td):nth-child(7) { min-width: 112px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-table :is(th, td):nth-child(8) { min-width: 132px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-row-actions { gap: 5px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-row-actions .btn-icon { width: 32px; height: 32px; min-height: 32px; } } :root[data-theme] body #mainApp #housesSection .oss-meetings-td--stage .badge { white-space: nowrap !important; word-break: normal !important; max-width: none !important; } :root[data-theme] body #mainApp #housesSection .badge-dot { width: 5px !important; min-width: 5px !important; max-width: 5px !important; height: 5px !important; flex: 0 0 5px !important; border-radius: 50% !important; } @media (max-width: 1023px) { :root[data-theme] body #mainApp .app-shell-sidebar { background: var(--ui-sidebar) !important; border-right: 1px solid var(--ui-border) !important; } :root[data-theme] body #mainApp .sidebar-inner { top: 0; margin: 0; height: 100dvh; border: 0 !important; border-radius: 0 !important; padding: 28px 18px; } :root[data-theme] body #mainApp .app-header { top: 12px !important; margin: 12px 0 28px !important; } } @media (max-width: 767px) { :root[data-theme] body #mainApp .app-header { min-height: 64px; padding: 10px 12px !important; margin-bottom: 28px !important; } :root[data-theme] body #mainApp .section-title { font-size: 28px !important; } :root[data-theme] body #mainApp .oss-meetings-row-actions .btn-icon { width: 44px; height: 44px; min-height: 44px; } :root[data-theme] body #mainApp #housesSection .oss-meetings-toolbar { padding-bottom: 16px; margin-bottom: 16px; gap: 12px; } :root[data-theme] body #mainApp #housesSection.oss-meetings-root .oss-meetings-filters { padding: 8px 12px !important; } :root[data-theme] body #mainApp :is(.table-container, .oss-meetings-table-scroll, .meetings-table-container):not(:has(.keep-table)) { background: transparent !important; box-shadow: none !important; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table):not(.keep-table) td { padding: 8px 0; } :root[data-theme] body #mainApp :is(.data-table, .house-meetings-table, .oss-meetings-table):not(.keep-table) tbody tr { background: var(--ui-card-bg) !important; padding: 18px; border-radius: 16px; } :root[data-theme] body #mainApp #houses-infoSection.main-section-content .house-card__media { height: 112px !important; } :root[data-theme] body #loginPage .login-container { padding: 76px 20px 32px; min-height: calc(100dvh - 70px); } :root[data-theme] body #loginPage .login-card { padding: 28px 24px !important; border-radius: 20px !important; } :root[data-theme] body #loginPage .login-theme-toggle { right: 20px; top: 18px; } } @media (prefers-reduced-transparency: reduce) { :root[data-theme] body #mainApp .app-header { background: var(--ui-sidebar) !important; backdrop-filter: none !important; } } /* Dashboard — /info analytics composition */ :root[data-theme] body #mainApp #adminDashboardTab .dash-page-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:6px 0 26px} :root[data-theme] body #mainApp #adminDashboardTab .dash-page-head h1{font-size:clamp(28px,3vw,40px);letter-spacing:-1.4px;line-height:1.15;margin:10px 0;color:var(--ui-text)} :root[data-theme] body #mainApp #adminDashboardTab .dash-page-head p{color:var(--ui-muted);margin:0;line-height:1.6} :root[data-theme] body #mainApp #adminDashboardTab .dash-eyebrow{font:11px 'JetBrains Mono',monospace;letter-spacing:2px;color:var(--ui-primary)} :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-refresh,.dash-presets button,.dash-chart-switch button){border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-muted);border-radius:10px;padding:10px 14px;min-height:44px;font:500 12px Inter,sans-serif;cursor:pointer;transition:background .2s,border-color .2s} :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-presets,.dash-chart-switch){display:flex;gap:5px;flex-wrap:wrap} :root[data-theme] body #mainApp #adminDashboardTab :is(.dash-presets,.dash-chart-switch) button[aria-pressed=true]{background:var(--ui-accent-soft);border-color:var(--ui-primary);color:var(--ui-text)} :root[data-theme] body #mainApp #adminDashboardTab .dash-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px} :root[data-theme] body #mainApp #adminDashboardTab #dashboardUpdateStatus{font-size:12px;color:var(--ui-muted)} :root[data-theme] body #mainApp #adminDashboardTab .dash-error{padding:16px;border:1px solid var(--ui-danger);border-radius:12px;background:var(--ui-danger-soft);color:var(--ui-text);margin-bottom:18px} :root[data-theme] body #mainApp #adminDashboardTab [hidden]{display:none!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-os-grid{grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr)!important;gap:20px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-card{padding:24px!important;background:var(--ui-panel-bg)!important;border:1px solid var(--ui-border)!important;border-radius:20px!important;box-shadow:0 12px 32px #00000014!important;min-width:0} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview{grid-column:1!important;grid-row:1!important;background:radial-gradient(ellipse at 95% 0%,#6ea2ff1c,transparent 65%),var(--ui-panel-bg)!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview::after{display:none!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview__title{font-size:19px!important;letter-spacing:-.4px} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview__value{font-size:64px!important;letter-spacing:-3px;line-height:1.1!important;font-variant-numeric:tabular-nums} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview__split{gap:36px;margin-top:20px} :root[data-theme] body #mainApp #adminDashboardTab .dash-spark{height:66px!important;margin-top:14px;opacity:.8} :root[data-theme] body #mainApp #adminDashboardTab .dash-side-stats{grid-column:2!important;grid-row:1!important;gap:20px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-mini{display:flex;align-items:center;gap:20px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-mini__value{font-size:36px!important;letter-spacing:-1px;font-variant-numeric:tabular-nums} :root[data-theme] body #mainApp #adminDashboardTab .dash-monthly{grid-column:1!important;grid-row:2!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-quorum{grid-column:2!important;grid-row:2!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-bars-wrap{height:270px!important;min-height:270px!important;margin-top:20px} :root[data-theme] body #mainApp #adminDashboardTab .dash-doughnut-wrap{height:320px!important;max-width:340px;margin:12px auto 0} :root[data-theme] body #mainApp #adminDashboardTab .dash-contracts{grid-column:1!important;grid-row:3!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-activity{grid-column:2!important;grid-row:3!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-recent{grid-column:1!important;grid-row:4!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-actions{grid-column:2!important;grid-row:4!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-contracts__grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))!important;gap:10px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-cstat{padding:14px!important;min-width:0} :root[data-theme] body #mainApp #adminDashboardTab .dash-contract-track{height:3px;background:var(--ui-border);border-radius:5px;overflow:hidden;margin-top:14px} :root[data-theme] body #mainApp #adminDashboardTab .dash-contract-track span{display:block;height:100%;background:var(--ui-primary);border-radius:5px} :root[data-theme] body #mainApp #adminDashboardTab .dash-activity__bars{height:200px!important;gap:10px!important;overflow-x:auto;align-items:flex-end} :root[data-theme] body #mainApp #adminDashboardTab .dash-acol{min-width:28px;position:relative;flex:1} :root[data-theme] body #mainApp #adminDashboardTab .dash-acol__count{font:11px 'JetBrains Mono',monospace;color:var(--ui-muted);margin-bottom:7px} :root[data-theme] body #mainApp #adminDashboardTab .dash-acol__bar{background:linear-gradient(0deg,#3d7dff55,#8eb6ff)!important;border-radius:5px 5px 2px 2px!important;min-height:3px} :root[data-theme] body #mainApp #adminDashboardTab .dash-acol:hover .dash-acol__bar{filter:brightness(1.25)} :root[data-theme] body #mainApp #adminDashboardTab .dash-acol__lbl{font-size:10px!important;white-space:nowrap} :root[data-theme] body #mainApp #adminDashboardTab .dash-filter{gap:8px!important;flex-wrap:wrap!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-filter input{width:132px!important;min-height:40px!important;color-scheme:dark} :root[data-theme=light] body #mainApp #adminDashboardTab .dash-filter input{color-scheme:light} :root[data-theme] body #mainApp #adminDashboardTab [aria-busy=true] .dash-refresh i{animation:dash-spin 1.2s linear infinite} @keyframes dash-spin{to{transform:rotate(360deg)}} @media(max-width:1100px){ :root[data-theme] body #mainApp #adminDashboardTab .dash-overview>.dash-card__head{flex-direction:column!important} } @media(max-width:767px){ :root[data-theme] body #mainApp #adminDashboardTab .dash-os-grid{grid-template-columns:minmax(0,1fr)!important;gap:14px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-os-grid>:is(.dash-card,.dash-side-stats){grid-column:1!important;grid-row:auto!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-card{padding:18px!important;border-radius:16px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-page-head{align-items:flex-start;margin-bottom:20px} :root[data-theme] body #mainApp #adminDashboardTab .dash-page-head p{font-size:12px} :root[data-theme] body #mainApp #adminDashboardTab .dash-refresh{font-size:0;padding:12px;flex-shrink:0} :root[data-theme] body #mainApp #adminDashboardTab .dash-refresh i{font-size:16px} :root[data-theme] body #mainApp #adminDashboardTab .dash-toolbar{align-items:flex-start;flex-direction:column;gap:10px} :root[data-theme] body #mainApp #adminDashboardTab .dash-side-stats{grid-template-columns:1fr 1fr!important;gap:12px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-mini{flex-direction:column;align-items:flex-start;gap:12px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-mini__value{font-size:28px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-mini__label{font-size:11px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-filter{width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-filter input{width:100%!important;min-width:0!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-apply{grid-column:1/-1;min-height:44px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-bars-wrap{height:230px!important;min-height:230px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-contracts__sum{font-size:28px!important} } @media(prefers-reduced-motion:reduce){:root[data-theme] body #mainApp #adminDashboardTab *{animation:none!important;transition:none!important}} :root[data-theme] body #mainApp #adminDashboardTab .dash-page-head{padding:0!important;background:none!important;border:0!important;box-shadow:none!important;position:static!important;min-height:0!important} :root[data-theme] body #mainApp #adminDashboardTab #dashboardStatsCards>.dash-filter{margin:0 0 20px;padding:12px 14px;border:1px solid var(--ui-border);border-radius:14px;background:var(--ui-surface);justify-content:flex-end;width:100%} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview__metric{margin-top:20px} :root[data-theme] body #mainApp #adminDashboardTab .dash-card__head{margin-bottom:14px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-spark{height:52px!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview__split{position:absolute;right:26px;top:86px;margin:0;gap:24px} @media(max-width:767px){:root[data-theme] body #mainApp #adminDashboardTab .dash-overview__split{top:94px;right:18px;gap:16px} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview__value{font-size:52px!important}} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview{display:grid!important;grid-template-columns:minmax(0,1fr) auto;column-gap:16px;align-items:center} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview>.dash-card__head,:root[data-theme] body #mainApp #adminDashboardTab .dash-overview>.dash-spark{grid-column:1/-1} :root[data-theme] body #mainApp #adminDashboardTab .dash-overview__split{position:static!important;flex-wrap:wrap;gap:20px;margin-top:20px} :root[data-theme] body #mainApp #adminDashboardTab .dash-toolbar{flex-wrap:wrap;padding:12px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:14px} :root[data-theme] body #mainApp #adminDashboardTab .dash-toolbar>.dash-filter{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important;flex:1;justify-content:flex-end} :root[data-theme] body #mainApp #adminDashboardTab #dashboardUpdateStatus{flex-basis:100%;text-align:right;font-size:11px} @media(max-width:767px){:root[data-theme] body #mainApp #adminDashboardTab .dash-toolbar>.dash-filter{flex:auto} :root[data-theme] body #mainApp #adminDashboardTab #dashboardUpdateStatus{text-align:left}} :root[data-theme] body #mainApp #adminDashboardTab .dash-filter label{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:5px!important;min-width:0!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-acol__bar{flex-shrink:1} @media(max-width:767px){:root[data-theme] body #mainApp #adminDashboardTab .dash-filter input[type=date]{font-size:12px!important;padding:0 6px!important;min-height:44px!important}} :root[data-theme] body #mainApp #adminDashboardTab .dash-actions__grid{grid-template-columns:repeat(2,minmax(0,1fr))!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-action{overflow-wrap:anywhere} @media(min-width:768px) and (max-width:1023px){ :root[data-theme] body #mainApp #adminDashboardTab .dash-os-grid{grid-template-columns:minmax(0,1fr)!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-os-grid>:is(.dash-card,.dash-side-stats){grid-column:1!important;grid-row:auto!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-side-stats{grid-template-columns:1fr 1fr!important} :root[data-theme] body #mainApp #adminDashboardTab .dash-actions__grid{grid-template-columns:repeat(3,minmax(0,1fr))!important} } /* Light palette: shared /info geometry, quiet white surfaces and blue accents. */ :root[data-theme="light"] { scrollbar-color: #bcc9dc #f5f7fb; } :root[data-theme="light"] body::before { opacity: .65 !important; } :root[data-theme="light"] body #mainApp .sidebar-inner { background: rgba(255,255,255,.96) !important; box-shadow: var(--ui-shadow) !important; } :root[data-theme="light"] body #mainApp .app-header { box-shadow: 0 4px 20px rgba(28,52,91,.04) !important; } :root[data-theme="light"] body #mainApp .app-shell-sidebar .main-section-btn.active { color: var(--ui-accent) !important; } :root[data-theme="light"] body #mainApp :is(.data-table,.oss-meetings-table,.rooms-table,.decisions-table,.analytics-table,.rights-table) th { background: #f1f5fa !important; color: #53647b !important; } :root[data-theme="light"] body #mainApp #housesSection .oss-meetings-table-scroll { scrollbar-color: #bcc9dc transparent; } :root[data-theme="light"] body #mainApp #adminDashboardTab .dash-card { box-shadow: 0 5px 22px rgba(25,53,96,.04) !important; } :root[data-theme="light"] body #mainApp #adminDashboardTab .dash-overview { background: radial-gradient(ellipse at 95% 0%,rgba(37,99,235,.09),transparent 65%),var(--ui-panel-bg) !important; } :root[data-theme="light"] body #mainApp #adminDashboardTab .dash-acol__bar { background: linear-gradient(0deg,#dbe8ff,#3975ef) !important; box-shadow: none !important; } :root[data-theme="light"] body #mainApp #adminDashboardTab .dash-doughnut-wrap { filter: none !important; } :root[data-theme="light"] body #loginPage .login-hero__title { color: var(--ui-text) !important; } :root[data-theme="light"] body #loginPage .login-card { box-shadow: 0 16px 56px rgba(31,61,103,.08) !important; } :root[data-theme="light"] body :is(.btn-primary,.btn-login,.dash-apply) { box-shadow: 0 4px 14px rgba(37,99,235,.16) !important; } :root[data-theme="light"] body :is(input,select,textarea):disabled { color: var(--ui-muted) !important; opacity: 1; background: var(--ui-surface-muted) !important; } :root[data-theme="light"] body :is(input,textarea)[readonly] { background: var(--ui-surface-muted) !important; } :root[data-theme="light"] body #mainApp :is(.user-menu-dropdown,.app-select-menu) { background: #fff !important; box-shadow: var(--ui-shadow-lg) !important; } @media(max-width:767px) { :root[data-theme="light"] body #mainApp :is(.data-table,.house-meetings-table,.oss-meetings-table):not(.keep-table) tbody tr { box-shadow: 0 4px 18px rgba(28,52,91,.04) !important; } } :root[data-theme="light"] body #loginPage .login-hero__name { color: var(--ui-text) !important; } :root[data-theme="light"] body #loginPage .login-hero__points li::before { background: var(--ui-accent-soft) !important; color: var(--ui-accent) !important; }