/* «Почему?» in Goals: row button and the agent analysis page in the same tab. */

.goals-agent-why {
  display: inline-flex;
  align-items: center;
  margin: 5px 0 0 8px;
  border: 1px solid var(--blue);
  border-radius: 6px;
  background: var(--n3);
  color: var(--blue);
  font: inherit;
  font-size: 10.5px;
  font-weight: 760;
  line-height: 1;
  padding: 4px 8px;
  cursor: pointer;
  vertical-align: middle;
}
.goals-agent-why:hover { border-color: var(--blue); background: var(--blue-tint); color: var(--n14); }
.goals-agent-why:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.goals-agent-why.is-ready { border-color: var(--teal); background: var(--teal-tint); color: var(--green); }
.goals-agent-why.is-ready:hover { border-color: var(--green); background: var(--green-tint); color: var(--green); }
.goals-agent-why.is-ready:focus-visible { outline-color: var(--teal); }
.goals-agent-list-model select { max-width: 210px; }

#goalsDashboard.goals-agent-open > :not(.goals-agent-page) { display: none !important; }
.goals-agent-page { display: grid; gap: 16px; min-width: 0; color: var(--n13); }
.goals-agent-page[hidden] { display: none; }
.goals-agent-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.goals-agent-top { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 14px 18px; }
.goals-agent-back {
  border: 1px solid var(--n7);
  border-radius: 7px;
  background: var(--n3);
  color: var(--n13);
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  padding: 8px 12px;
  cursor: pointer;
}
.goals-agent-back:hover { border-color: var(--n9); background: var(--n5); }
.goals-agent-heading { flex: 1 1 320px; min-width: 0; }
.goals-agent-heading h2 { margin: 3px 0 0; color: var(--n14); font-size: 22px; font-weight: 780; letter-spacing: -.015em; overflow-wrap: anywhere; }
.goals-agent-heading p { margin: 4px 0 0; color: var(--n10); font-size: 12px; }
.goals-agent-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; }
.goals-agent-model { display: inline-flex; align-items: center; gap: 8px; color: var(--n10); font-size: 12px; }
.goals-agent-model select { max-width: 220px; }
.goals-agent-readonly { border: 1px solid var(--n7); border-radius: 999px; color: var(--n11); font-size: 11px; padding: 5px 10px; }

