/* Page-scoped styles: loaded only on the pages that use them (see inc/enqueue.php). */


/* Free tools hub + tool pages. */
/* Visibility first: the hidden attribute always wins over display rules. */
.webot-tool [hidden] { display: none !important; }
.webot-toolwrap {
  width: 100%;
  max-width: 56rem;
  margin: 0 auto;
  padding: 0 1.25rem;
}
.webot-toolwrap--wide {
  max-width: 74rem;
}
.webot-tool__head h2 {
  margin: 0 0 0.3rem;
  font-size: 1.25rem;
}
.webot-tool__head p {
  margin: 0 0 1.4rem;
  color: var(--webot-muted, #6b6763);
  font-size: 0.92rem;
}
.webot-tool__hint {
  display: block;
  margin-top: 0.35rem;
  color: var(--webot-muted, #6b6763);
  font-size: 0.82rem;
}
.webot-tool {
  border: 1px solid var(--webot-line, #e5e2dd);
  border-radius: 18px;
  padding: clamp(1.4rem, 3vw, 2.2rem);
  background: var(--webot-surface, #fff);
  box-shadow: 0 10px 34px rgba(0, 0, 0, 0.06);
}
.webot-tool__row {
  margin-bottom: 1.1rem;
}
.webot-tool__row--half {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.1rem;
}
@media (max-width: 48rem) {
  .webot-tool__row--half { grid-template-columns: 1fr; gap: 0; }
}
.webot-tool label {
  display: block;
  font-weight: 600;
  font-size: 0.92rem;
  margin-bottom: 0.4rem;
}
.webot-tool__count {
  font-weight: 400;
  color: var(--webot-muted, #6b6763);
  font-size: 0.82rem;
}
.webot-tool input,
.webot-tool select,
.webot-tool textarea {
  width: 100%;
  padding: 0.7rem 0.9rem;
  border: 1px solid var(--webot-line, #e5e2dd);
  border-radius: 10px;
  font: inherit;
  background: #fff;
}
.webot-tool input:focus,
.webot-tool select:focus,
.webot-tool textarea:focus {
  outline: 2px solid var(--webot-scarlet, #e0231f);
  outline-offset: 1px;
}
.webot-tool__actions {
  display: flex;
  gap: 0.7rem;
  flex-wrap: wrap;
  margin: 1.2rem 0 1rem;
}
.webot-tool__output {
  background: #16161a;
  color: #7ef0b2;
  font-family: Consolas, monospace;
  font-size: 0.88rem;
  border-radius: 12px;
  padding: 1rem;
  min-height: 220px;
  resize: vertical;
}
.webot-tool__warning {
  background: #fdeaea;
  border: 1px solid #e8a1a1;
  border-left: 4px solid #b32d2e;
  border-radius: 10px;
  padding: 0.8rem 1rem;
  font-weight: 600;
  font-size: 0.92rem;
  color: #7a1f1f;
}
.webot-tool__error {
  background: #fff7e6;
  border: 1px solid #f0d9a8;
  border-left: 4px solid #d98f00;
  border-radius: 10px;
  padding: 0.7rem 1rem;
  font-size: 0.9rem;
  color: #7a5a00;
  margin-bottom: 1rem;
}
.webot-tool__outwrap {
  border: 1px solid var(--webot-line, #e5e2dd);
  border-radius: 12px;
  overflow: hidden;
}
.webot-tool__outhead {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 0.55rem 1rem;
  background: var(--webot-alt, #f6f4f1);
  border-bottom: 1px solid var(--webot-line, #e5e2dd);
  font: 600 0.85rem Consolas, monospace;
}
.webot-tool__outsize {
  font-weight: 400;
  color: var(--webot-muted, #6b6763);
}
.webot-tool .webot-tool__output {
  border: 0;
  border-radius: 0;
  margin: 0;
}
.webot-tool__wa {
  margin-top: 0.4rem;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 1.4rem;
  align-items: start;
  border: 1px solid var(--webot-line, #e5e2dd);
  border-radius: 14px;
  padding: 1.2rem;
  background: var(--webot-alt, #f6f4f1);
}
@media (max-width: 48rem) {
  .webot-tool__wa { grid-template-columns: 1fr; }
}
.webot-tool__walabel {
  display: block;
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--webot-muted, #6b6763);
  margin-bottom: 0.35rem;
}
.webot-tool__wa-link a {
  word-break: break-all;
  font-weight: 600;
  color: var(--webot-scarlet, #e0231f);
  font-size: 0.95rem;
}
.webot-tool__wa-qr {
  display: grid;
  gap: 0.7rem;
  justify-items: center;
}
.webot-tool__wa-qr img {
  border: 1px solid var(--webot-line, #e5e2dd);
  border-radius: 12px;
  background: #fff;
}
/* Tool result components (batch 2 engines). */
.webot-tool__checks {
  display: grid;
  gap: 0.5rem;
}
.webot-tool__checks label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 500;
}
.webot-tool__checks input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--webot-scarlet, #e0231f);
}
.webot-tool__query {
  display: block;
  padding: 0.6rem 0.8rem;
  background: var(--webot-alt, #f6f4f1);
  border-radius: 8px;
  font: 600 0.85rem Consolas, monospace;
  word-break: break-all;
}
.webot-tool__list {
  margin-top: 1.2rem;
}
.webot-tool__outline {
  list-style: none;
  padding: 0;
  display: grid;
  gap: 0.35rem;
}
.webot-tool__outline code {
  background: var(--webot-alt, #f6f4f1);
  border-radius: 6px;
  padding: 0.1rem 0.4rem;
  font-size: 0.8rem;
  font-weight: 700;
}
.wt-o-h1 { font-weight: 700; font-size: 1.05em; }
.wt-o-h2 { padding-left: 1rem; }
.wt-o-h3 { padding-left: 2rem; }
.wt-o-h4, .wt-o-h5, .wt-o-h6 { padding-left: 3rem; color: var(--webot-muted, #6b6763); }
.webot-tool__dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.45rem 1rem;
  margin: 0;
}
.webot-tool__dl dt {
  font-weight: 700;
  font-size: 0.88rem;
}
.webot-tool__dl dd {
  margin: 0;
  word-break: break-word;
  font-size: 0.92rem;
}
.webot-tool__ok {
  color: #0a7d33;
  font-weight: 600;
}
.webot-tool__err {
  color: #b32d2e;
  font-weight: 600;
}
.webot-tool__tablewrap {
  margin-top: 1.2rem;
  overflow-x: auto;
}
.webot-tool__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}
.webot-tool__table th,
.webot-tool__table td {
  border: 1px solid var(--webot-line, #e5e2dd);
  padding: 0.55rem 0.8rem;
  text-align: left;
}
.webot-tool__table th {
  background: var(--webot-alt, #f6f4f1);
}
.wt-d-ok { color: #0a7d33; font-weight: 700; }
.wt-d-low { color: #b37c00; font-weight: 600; }
.wt-d-high { color: #b32d2e; font-weight: 700; }
.webot-tool__ed {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2rem;
}
@media (max-width: 56rem) {
  .webot-tool__ed { grid-template-columns: 1fr; }
}
.webot-tool__ed-pane label {
  display: block;
  margin-bottom: 0.4rem;
}
.webot-tool__preview {
  border: 1px solid var(--webot-line, #e5e2dd);
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}
.webot-tool__preview iframe {
  display: block;
  width: 100%;
  height: 420px;
  border: 0;
  background: #fff;
}
.webot-tool__preview.wt-narrow iframe {
  width: 375px;
  max-width: 100%;
  margin: 0 auto;
  box-shadow: 0 0 0 1px var(--webot-line, #e5e2dd);
}

.webot-tool__h2 {
  font-size: 1.4rem;
  margin: 2.2rem 0 0.9rem;
}
.webot-tool__steps {
  padding-left: 1.3rem;
  display: grid;
  gap: 0.5rem;
}
.webot-tool__related {
  margin-top: 1.6rem;
  padding: 1rem 1.2rem;
  background: var(--webot-alt, #f6f4f1);
  border-radius: 12px;
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.webot-tool__auditbox {
  text-align: center;
}
.webot-tool__auditbox h2 {
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
}