/* ── Reset & base ────────────────────────────────────────── */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } /* ── Themes ────────────────────────────────────────────────── * Every visual color/shape in this stylesheet is driven by the CSS * custom properties below — nothing else in this file hardcodes a * color. A "theme" is just one named set of values for these * properties, selected by `data-theme=""` on (see * public/app.js::applyTheme, which also owns the `` * mapping and the account-settings ~150px on a folded Fold. */ .mapping-row { grid-template-columns: 1fr; gap: .25rem; align-items: stretch; } .mapping-sub { padding-left: .5rem; } } .mapping-sub { padding-left: 1rem; } .mapping-label { font-size: .875rem; color: var(--text-muted); } .req { color: var(--danger); } .import-preview-wrap { margin-top: .5rem; } .preview-label { font-size: .8rem; color: var(--text-muted); margin-bottom: .4rem; } .preview-scroll { overflow-x: auto; } .preview-table { width: 100%; border-collapse: collapse; font-size: .8rem; } .preview-table th { text-align: left; color: var(--text-muted); font-weight: 600; padding: .3rem .5rem; border-bottom: 1px solid var(--border); white-space: nowrap; } .preview-table td { padding: .3rem .5rem; border-bottom: 1px solid var(--border); max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .preview-table td.muted { color: var(--text-muted); } .status-pill { display: inline-block; padding: .1rem .45rem; border-radius: 20px; font-size: .75rem; font-weight: 600; } .status-pill.done { background: rgba(76,175,135,.2); color: var(--success); } .status-pill.pending { background: rgba(136,136,170,.15); color: var(--text-muted); } .import-result-msg { font-size: 1rem; color: var(--success); } /* ── Import document modal ──────────────────────────────── */ .idoc-sheet-picker { display: flex; flex-direction: column; gap: .4rem; margin: .5rem 0; } .idoc-sheet-btn { display: flex; align-items: center; justify-content: space-between; padding: .55rem .75rem; background: var(--surface2); border: 1px solid var(--border); border-radius: var(--radius-sm); cursor: pointer; text-align: left; color: var(--text); width: 100%; } .idoc-sheet-btn:hover:not([disabled]) { border-color: var(--accent); } .idoc-sheet-btn[disabled] { opacity: .45; cursor: default; } /* The simple import wizards reuse this picker; `.current` marks the sheet * already loaded when the user steps back to change it. */ .idoc-sheet-btn.current { border-color: var(--accent); } .idoc-sheet-picker.busy { opacity: .6; pointer-events: none; } .idoc-sheet-btn .sheet-name { font-size: .95rem; } .idoc-sheet-btn .sheet-count { font-size: .8rem; color: var(--text-muted); } .idoc-extra-col-row { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .3rem 0; font-size: .9rem; } .idoc-extra-col-row label { flex: 1 1 8rem; min-width: 0; cursor: pointer; } .idoc-ec-type { flex-shrink: 0; font-size: .82rem; padding: .25rem .4rem; } .idoc-ec-scale { flex-shrink: 0; padding: .15rem; } .idoc-ec-scale .toggle-opt { padding: .3rem .5rem; font-size: .78rem; } /* ── Custom fields — list config ────────────────────────── */ .field-row { display: flex; align-items: center; gap: .5rem; padding: .45rem .5rem; border-radius: var(--radius-sm); background: var(--surface2); margin-bottom: .4rem; } .field-row-icon { font-size: .9rem; width: 1.2rem; text-align: center; flex-shrink: 0; } .field-row-name { flex: 1; font-size: .9rem; } .field-row-type { font-size: .75rem; color: var(--text-muted); background: var(--border); padding: .1rem .4rem; border-radius: 4px; } .field-row-edit { display: flex; flex-direction: column; gap: .4rem; padding: .5rem; background: var(--surface2); border-radius: var(--radius-sm); margin-bottom: .4rem; } .field-edit-actions { display: flex; gap: .5rem; justify-content: flex-end; } .field-required-label { display: flex; align-items: center; gap: .4rem; font-size: .82rem; color: var(--text-muted); cursor: pointer; user-select: none; } .field-required-label input[type="checkbox"] { cursor: pointer; accent-color: var(--accent); } .field-req-badge { font-size: .7rem; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); padding: .1rem .4rem; border-radius: 4px; flex-shrink: 0; } .add-field-form { margin-top: .75rem; } /* The type