/* Administration, Références, Mon compte. Classes prefixed "ad-" so they never collide with other views. */

/* ---------- compact editable tables ---------- */
.ad-table td { padding-top: .25rem; padding-bottom: .25rem; }
.ad-table td.ad-act { white-space: nowrap; text-align: right; width: 1%; }
.ad-table td.ad-act > * + * { margin-left: .3rem; }
.ad-table td.ad-num, .ad-table th.ad-num { text-align: right; font-variant-numeric: tabular-nums; width: 1%; white-space: nowrap; }
.ad-table td.ad-narrow, .ad-table th.ad-narrow { width: 1%; white-space: nowrap; }
.ad-table tr.ad-arch > td:not(.ad-act) { opacity: .55; }
.ad-table tr.grp td { padding: .35rem .6rem; }
.ad-table tr.grp td .row { justify-content: space-between; }
.ad-table tr.grp button { text-transform: none; letter-spacing: 0; font-weight: 600; }
.ad-table .ad-sub { display: block; color: var(--muted); font-size: .8rem; overflow-wrap: anywhere; }
.ad-table .ad-strong { font-weight: 600; }
.ad-table .chips { max-width: 34rem; }
.ad-count { font-variant-numeric: tabular-nums; }
button.linklike.ad-count { font-weight: 600; }
.ad-dash { color: var(--muted); }

/* Inline field: looks like text until hovered or focused. */
input.ad-in, select.ad-in { width: 100%; border-color: transparent; background: transparent; padding: .28rem .4rem; }
input.ad-in:hover, select.ad-in:hover { border-color: var(--line); }
input.ad-in:focus, select.ad-in:focus { border-color: var(--line-strong); background: var(--surface); }
input.ad-in::placeholder { color: var(--muted); opacity: .8; }
input.ad-in.ad-name { font-weight: 600; }
select.ad-in { width: auto; max-width: 16rem; }
input.ad-ord { width: 4.2rem; }

/* Colour picker as a square swatch. */
input.ad-sw { width: 2rem; height: 1.7rem; padding: 0; border: 1px solid var(--line-strong); background: none; cursor: pointer; vertical-align: middle; }
input.ad-sw:disabled { cursor: default; opacity: 1; }
input.ad-sw::-webkit-color-swatch-wrapper { padding: 2px; }
input.ad-sw::-webkit-color-swatch { border: 0; }
input.ad-sw::-moz-color-swatch { border: 0; }
.ad-dot { display: inline-block; width: .8rem; height: .8rem; background: var(--c, var(--muted)); vertical-align: middle; flex: none; }

.ad-arrows { display: inline-flex; }
.ad-arrows button { padding: .1rem .35rem; min-width: 1.7rem; justify-content: center; }
.ad-arrows button + button { border-left-width: 0; }

/* ---------- toolbars and headers ---------- */
.ad-tools { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-bottom: .7rem; }
.ad-tools input[type=search] { flex: 1 1 220px; max-width: 340px; }
.ad-tools .ad-total { color: var(--muted); font-size: .85rem; margin-left: auto; }
.ad-tools .ad-total + button, .ad-tools .ad-total + a { margin-left: 0; }
.ad-seg { flex-wrap: wrap; }
.ad-rights { margin: -.3rem 0 .9rem; color: var(--muted); max-width: 90ch; font-size: .9rem; }

/* Two families of tags side by side. */
.ad-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 1rem; align-items: start; }
.ad-cols > .panel + .panel, .ad-grid > .panel + .panel { margin-top: 0; }

/* ---------- account editor ---------- */
.ad-poles { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 14rem); gap: .35rem .8rem; align-items: center; margin: .3rem 0 .8rem; }
.ad-poles > .chip { justify-self: start; }
.ad-poles select { width: 100%; }
.ad-legend { font-size: .82rem; color: var(--muted); margin: 0 0 .8rem; }
.ad-legend b { color: var(--text); font-weight: 600; }
.ad-checks { display: grid; gap: .5rem; margin: .4rem 0 .8rem; }
.ad-checks .check { align-items: flex-start; }
.ad-checks .check input { margin-top: .15rem; flex: none; }
.ad-checks .hint { display: block; font-size: .8rem; color: var(--muted); }
.ad-pw { display: flex; gap: .4rem; align-items: stretch; flex-wrap: wrap; }
.ad-pw input { flex: 1 1 12rem; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; letter-spacing: .04em; }
.ad-sect { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; margin: .6rem 0 .3rem; }
.ad-cred { display: grid; grid-template-columns: max-content 1fr; gap: .3rem 1rem; padding: .7rem .8rem; background: var(--surface-2); border: 1px solid var(--line-strong); margin: .6rem 0; }
.ad-cred dt { color: var(--muted); font-size: .85rem; }
.ad-cred dd { margin: 0; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; overflow-wrap: anywhere; user-select: all; }