.goals-agent-help { border: 1px solid var(--n7); border-radius: 10px; background: var(--n2); }
.goals-agent-help > summary { padding: 13px 16px; color: var(--teal); font-size: 13px; font-weight: 700; cursor: pointer; }
.goals-agent-help summary:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; border-radius: 5px; }
.goals-agent-help-body { padding: 0 18px 18px; max-width: 1080px; color: var(--n13); font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
.goals-agent-help-body p { margin: 0 0 12px; }
.goals-agent-help-body h4 { margin: 22px 0 8px; color: var(--n14); font-size: 14px; }
.goals-agent-help-body ul { margin: 8px 0 16px; padding-left: 22px; }
.goals-agent-help-body li + li { margin-top: 6px; }
.goals-agent-help-body > p:last-child { margin-bottom: 0; }
.goals-agent-help-topics { display: grid; gap: 8px; margin-top: 18px; }
.goals-agent-help-topics > details { border: 1px solid var(--n6); border-radius: 8px; background: var(--n3); padding: 0 14px; }
.goals-agent-help-topics summary { padding: 12px 0; color: var(--n14); font-weight: 650; cursor: pointer; }
.goals-agent-help-topics summary span { display: inline-block; margin-left: 8px; color: var(--n11); font-size: 11px; font-weight: 400; }

.goals-agent-status:empty { display: none; }
.goals-agent-status { display: grid; gap: 8px; padding: 14px 16px; border: 1px solid var(--n6); border-radius: 10px; background: var(--n2); font-size: 12.5px; }
.goals-agent-status p { margin: 0; }
.goals-agent-stage p { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.goals-agent-steps { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; padding: 0; list-style: none; }
.goals-agent-steps li { border: 1px solid var(--n6); border-radius: 999px; color: var(--n10); font-size: 11px; padding: 4px 10px; }
.goals-agent-steps li.is-done { border-color: var(--teal); color: var(--teal); }
.goals-agent-steps li.is-current { border-color: var(--blue); background: var(--blue-tint); color: var(--n14); font-weight: 750; }
.goals-agent-spinner {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 4px;
  border: 2px solid var(--blue-strong);
  border-top-color: var(--blue);
  border-radius: 50%;
  vertical-align: -2px;
  animation: goals-agent-spin .9s linear infinite;
}
@keyframes goals-agent-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .goals-agent-spinner { animation: none; } }

.goals-agent-error, .goals-agent-page .is-error { color: var(--red); }
.goals-agent-warning { margin: 8px 0 0; color: var(--amber); font-size: 12px; }
.goals-agent-muted { margin: 0; color: var(--n10); font-size: 12px; line-height: 1.5; }
.goals-agent-link { border: 0; background: none; color: var(--blue); font: inherit; text-decoration: underline; cursor: pointer; padding: 0; }

.goals-agent-plan { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; margin: 0; overflow: hidden; border: 1px solid var(--n5); border-radius: 10px; background: var(--n5); }
.goals-agent-plan div { padding: 10px 12px; background: var(--n2); }
.goals-agent-plan dt { color: var(--n10); font-size: 11px; }
.goals-agent-plan dd { margin: 4px 0 0; color: var(--n14); font-size: 14px; font-weight: 750; overflow-wrap: anywhere; }

.goals-agent-analysis h4, .goals-agent-panel h4 { margin: 18px 0 8px; color: var(--n14); font-size: 13px; font-weight: 780; }
.goals-agent-analysis .seo-section-title, .goals-agent-chat .seo-section-title, .goals-agent-history-section .seo-section-title { margin: 0 0 12px; }
.goals-agent-verdict { display: grid; gap: 8px; padding: 14px; border: 1px solid var(--n7); border-radius: 10px; background: var(--n3); }
.goals-agent-verdict[data-verdict="behind_due_to_causes"] { border-color: var(--amber-strong); background: var(--n2); }
.goals-agent-verdict[data-verdict="normal_variance"] { border-color: var(--teal); background: var(--n2); }
.goals-agent-verdict[data-verdict="limit_reached"], .goals-agent-verdict[data-verdict="data_not_loaded"] { border-color: var(--red-strong); background: var(--n2); }
.goals-agent-verdict-label { width: fit-content; border-radius: 999px; background: var(--blue-tint); color: var(--n14); font-size: 11px; font-weight: 800; padding: 4px 10px; text-transform: uppercase; letter-spacing: .03em; }
.goals-agent-summary p, .goals-agent-message-text p { margin: 0 0 6px; line-height: 1.55; }
.goals-agent-summary p:last-child, .goals-agent-message-text p:last-child { margin-bottom: 0; }
.goals-agent-causes, .goals-agent-recommendations { display: grid; gap: 10px; margin: 0; padding-left: 22px; }
.goals-agent-cause { padding: 16px 18px; border: 1px solid var(--n6); border-radius: 10px; background: var(--n2); }
.goals-agent-cause-head { display: grid; gap: 9px; }
.goals-agent-cause-head strong { color: var(--n14); font-size: 14px; line-height: 1.5; }
.goals-agent-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.goals-agent-chips span { border: 1px solid var(--n7); border-radius: 999px; color: var(--n12); font-size: 10.5px; padding: 2px 8px; }
.goals-agent-cause[data-likelihood="high"] .goals-agent-chips span:nth-child(2) { border-color: var(--red); color: var(--red); }
.goals-agent-evidence { margin-top: 12px; font-size: 12.5px; line-height: 1.5; }
.goals-agent-evidence summary { width: fit-content; color: var(--blue); cursor: pointer; }
.goals-agent-evidence ul { display: grid; gap: 9px; margin: 8px 0 0; padding-left: 18px; color: var(--n13); }
.goals-agent-evidence p { margin: 2px 0; color: var(--n12); }
.goals-agent-evidence small { display: block; font-size: 10.5px; }
.goals-agent-check-details { margin-top: 20px; }
.goals-agent-check-details > summary { color: var(--n11); cursor: pointer; font-size: 13px; }
.goals-agent-check-details > ul { margin-top: 12px; }
.goals-agent-evidence code, .goals-agent-message-text code { border-radius: 4px; background: var(--n1); color: var(--n13); font-size: 11px; padding: 1px 4px; }
.goals-agent-evidence small { color: var(--n10); }
.goals-agent-source { display: block; overflow-wrap: anywhere; }
.goals-agent-checks, .goals-agent-gaps { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: 12.5px; }
.goals-agent-checks li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.goals-agent-check { border-radius: 999px; font-size: 10.5px; font-weight: 780; padding: 2px 8px; background: var(--n5); color: var(--n12); }
.goals-agent-check.is-ok { background: var(--n5); color: var(--teal); }
.goals-agent-check.is-problem { background: var(--red-tint); color: var(--red); }
.goals-agent-check.is-not_available { background: var(--n4); color: var(--n10); }
.goals-agent-recommendations p { margin: 4px 0; color: var(--n12); font-size: 12.5px; }
.goals-agent-recommendations small { color: var(--n10); }
.goals-agent-meta { margin: 14px 0 0; color: var(--n10); font-size: 11.5px; }

.goals-agent-messages { display: grid; gap: 10px; margin: 0 0 12px; padding: 0; list-style: none; }
.goals-agent-message { max-width: min(860px, 100%); padding: 10px 12px; border: 1px solid var(--n6); border-radius: 10px; background: var(--n2); font-size: 13px; }
.goals-agent-message.is-user { justify-self: end; border-color: var(--blue-strong); background: var(--n3); }
.goals-agent-message.is-failed, .goals-agent-message.is-limit_reached { border-color: var(--red-strong); }
.goals-agent-message-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; margin-bottom: 6px; color: var(--n10); font-size: 11px; }
.goals-agent-message-meta strong { color: var(--n13); }
.goals-agent-message-meta time { margin-left: auto; }
.goals-agent-message-text { color: var(--n13); overflow-wrap: anywhere; }
.goals-agent-message-text ul, .goals-agent-message-text ol { margin: 4px 0 6px; padding-left: 20px; }
.goals-agent-md-heading { margin-top: 8px !important; }
.goals-agent-thinking, .goals-agent-message-status { margin: 0; color: var(--n12); font-size: 12px; }
.goals-agent-form { display: grid; gap: 8px; }
.goals-agent-form[hidden] { display: none; }
.goals-agent-form textarea {
  width: 100%;
  min-height: 74px;
  box-sizing: border-box;
  resize: vertical;
  border: 1px solid var(--n7);
  border-radius: 8px;
  background: var(--n1);
  color: var(--n14);
  font: inherit;
  font-size: 13px;
  line-height: 1.45;
  padding: 9px 10px;
}
.goals-agent-form textarea:focus { outline: 2px solid var(--teal); outline-offset: 1px; }
.goals-agent-form-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; color: var(--n10); font-size: 11.5px; }
.goals-agent-form-row [data-ga-counter] { margin-right: auto; }
.goals-agent-send { min-width: 104px; }

