/* Domain design editor rendered as a full PAGE inside .admin-main (route #domains//edit) instead of a floating drawer. We reuse the macOS editor markup (.domain-editor__inner + .domain-editor-* descendants), so this file (a) neutralises the drawer's fixed sizing / dark gradient on the promoted inner and (b) re-scopes the admin-new theme rules — which were written for the `.domain-editor` ancestor — onto `.domain-edit-page`. Both themes via tokens. */ .domain-edit-page { width: 100%; } .domain-edit-page__head { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; } .domain-edit-page .domain-edit-back { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 8px; background: color-mix(in srgb, var(--text-strong) 6%, transparent); color: var(--text-strong); border: 1px solid var(--border); font: inherit; font-weight: 600; cursor: pointer; transition: background .15s ease, border-color .15s ease; } .domain-edit-page .domain-edit-back:hover { background: color-mix(in srgb, var(--text-strong) 10%, transparent); border-color: var(--border-hover); } .domain-edit-page .domain-edit-back:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; } .domain-edit-page .domain-edit-back svg { flex: 0 0 auto; } /* The promoted form host fills the page; drop the drawer's fixed width, the 100dvh cap, the inner scroll and the near-black gradient — the page itself scrolls and uses the panel surface. */ .domain-edit-page__body { width: 100%; } .domain-edit-page .domain-editor__inner { width: 100% !important; /* Match every other admin page: full container width, edge-to-edge. Was capped at 960px + left-aligned → the one section that looked narrower and off-centre next to the full-width pages. */ max-width: none; max-height: none !important; overflow: visible !important; margin: 0 auto; padding: 22px; background: var(--bg) !important; border: 1px solid var(--border) !important; border-radius: 14px; box-shadow: none !important; } /* Re-scope the admin-new theme rules (originally `.domain-editor :is(...)`) to the page wrapper so headings / hints / inputs / cards read in both themes. */ .domain-edit-page :is(h1, h2, h3, h4, strong, b, label) { color: var(--text-strong); } .domain-edit-page :is(p, small, .hint, .label, .muted, .eyebrow) { color: var(--mkt-muted); } .domain-edit-page :is(input, select, textarea, .input, .select, .textarea) { background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-strong); border-radius: 6px; } .domain-edit-page :is(.de-card, .de-section, .de-tile, [class*="card"], [class*="panel"]) { background: var(--bg); border-color: var(--border); } .domain-edit-page .btn { background: var(--accent); color: var(--accent-contrast); border: none; } .domain-edit-page .btn-dark:not(.domain-edit-back) { background: color-mix(in srgb, var(--text-strong) 6%, transparent); color: var(--text-strong); } /* The × close icon in the editor head — keep it visible/tappable on the page. */ .domain-edit-page .top-icon { color: var(--text-strong); background: transparent; border: 1px solid var(--border); } .domain-edit-page .top-icon:hover { border-color: var(--border-hover); } /* «MARKET PREVIEW» карточка (.domain-preview) — это превью САЙТА на ТЁМНОМ фоне в ОБЕИХ темах. Сквозная light-theme-читаемость (style.css) красит её strong/small в тёмный → чёрное-по-чёрному. Возвращаем светлый текст внутри карточки. Три класса в селекторе, чтобы перебить (0,2,2)-!important правило читаемости. */ .domain-edit-page .domain-preview .domain-preview__bar strong, .domain-edit-page .domain-preview .domain-preview__market strong { color: #f4f5f7 !important; } .domain-edit-page .domain-preview .domain-preview__market small { color: rgba(255, 255, 255, 0.55) !important; } .domain-edit-page .domain-preview .domain-preview__market div { color: rgba(255, 255, 255, 0.7) !important; } @media (prefers-reduced-motion: reduce) { .domain-edit-page .domain-edit-back { transition: none; } }