/* ---------- backup ---------- */
.ad-file { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin: .6rem 0; }
.ad-file input[type=file] { flex: 1 1 260px; min-width: 0; max-width: 100%; border-style: dashed; }
.ad-panel-danger { border-color: var(--danger); }
.ad-panel-danger > .ph { border-bottom-color: var(--danger); }
.ad-stack > .panel + .panel { margin-top: 1rem; }

/* ---------- Notion import wizard ---------- */
.ad-steps { display: flex; gap: 0; margin: 0 0 1rem; padding: 0; list-style: none; border: 1px solid var(--line-strong); background: var(--surface); counter-reset: st; overflow-x: auto; }
.ad-steps li { flex: 1 1 0; padding: .45rem .7rem; border-right: 1px solid var(--line); color: var(--muted); white-space: nowrap; counter-increment: st; font-size: .9rem; }
.ad-steps li:last-child { border-right: 0; }
.ad-steps li::before { content: counter(st) ". "; font-weight: 700; }
.ad-steps li.on { color: var(--accent-ink); background: var(--accent); font-weight: 600; }
.ad-steps li.done { color: var(--text); }
.ad-steps li.done::after { content: " ✓"; color: var(--ok); }
.ad-scroll { max-height: 22rem; overflow: auto; }
.ad-scroll thead th { position: sticky; top: 0; z-index: 1; }
.ad-wiz-foot { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; justify-content: flex-end; margin-top: 1rem; padding-top: .8rem; border-top: 1px solid var(--line-strong); }
.ad-wiz-foot .grow { margin-right: auto; }
.ad-opts { display: flex; gap: .6rem 1.4rem; flex-wrap: wrap; align-items: flex-end; }
.ad-opts .field { margin-bottom: 0; min-width: 14rem; }
.ad-fam { display: inline-flex; flex-wrap: wrap; }
.ad-fam { padding: 0 1px 1px 0; }
.ad-fam > button { padding: .2rem .5rem; font-size: .82rem; margin: 0 -1px -1px 0; }
.ad-fam > button.on { background: var(--accent); color: var(--accent-ink); border-color: var(--line-strong); font-weight: 600; }
.ad-fam > button.on.ign { background: var(--surface-2); color: var(--muted); }
.ad-guess { font-size: .75rem; color: var(--muted); }

/* ---------- account page ---------- */
.ad-me { display: flex; gap: .8rem; align-items: center; margin-bottom: .8rem; }
.ad-me .av { width: 2.6rem; height: 2.6rem; font-size: 1rem; }
.ad-roles { list-style: none; margin: 0; padding: 0; }
.ad-roles li { display: flex; gap: .6rem; align-items: center; justify-content: space-between; padding: .45rem 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.ad-roles li:last-child { border-bottom: 0; }
.ad-home { display: grid; gap: .3rem; }
.ad-home .check { padding: .25rem 0; align-items: flex-start; }
.ad-home .check input { margin-top: .2rem; flex: none; }

/* ---------- phones: tables become stacked cards ---------- */
@media (max-width: 700px) {
  .ad-cols { grid-template-columns: 1fr; }
  .ad-table:not(.ad-keep) thead { display: none; }
  .ad-table:not(.ad-keep), .ad-table:not(.ad-keep) tbody, .ad-table:not(.ad-keep) tr, .ad-table:not(.ad-keep) td { display: block; width: 100%; }
  .ad-table:not(.ad-keep) tr { border-bottom: 1px solid var(--line-strong); padding: .35rem 0; }
  .ad-table:not(.ad-keep) tr.grp { padding: 0; }
  .ad-table:not(.ad-keep) td { border: 0; padding: .15rem .6rem; display: flex; gap: .6rem; align-items: center; min-height: 0; }
  .ad-table:not(.ad-keep) td[data-label]::before { content: attr(data-label); flex: 0 0 6.6rem; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; }
  .ad-table:not(.ad-keep) td.ad-act { width: 100%; justify-content: flex-end; flex-wrap: wrap; padding-top: .3rem; }
  .ad-table:not(.ad-keep) td.ad-num, .ad-table:not(.ad-keep) td.ad-narrow { width: 100%; text-align: left; }
  .ad-table:not(.ad-keep) td > * { min-width: 0; }
  .ad-table:not(.ad-keep) td > .ad-in, .ad-table:not(.ad-keep) td > select, .ad-table:not(.ad-keep) td > div { flex: 1 1 auto; }
  .ad-table.ad-keep th, .ad-table.ad-keep td { padding-left: .4rem; padding-right: .4rem; }
  .ad-table .chip { white-space: normal; }
  .ad-table tbody tr:hover { background: none; }
  input.ad-in, select.ad-in { border-color: var(--line); }
  input.ad-sw { width: 2.4rem; height: 2.2rem; min-height: 0; }
  .ad-poles { grid-template-columns: 1fr; gap: .2rem; }
  .ad-poles > .chip { margin-top: .4rem; }
  .ad-steps li { padding: .4rem .5rem; font-size: .82rem; }
  .ad-opts .field { min-width: 0; flex: 1 1 100%; }
  .ad-cred { grid-template-columns: 1fr; gap: 0; }
  .ad-cred dd { margin-bottom: .4rem; }
}