.goals-agent-section-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; margin-bottom: 12px; }
.goals-agent-section-head .seo-section-sub { margin: 0; }
.goals-agent-panels { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(460px, 100%), 1fr)); gap: 14px; }
.goals-agent-panel { min-width: 0; padding: 14px; border: 1px solid var(--n5); border-radius: 10px; background: var(--n2); }
.goals-agent-panel header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.goals-agent-panel header h4 { margin: 0; }
.goals-agent-panel.is-unavailable { border-style: dashed; background: var(--n1); }
.goals-agent-panel-note { margin: 6px 0 0; color: var(--n10); font-size: 11.5px; line-height: 1.45; }
.goals-agent-badge { flex: none; border-radius: 999px; font-size: 10px; font-weight: 800; padding: 3px 8px; }
.goals-agent-badge.is-real { background: var(--n5); color: var(--teal); }
.goals-agent-badge.is-partial { background: var(--amber-tint); color: var(--amber); }
.goals-agent-badge.is-unavailable { background: var(--n4); color: var(--n10); }

.goals-agent-chart { margin: 10px 0 0; }
.goals-agent-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.goals-agent-grid line { stroke: var(--n5); stroke-width: 1; }
.goals-agent-grid text { fill: var(--n9); font-size: 10px; }
.goals-agent-line path { fill: none; stroke: var(--ga-line); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.goals-agent-line.is-plan path { stroke-dasharray: 5 4; stroke-width: 1.6; }
.goals-agent-line circle { fill: var(--ga-line); }
.goals-agent-line-0, .goals-agent-legend-0 { --ga-line: var(--blue); }
.goals-agent-line-1, .goals-agent-legend-1 { --ga-line: var(--amber); }
.goals-agent-line-2, .goals-agent-legend-2 { --ga-line: var(--green); }
.goals-agent-line-3, .goals-agent-legend-3 { --ga-line: var(--red); }
.goals-agent-line-4, .goals-agent-legend-4 { --ga-line: var(--violet); }
.goals-agent-line-5, .goals-agent-legend-5 { --ga-line: var(--n11); }
.goals-agent-chart figcaption { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 4px; color: var(--n12); font-size: 11px; }
.goals-agent-chart figcaption span::before { display: inline-block; width: 14px; height: 0; margin-right: 6px; border-top: 2px solid var(--ga-line); content: ""; vertical-align: middle; }
.goals-agent-chart figcaption span.is-plan::before { border-top-style: dashed; }

.goals-agent-table-wrap { max-height: 340px; margin-top: 10px; overflow: auto; border: 1px solid var(--n5); border-radius: 8px; }
.goals-agent-table { width: 100%; border-collapse: collapse; font-size: 11.5px; font-variant-numeric: tabular-nums; }
.goals-agent-table th, .goals-agent-table td { padding: 6px 8px; border-bottom: 1px solid var(--n4); text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.goals-agent-table th { position: sticky; top: 0; background: var(--n3); color: var(--n11); font-weight: 750; white-space: nowrap; }
.goals-agent-table td { color: var(--n13); }

.goals-agent-history { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.goals-agent-history button {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
  width: 100%;
  border: 1px solid var(--n6);
  border-radius: 8px;
  background: var(--n2);
  color: var(--n13);
  font: inherit;
  font-size: 12px;
  text-align: left;
  padding: 8px 10px;
  cursor: pointer;
}
.goals-agent-history button:hover:not(:disabled) { border-color: var(--blue); background: var(--n3); }
.goals-agent-history button:disabled { border-color: var(--blue); cursor: default; }
.goals-agent-history time { color: var(--n10); font-variant-numeric: tabular-nums; }
.goals-agent-history em { margin-left: auto; color: var(--blue); font-style: normal; font-size: 11px; }

body.dashboard-design-modern .goals-agent-why { border-color: var(--sky); background: var(--sky-tint); color: var(--design-accent); }
body.dashboard-design-modern :is(.goals-agent-panel, .goals-agent-message, .goals-agent-history button) { border-color: var(--design-border); background: var(--n2); }
body.dashboard-design-modern .goals-agent-plan { border-color: var(--design-border); background: var(--design-border); }
body.dashboard-design-modern .goals-agent-plan div { background: var(--n2); }

@media (max-width: 760px) {
  .goals-agent-actions { justify-content: flex-start; width: 100%; }
  .goals-agent-why { margin-left: 0; }
  .goals-agent-message { max-width: 100%; }
}
