/*!
 * ECL Agency Tool - EC代理店 評価・選定シート
 * 仕様: tools/agency-evaluation/agency-tool-spec.md v1.2 / 根拠: DEC-006
 * すべてのセレクタを #eca-root 配下にスコープし、テーマ・既存機能へ影響させない。
 */

#eca-root {
  --eca-ink: #04384c;
  --eca-line: #d8dee3;
  --eca-bg: #ffffff;
  --eca-soft: #f5f8fa;
  --eca-link: var(--color_link, #1176d4);
  --eca-low: #b3261e;
  --eca-mid: #8a6d00;
  --eca-high: #1b6b3a;
  color: var(--eca-ink);
  font-size: var(--swl-fz--content, 16px);
  line-height: 1.8;
}

#eca-root *,
#eca-root *::before,
#eca-root *::after { box-sizing: border-box; }

#eca-root a:focus-visible,
#eca-root button:focus-visible,
#eca-root input:focus-visible,
#eca-root [tabindex]:focus-visible {
  outline: 3px solid var(--eca-link);
  outline-offset: 2px;
}

#eca-root .eca-app { margin: 0 0 1.5em; }

#eca-root .eca-h { font-size: 1.25em; line-height: 1.4; margin: 0 0 .6em; font-weight: 700; }
#eca-root .eca-h3 { font-size: 1.05em; line-height: 1.4; margin: 1.6em 0 .5em; font-weight: 700; }
#eca-root .eca-h4 { font-size: 1em; line-height: 1.4; margin: 1.2em 0 .4em; font-weight: 700; overflow-wrap: anywhere; word-break: break-word; }
#eca-root .eca-lead { margin: 0 0 1em; }
#eca-root .eca-note { margin: 0 0 1em; }
#eca-root .eca-hint { font-size: .86em; color: #5b6b75; margin: .3em 0 0; }
#eca-root .eca-hint p { margin: 0; }

#eca-root .eca-list { margin: .4em 0 1em; padding-left: 1.4em; }
#eca-root .eca-list li { margin: .2em 0; }
#eca-root .eca-list--tight li { font-size: .92em; }

#eca-root .eca-neutral,
#eca-root .eca-privacy {
  background: var(--eca-soft);
  border: 1px solid var(--eca-line);
  border-radius: 4px;
  padding: .9em 1em;
  margin: 0 0 1.2em;
}
#eca-root .eca-neutral__text,
#eca-root .eca-privacy__text { margin: 0; font-size: .92em; }

#eca-root .eca-btn {
  display: inline-block;
  font: inherit;
  font-weight: 700;
  line-height: 1.4;
  padding: .75em 1.4em;
  min-height: 44px;
  border-radius: 4px;
  border: 1px solid var(--eca-ink);
  background: #fff;
  color: var(--eca-ink);
  cursor: pointer;
}
#eca-root .eca-btn--primary { background: var(--eca-ink); color: #fff; }
#eca-root .eca-btn--ghost { background: #fff; }
#eca-root .eca-btn--quiet { border-color: var(--eca-line); color: #5b6b75; font-weight: 400; }
#eca-root .eca-btn--danger { border-color: var(--eca-low); color: var(--eca-low); font-weight: 400; }
#eca-root .eca-btn[disabled] { opacity: .5; cursor: not-allowed; }

#eca-root .eca-nav { display: flex; gap: .8em; flex-wrap: wrap; margin: 1.6em 0 0; }
#eca-root .eca-tools { margin: 2em 0 0; padding-top: 1em; border-top: 1px solid var(--eca-line); }

#eca-root .eca-prog { height: 8px; background: var(--eca-soft); border-radius: 4px; overflow: hidden; margin: 0 0 .4em; }
#eca-root .eca-prog__bar { height: 100%; background: var(--eca-ink); transition: width .2s ease; }
#eca-root .eca-prog__text { font-size: .86em; color: #5b6b75; margin: 0 0 1.2em; }

#eca-root .eca-qs { margin: 0 0 1em; }
#eca-root .eca-q { padding: 1.1em 0; border-top: 1px solid var(--eca-line); }
#eca-root .eca-q__text { margin: 0 0 .7em; font-weight: 700; }
#eca-root .eca-choices { display: flex; flex-direction: column; gap: .5em; }
#eca-root .eca-choices__sep { height: 1px; background: var(--eca-line); margin: .5em 0; }

#eca-root .eca-choice {
  display: flex;
  align-items: center;
  gap: .7em;
  width: 100%;
  min-height: 44px;
  text-align: left;
  font: inherit;
  padding: .6em .9em;
  border: 1px solid var(--eca-line);
  border-radius: 4px;
  background: #fff;
  color: inherit;
  cursor: pointer;
}
#eca-root .eca-choice__mark {
  flex: 0 0 auto;
  width: 18px; height: 18px;
  border: 2px solid #9aa7b0;
  border-radius: 50%;
}
#eca-root .eca-choice[aria-checked="true"] { border-color: var(--eca-ink); background: var(--eca-soft); }
#eca-root .eca-choice[aria-checked="true"] .eca-choice__mark {
  border-color: var(--eca-ink);
  box-shadow: inset 0 0 0 4px var(--eca-ink);
}
#eca-root .eca-choice--unconfirmed { border-style: dashed; }

#eca-root .eca-subject { padding: 1em 0; border-top: 1px solid var(--eca-line); }
#eca-root .eca-subject__label { display: block; font-weight: 700; margin: 0 0 .3em; }
#eca-root .eca-input {
  display: block;
  width: 100%;
  font: inherit;
  font-size: 16px;
  line-height: 1.5;
  padding: .6em .8em;
  border: 1px solid var(--eca-line);
  border-radius: 4px;
  background: #fff;
  color: inherit;
}

