/*! © 2026 해밀 (haemil.ai). All rights reserved. 무단 복제·배포 금지. */
/* 일괄 이름 바꾸기 (rename.js): a large dialog, the steps on the left and the preview on the right. */
.dialog.rename {
  --rbad: #c42b1c; --rwarn: #9d5d00;
  width: min(1240px, 94vw); height: min(800px, 90vh); max-width: none; max-height: none; padding: 16px 20px 14px;
}
@media (prefers-color-scheme: dark) {
  .dialog.rename { --rbad: #ff99a4; --rwarn: #fce100; }
}
.dialog.rename[open] { display: flex; flex-direction: column; gap: 12px; }
.rhead { display: flex; align-items: center; gap: 8px; }
.dialog.rename h3 { margin: 0; }
.rcount { color: var(--dim); font-size: 12px; }
.rbody { flex: 1; min-height: 0; display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 12px; }

/* Controls */
.rename :is(input[type=text], input[type=number], input:not([type]), select) {
  height: 28px; box-sizing: border-box; padding: 0 8px; font: inherit; color: var(--text); background: var(--field);
  border: 1px solid var(--field-line); border-radius: 4px; outline: none; -webkit-user-select: text; user-select: text;
}
.rename :is(input, select):focus-visible, .rename :is(input[type=text], input[type=number], input:not([type])):focus { box-shadow: inset 0 -2px 0 var(--accent); }
.rename input[type=checkbox]:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.rbtn { height: 28px; padding: 0 10px; border: 1px solid var(--field-line); border-radius: 4px; background: var(--chrome); white-space: nowrap; }
.rbtn:hover:not(:disabled) { background: var(--hover); }
.rbtn:disabled { opacity: .45; }
.rename button:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.rx { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border: 0; border-radius: 4px; background: transparent; color: var(--dim); }
.rx:hover:not(:disabled) { background: var(--hover); color: var(--text); }
.rx:disabled { opacity: .3; }
.rck { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; white-space: nowrap; }
.rpreset { min-width: 150px; }
.rpname { width: 200px; }

/* Steps */
.rsteps { min-height: 0; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 6px; background: var(--chrome); }
.rstepbar { padding: 8px; border-bottom: 1px solid var(--line); }
.radd { width: 100%; }
.rlist { flex: 1; min-height: 0; overflow: auto; padding: 8px; display: flex; flex-direction: column; gap: 8px; }
.rlist:empty { display: none; }
.dialog .rhint { margin: 0; padding: 12px; color: var(--dim); font-size: 12px; line-height: 1.6; }
.rstep { flex: none; padding: 4px 6px 8px 8px; background: var(--field); border: 1px solid var(--field-line); border-radius: 6px; }
.rstep.off .rsf, .rstep.off b { opacity: .5; }
.rsh { display: flex; align-items: center; gap: 6px; height: 28px; }
.rsf { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px 10px; margin-top: 2px; }
.rfield { display: flex; flex-direction: column; gap: 2px; font-size: 12px; color: var(--dim); }
.rfield.wide { flex: 1 1 100%; }
.rfield.wide input { width: 100%; }
.rfield.r-number input { width: 72px; }
.rfield.r-text:not(.wide) input { width: 96px; }
.rsf .rck { height: 28px; }
.rfold { flex: 1; display: flex; align-items: center; gap: 8px; min-width: 0; }
.rpath { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; }
.rserr { margin-top: 6px; font-size: 12px; color: var(--rbad); }

/* The preview table: only the rows in view are drawn (rename.js), each on the same --rcols grid as the header. */
.rtable { min-width: 0; min-height: 0; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: var(--pane); }
.rtools { display: flex; align-items: center; gap: 4px; padding: 6px 8px; border-bottom: 1px solid var(--line); background: var(--chrome); }
.rtools .rck { margin-left: 8px; }
.rhdr, .rrow { display: grid; grid-template-columns: var(--rcols); }
.rhdr { flex: none; height: 30px; border-bottom: 1px solid var(--line); }
.rhdr button { position: relative; min-width: 0; border: 0; background: transparent; text-align: left; color: var(--dim); padding: 0 10px; overflow: hidden; white-space: nowrap; }
.rhdr button:hover { background: var(--hover); }
.rhdr button.right { text-align: right; }
.rhdr button.sorted::before { content: ""; position: absolute; top: 3px; left: calc(50% - 4px); width: 8px; height: 4px; background: var(--dim); clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.rhdr button.sorted.desc::before { clip-path: polygon(0 0, 100% 0, 50% 100%); }
.rscroll { flex: 1; min-height: 0; overflow: auto; outline: none; }
.rsizer { position: relative; }
.rrow { position: absolute; left: 0; right: 0; height: 26px; align-items: center; }
.rrow:hover { background: var(--hover); }
.rrow > span { min-width: 0; height: 100%; padding: 0 10px; display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.rrow .t { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.rrow.focus { background: var(--sel); }
.rscroll:focus .rrow.focus { box-shadow: inset 0 0 0 1px var(--sel-line); }
.rrow:not(.chg) .c-to { color: var(--dim); }
.rrow.chg .c-to .t { color: var(--accent); font-weight: 600; }
.rrow.bad { background: color-mix(in srgb, var(--rbad) 10%, transparent); }
.rrow.bad.focus { background: color-mix(in srgb, var(--rbad) 22%, var(--sel)); }
.rrow.bad .c-to .t { color: var(--rbad); }
/* A long reason gives way to the name (it is whole in the cell's tooltip). */
.rwhy { flex: 0 100 auto; min-width: 24px; margin-left: auto; padding-left: 8px; overflow: hidden; text-overflow: ellipsis; font-size: 11px; color: var(--rbad); }
.rrow.warn:not(.bad) .rwhy { color: var(--rwarn); }
.rman { flex: none; font-style: normal; color: var(--dim); }
.rrow :is(.c-dir, .c-size, .c-modified, .c-created) { color: var(--dim); }
.rrow.moved .c-dir { color: var(--accent); }
.rrow .c-size { justify-content: flex-end; }
.redit {
  position: absolute; z-index: 2; height: 24px; box-sizing: border-box; padding: 0 6px; font: inherit; color: var(--text);
  background: var(--field); border: 1px solid var(--accent); border-radius: 3px; outline: none; -webkit-user-select: text; user-select: text;
}

/* Foot */
.rfoot { align-items: center; }
.rstatus { color: var(--dim); white-space: nowrap; }
.rstatus b { color: var(--text); }
.rnote { color: var(--dim); font-size: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.rbadt { color: var(--rbad); }
.rwarnt { color: var(--rwarn); }
.rfails { max-height: 120px; overflow: auto; padding: 8px 10px; font-size: 12px; line-height: 1.6; color: var(--rbad); border: 1px solid var(--rbad); border-radius: 6px; -webkit-user-select: text; user-select: text; }
.rfails[hidden] { display: none; }
