.import-stack { display:grid; gap:18px; align-items:start; }

/* ---- snapshot-import disk picker modal ---- */
.snapshot-import-table input[type="checkbox"]:disabled { cursor:default; opacity:.85; }
#snapshot-import-overlay .meta-row { display:flex; flex-wrap:wrap; gap:5px 18px; margin-bottom:12px; font-size:12px; color:var(--dim); }
#snapshot-import-overlay .meta-row b { color:var(--ink); font-weight:600; }
#snapshot-import-overlay tr.disk-off { opacity:.45; }
#snapshot-import-overlay .disk-name { font-weight:600; color:var(--ink); }
#snapshot-import-overlay .disk-sub { color:var(--dim); font-size:11.5px; margin-top:2px; }
#snapshot-import-overlay .disk-dev { color:var(--slate); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:12px; }
#snapshot-import-overlay .role-tag { font-size:10.5px; font-weight:600; letter-spacing:.03em; }
#snapshot-import-overlay .role-tag.boot { color:var(--red); }
#snapshot-import-overlay .role-tag.data { color:var(--blue); }
#snapshot-import-overlay .tx-tag { display:inline-block; font-size:10px; letter-spacing:.02em; padding:1px 7px; border-radius:999px; border:1px solid var(--line); color:var(--slate); white-space:nowrap; }
#snapshot-import-overlay .tx-tag.worker { color:var(--blue); border-color:#cfe0ef; background:#f1f6fb; }
#snapshot-import-overlay .tx-tag.helper { color:var(--amber); border-color:#ecdcb6; background:var(--amber-soft, #fbf3e2); }

/* ---- mockup card system ---- */
.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }
.card-head { display:flex; align-items:center; gap:10px; padding:13px 18px; border-bottom:1px solid var(--line); }
.card-head h2 { margin:0; font-size:13.5px; font-weight:600; color:var(--ink); }
.card-head .sub { font-size:12px; color:var(--dim); }
.card-head .right { margin-left:auto; display:flex; gap:10px; align-items:center; }
.card-body { padding:16px 18px; }
.card-body.flush { padding:0; }
.card-foot { display:flex; align-items:center; justify-content:flex-end; gap:10px; padding:14px 18px; border-top:1px solid var(--line); background:var(--surface); border-radius:0 0 var(--radius) var(--radius); }
.card-foot .foot-copy { margin-right:auto; font-size:12px; color:var(--dim); }

button.small, .btn.small { padding:4px 10px; font-size:12px; min-width:0; letter-spacing:0; }

/* ---- source connection card (keeps JS-bound ids/classes) ---- */
/* Fixed height + centered contents so the card is the same size whether
   connected or not. The shared empty-state "Not connected" marker renders
   as a block flex item that otherwise stretches the disconnected card. */
.source-card.compact { display:flex; align-items:center; gap:12px; flex-wrap:nowrap; background:var(--surface); border:0; border-radius:0; padding:0 18px; height:53px; overflow:hidden; }
.source-card .source-card-spacer { margin-left:auto; }
#import-source-card .source-facts { align-items:center; flex-wrap:nowrap; min-width:0; overflow:hidden; }
.source-summary-actions { display:flex; gap:8px; flex-wrap:nowrap; align-items:center; margin:0; }
.source-summary-actions button { min-width:0; }
.help-marker-inline { margin-left:2px; }

/* ---- subtabs + counts ---- */
.import-subtabs { display:flex; align-items:center; gap:2px; padding:10px 18px 0; border-bottom:1px solid var(--line); }
.import-subtab-button { background:transparent; border:0; border-radius:0; border-bottom:2px solid transparent; margin-bottom:-1px; padding:8px 12px; cursor:pointer; font-family:Inter, system-ui, -apple-system, sans-serif; font-size:12.5px; font-weight:500; color:var(--dim); display:inline-flex; align-items:center; }
.import-subtab-button:hover { background:transparent; color:var(--ink); font-weight:600; }
.import-subtab-button.active { color:var(--ink); border-bottom-color:var(--red); font-weight:600; }
.import-subtab-button .n { font-size:11px; color:var(--dim); background:var(--gray-soft); border-radius:999px; padding:1px 7px; margin-left:7px; font-weight:500; }
.import-subtabs .help-marker { align-self:center; margin:0 10px 6px -2px; }