#eca-root .eca-error {
  margin: 1em 0 0;
  padding: .7em .9em;
  border: 1px solid var(--eca-low);
  border-radius: 4px;
  color: var(--eca-low);
  font-weight: 700;
}

#eca-root .eca-readiness,
#eca-root .eca-subjectres,
#eca-root .eca-compare,
#eca-root .eca-checklist,
#eca-root .eca-save,
#eca-root .eca-more,
#eca-root .eca-biz {
  border: 1px solid var(--eca-line);
  border-radius: 4px;
  padding: 1em 1.1em;
  margin: 0 0 1.2em;
}
#eca-root .eca-readiness { background: var(--eca-soft); }
#eca-root .eca-readiness__score { margin: 0 0 .6em; }
#eca-root .eca-subjname { font-weight: 700; overflow-wrap: anywhere; word-break: break-word; }

#eca-root .eca-num { font-size: 1.3em; font-weight: 700; }
#eca-root .eca-num__max { font-size: .9em; color: #5b6b75; }
#eca-root .eca-lv { display: inline-block; margin-left: .6em; font-size: .88em; font-weight: 700; }
#eca-root .eca-lv--low { color: var(--eca-low); }
#eca-root .eca-lv--mid { color: var(--eca-mid); }
#eca-root .eca-lv--high { color: var(--eca-high); }

#eca-root .eca-cats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7em; margin: .8em 0; }
#eca-root .eca-cat { border: 1px solid var(--eca-line); border-radius: 4px; padding: .7em .8em; }
#eca-root .eca-cat--total { grid-column: 1 / -1; background: var(--eca-soft); }
#eca-root .eca-cat__name { margin: 0 0 .2em; font-size: .9em; font-weight: 700; }
#eca-root .eca-cat__score { margin: 0; }

#eca-root .eca-unconf { border-left: 4px solid var(--eca-mid); padding-left: .9em; margin: 1em 0; }
#eca-root .eca-lows { border-left: 4px solid var(--eca-low); padding-left: .9em; margin: 1em 0; }

#eca-root .eca-warn {
  border: 1px solid var(--eca-line);
  border-left: 4px solid var(--eca-mid);
  border-radius: 4px;
  background: #fffdf5;
  padding: .9em 1em;
  margin: 1em 0;
}
#eca-root .eca-warn__title { margin: 0 0 .4em; font-weight: 700; }
#eca-root .eca-warn__mark { margin-right: .4em; }
#eca-root .eca-warn__body { margin: 0; font-size: .94em; }
#eca-root .eca-warn__items { margin: .6em 0 0; padding-left: 1.4em; font-size: .92em; }

#eca-root .eca-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
#eca-root .eca-table { width: 100%; border-collapse: collapse; font-size: .92em; min-width: 480px; }
#eca-root .eca-table__cap { text-align: left; font-size: .86em; color: #5b6b75; padding: 0 0 .5em; }
#eca-root .eca-table th,
#eca-root .eca-table td { border: 1px solid var(--eca-line); padding: .5em .6em; text-align: left; vertical-align: top; }
#eca-root .eca-table thead th { background: var(--eca-soft); }
#eca-root .eca-table th { overflow-wrap: anywhere; word-break: break-word; }
#eca-root .eca-table__total td,
#eca-root .eca-table__total th { background: var(--eca-soft); font-weight: 700; }
#eca-root .eca-bestmark { font-size: .82em; color: var(--eca-high); font-weight: 700; }
#eca-root .eca-compare__note { margin: .8em 0 0; font-size: .92em; }

#eca-root .eca-chk--unconf { font-weight: 700; }
#eca-root .eca-save__row { display: flex; gap: .8em; flex-wrap: wrap; margin: .6em 0; }
#eca-root .eca-link { color: var(--eca-link); text-decoration: underline; overflow-wrap: anywhere; }
#eca-root .eca-biz__lead { margin: 0 0 .3em; font-weight: 700; }
#eca-root .eca-biz__body { margin: 0 0 .6em; font-size: .94em; }

#eca-root .eca-dialog {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0, 0, 0, .45);
  display: flex; align-items: center; justify-content: center;
  padding: 1em;
}
#eca-root .eca-dialog__box {
  background: #fff; border-radius: 6px; padding: 1.2em 1.3em;
  max-width: 32em; width: 100%;
}
#eca-root .eca-dialog__text { margin: 0 0 1em; }
#eca-root .eca-dialog__row { display: flex; gap: .8em; justify-content: flex-end; flex-wrap: wrap; }

@media (max-width: 480px) {
  #eca-root .eca-h { font-size: 1.15em; }
  #eca-root .eca-cats { grid-template-columns: 1fr; }
  #eca-root .eca-nav .eca-btn,
  #eca-root .eca-save__row .eca-btn { width: 100%; }
  #eca-root .eca-dialog__row .eca-btn { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
  #eca-root .eca-prog__bar { transition: none; }
}

@media print {
  #eca-root .eca-btn,
  #eca-root .eca-nav,
  #eca-root .eca-tools,
  #eca-root .eca-save,
  #eca-root .eca-biz,
  #eca-root .eca-dialog { display: none !important; }
  #eca-root .eca-subjectres { break-inside: avoid; page-break-inside: avoid; }
  #eca-root .eca-lv--low,
  #eca-root .eca-lv--mid,
  #eca-root .eca-lv--high { color: #000 !important; }
  #eca-root .eca-tablewrap { overflow: visible; }
  #eca-root .eca-table { min-width: 0; }
  #eca-root .eca-warn { background: #fff !important; border-left-width: 3px; }
}