/* ---- tables (mockup .tbl look) ---- */
.import-images-table { width:100%; border-collapse:collapse; font-size:13px; }
.import-images-table th { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:var(--dim); text-align:left; padding:9px 16px; background:var(--surface-2); border-bottom:1px solid var(--line); white-space:nowrap; }
.import-images-table td { padding:10px 16px; border-bottom:1px solid var(--line); vertical-align:middle; }
.import-images-table tbody tr:last-child td { border-bottom:0; }
.import-images-table tbody tr:hover { background:var(--surface-2); }
#sourceImagesTable th:first-child, #sourceImagesTable td:first-child,
#sourceImageSnapshotsTable th:first-child, #sourceImageSnapshotsTable td:first-child { width:34px; padding-right:0; }
.import-images-table input[type="checkbox"] { width:15px; height:15px; margin:0; accent-color:var(--red); cursor:pointer; }
.source-image-row { cursor:pointer; }
.source-image-row.base-image { opacity:.62; }
.source-image-row.base-image:hover { opacity:.85; }
tr.selected-row, .source-image-row.selected-row { background:#FDF3F0; box-shadow:inset 3px 0 0 var(--red); }
.row-title { font-weight:600; color:var(--ink); margin-bottom:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.row-meta, .mono { font-family:"JetBrains Mono", ui-monospace, monospace; color:var(--dim); font-size:11px; }
.mono strong { color:var(--ink); font-weight:700; }

/* chips */
.status-chip { display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border:0; border-radius:999px; background:var(--gray-soft); color:var(--dim); font-family:Inter, system-ui, -apple-system, sans-serif; font-size:11px; font-weight:500; letter-spacing:.04em; text-transform:none; white-space:nowrap; }
.status-chip::before { content:""; width:7px; height:7px; border-radius:999px; background:currentColor; opacity:.85; }
.status-chip.muted::before { display:none; }
.status-chip.ok { background:var(--green-soft); color:var(--green); }
.status-chip.progress { background:var(--amber-soft); color:var(--amber); }
.status-chip.muted { background:var(--gray-soft); color:var(--dim); }
a.status-chip { text-decoration:none; }
a.status-chip:hover { filter:brightness(.96); }
.chip { display:inline-flex; align-items:center; padding:2px 9px; border:0; border-radius:999px; background:var(--gray-soft); font-family:Inter, system-ui, -apple-system, sans-serif; font-size:10px; font-weight:500; letter-spacing:.04em; text-transform:uppercase; color:var(--dim); }
.chip-blue { color:var(--blue); background:var(--blue-soft); }
.chip-red { color:var(--red-dark); background:var(--red-soft); }
.chip-purple { color:var(--purple); background:var(--purple-soft); }
.chip.chip-green { color:var(--green); background:var(--green-soft); }

/* results / notes */
.result { min-height:0; margin:12px 18px 0; padding:10px 12px; font-size:12.5px; line-height:1.5; border-left:2px solid var(--line-strong); background:var(--surface-2); color:var(--body); }
.result.error { border-left-color:var(--red); background:var(--red-soft); color:var(--red-dark); }
.result.success { border-left-color:var(--green); background:#EEF7EF; color:#214D29; }
.result.info { border-left-color:var(--line-strong); background:var(--surface-2); color:var(--dim); }
.result:empty { display:none; }
.panel-note { margin:0; padding:12px 18px 0; }
.mini-note { padding:10px 12px; border-left:2px solid var(--line-strong); background:var(--surface-2); color:var(--dim); font-size:12px; line-height:1.5; }
.success-box { padding:10px 12px; border-left:2px solid var(--green); background:#EEF7EF; color:#214D29; font-size:12px; line-height:1.5; }

/* gating */
.gated-section.disabled { opacity:.45; pointer-events:none; }
.gated-section.stale { opacity:.62; }

/* volume-snapshot grouping (unchanged behavior, restyled chrome) */
.expander { width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); background:var(--surface-2); color:var(--ink); font-family:"JetBrains Mono", monospace; font-size:12px; line-height:1; cursor:pointer; margin-right:8px; vertical-align:middle; }
.vsnap-group.open .expander { border-color:#E5B2C0; background:var(--red-soft); }
.vsnap-group .vsnap-summary { font-family:"JetBrains Mono", monospace; font-size:10.5px; color:var(--dim); margin-top:4px; }
.vsnap-child.collapsed, .vsnap-clear.collapsed { display:none; }
#sourceVolumeSnapshotsTable .vsnap-child-name { position:relative; padding-left:5%; }
#sourceVolumeSnapshotsTable .vsnap-child-name::before { content:""; position:absolute; left:calc(5% - 16px); top:0; bottom:50%; width:10px; border-left:1px solid var(--line); border-bottom:1px solid var(--line); }
.import-images-table input[type="radio"] { accent-color:var(--red); }

.empty { padding:18px 16px; color:var(--dim); font-size:12px; }
.empty.hidden { display:none; }
