/* AdsNgin - page-level rules for the pages restyled in ui1-pages (SPEC design pass E2).
   Everything here is scoped under a page's own wrapper class so it never leaks onto the
   Board/Account pages another lane owns. Tokens and shared components stay in adsngin.css;
   this file only adds the column layouts and small variants those pages need. */

/* -- chip variants ------------------------------------------------------------------- */
.an-chip.outline { background: none; border: 1px solid var(--an-line); color: var(--an-idle); }

/* -- a row's right-aligned button/chip cell, reused by the queue and the inbox -------- */
.an-controls { display: flex; gap: 8px; justify-content: flex-end; align-items: center; }

/* -- small layout utilities reused across pages -------------------------------------- */
.an-full { display: flex; width: 100%; }
.an-visually-hidden, .an-card textarea.an-visually-hidden { position: absolute; left: 0; top: 0; width: 1px; height: 1px; min-height: 0; padding: 0; margin: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); }
/* a compact one-line form (label + input + button), e.g. the periodic report's From / To */
.an-inline-form { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; }
.an-inline-form label { display: inline-flex; align-items: center; gap: 6px; margin: 0; white-space: nowrap; }
.an-card .an-inline-form input[type=date], .an-card .an-inline-form input[type=text] { width: auto; }
.an-grid > .an-span-all { grid-column: 1 / -1; }

/* -- title bar: page title + date + filter tabs + search (Actions queue) ------------- */
.an-titlebar { display: flex; align-items: center; gap: 16px; min-height: 44px; margin-bottom: 16px; flex-wrap: wrap; }
.an-titlebar .an-search { width: 240px; }

/* -- Actions queue: one shared row grid across every group -------------------------- */
.an-page-actions .an-queue-grid { grid-template-columns: 18px minmax(120px, 220px) 78px minmax(140px, 1fr) minmax(120px, 1fr) max-content; }
.an-page-actions .an-queue-grid .an-name { white-space: normal; overflow: visible; line-height: 1.3; }
.an-page-actions .an-queue-grid .an-why { flex-wrap: wrap; overflow: visible; row-gap: 4px; }
.an-page-actions .an-queue-grid .an-why { min-width: 0; }
.an-page-actions .an-queue-grid .an-why .an-chip { white-space: normal; height: auto; min-height: 24px; padding: 3px 8px; line-height: 1.3; min-width: 0; max-width: 100%; overflow-wrap: anywhere; border-radius: 12px; }
.an-page-actions .an-bar-cell .an-muted { white-space: nowrap; }
.an-page-actions details.an-table-wrap { margin-bottom: 24px; }
.an-page-actions summary.an-collapsed { cursor: pointer; list-style: none; }
.an-page-actions summary.an-collapsed::-webkit-details-marker { display: none; }
.an-page-actions summary.an-collapsed .an-chev { transition: transform 0.15s ease; }
.an-page-actions details[open] summary.an-collapsed .an-chev { transform: rotate(180deg); }
.an-page-actions .an-done-body { padding: 8px 16px 16px; }
.an-page-actions .an-done-row { display: flex; align-items: center; gap: 12px; padding: 6px 0; border-top: 1px solid var(--an-line); }
.an-page-actions .an-done-row:first-child { border-top: 0; }
@media (max-width: 640px) {
  /* six cells on three columns: dot | name | tier, then the action and its chips under the name, buttons on the right */
  .an-page-actions .an-queue-grid { grid-template-columns: 16px minmax(0, 1fr) auto; grid-template-areas: "dot name tier" ". action action" ". why why" ". ctl ctl"; row-gap: 8px; padding: 10px 12px; }
  .an-page-actions .an-queue-grid > :nth-child(1) { grid-area: dot; }
  .an-page-actions .an-queue-grid > :nth-child(2) { grid-area: name; }
  .an-page-actions .an-queue-grid > :nth-child(3) { grid-area: tier; }
  .an-page-actions .an-queue-grid > :nth-child(4) { grid-area: action; }
  .an-page-actions .an-queue-grid > :nth-child(5) { grid-area: why; }
  .an-page-actions .an-queue-grid > :nth-child(6) { grid-area: ctl; justify-content: flex-start; }
  .an-page-actions .an-queue-grid > :nth-child(6):empty { display: none; }
  .an-page-actions .an-done-row { flex-wrap: wrap; }
}

/* -- Action detail: two-column card grid, timeline, comment thread ------------------ */
.an-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 640px) { .an-detail-grid { grid-template-columns: 1fr; } }
.an-timeline { list-style: none; margin: 0; padding: 0; }
.an-timeline li { display: flex; gap: 12px; padding: 8px 0; border-top: 1px solid var(--an-line); }
.an-timeline li:first-child { border-top: 0; }
.an-timeline time { color: var(--an-muted); min-width: 150px; flex: 0 0 auto; }
.an-comment { padding: 10px 0; border-top: 1px solid var(--an-line); }
.an-comment:first-child { border-top: 0; }
.an-comment .an-who { font-weight: 600; }
.an-btnrow { display: flex; gap: 8px; flex-wrap: wrap; }

/* -- Notifications: one row per notification, four fixed groups ---------------------- */
.an-page-notifications .an-row { grid-template-columns: 18px minmax(160px, 1fr) 160px 140px max-content; padding-top: 8px; padding-bottom: 8px; }
.an-page-notifications .an-name { white-space: normal; overflow: visible; line-height: 1.35; }
@media (max-width: 640px) {
  /* five cells on three columns: dot | title | buttons, then account and time under the title */
  .an-page-notifications .an-row { grid-template-columns: 16px minmax(0, 1fr) auto; grid-template-areas: "dot name ctl" ". acct ctl" ". when ctl"; row-gap: 2px; padding: 10px 12px; }
  .an-page-notifications .an-row > :nth-child(1) { grid-area: dot; }
  .an-page-notifications .an-row > :nth-child(2) { grid-area: name; margin-bottom: 4px; }
  .an-page-notifications .an-row > .an-n-account { grid-area: acct; font-size: 13px; }
  .an-page-notifications .an-row > .an-n-when { grid-area: when; font-size: 13px; }
  .an-page-notifications .an-row > .an-controls { grid-area: ctl; }
}

/* -- Health overview: one row per account, 7-day dot strip --------------------------- */
.an-dots { display: inline-flex; gap: 6px; align-items: center; }
.an-page-health .an-row, .an-page-health .an-thead { grid-template-columns: 18px minmax(140px, 260px) auto minmax(160px, 1fr); }
@media (max-width: 640px) {
  /* four cells on three columns: dot | name | 7-day dots, then the failing checks under the name */
  .an-page-health .an-row { grid-template-columns: 16px minmax(0, 1fr) auto; row-gap: 6px; padding: 10px 12px; }
  .an-page-health .an-row .an-dot:first-child { grid-row: 1; grid-column: 1; }
  .an-page-health .an-row .an-name { grid-row: 1; grid-column: 2; }
  .an-page-health .an-row .an-dots { grid-row: 1; grid-column: 3; }
  .an-page-health .an-row .an-chips { grid-row: 2; grid-column: 2 / -1; flex-wrap: wrap; overflow: visible; }
}

/* -- System / Cost: bar with a target tick and its figure ---------------------------- */
.an-bar-figure { display: flex; align-items: center; gap: 12px; }

/* -- Reports: the two-column report paper -------------------------------------------- */
.an-report { display: flex; gap: 20px; align-items: flex-start; }
.an-report-paper { width: 900px; max-width: 100%; flex: 1 1 900px; display: flex; flex-direction: column; gap: 24px; }
.an-report-side { width: 400px; max-width: 100%; flex: 0 0 400px; display: flex; flex-direction: column; gap: 16px; }
.an-report-section { padding: 16px 0; border-top: 1px solid var(--an-line); }
.an-report-section:first-child { border-top: 0; }
.an-report-metrics { margin-bottom: 0; }
.an-prev-report { display: flex; align-items: center; height: 44px; padding: 0 16px; gap: 12px; border-top: 1px solid var(--an-line); text-decoration: none; color: var(--an-ink); }
.an-prev-report:first-child { border-top: 0; }
.an-prev-report .an-grow { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 640px) {
  .an-report { flex-direction: column; }
  .an-report-paper, .an-report-side { width: 100%; flex: 1 1 auto; }
}
.an-report-chart { width: 100%; max-width: 480px; height: auto; display: block; }
.an-report-chart .bar { fill: var(--an-bar); }
.an-report-chart .bar-calls { opacity: 0.5; }
.an-report-chart .gap { fill: var(--an-faint); opacity: 0.55; height: 2px; transform: translateY(58px); } /* no data: a baseline tick, not a bar */
.an-report-chart text { fill: var(--an-muted); font-family: var(--an-font); }

/* Knowledge module (Cycle 7) */
.an-kn-rule { padding: 12px 0; border-top: 1px solid var(--an-line); }
.an-kn-rule-head { display: flex; align-items: center; gap: 8px; }
.an-kn-rule p { margin: 6px 0 0; }
.an-kn-versions { margin-top: 8px; font-size: 14px; }
.an-kn-versions ul { margin: 8px 0 0; padding-left: 18px; }
.an-kn-note { padding: 12px 0; border-top: 1px solid var(--an-line); }
.an-kn-note p { margin: 8px 0; }
.an-kn-review { overflow-x: auto; }
.an-kn-review table { min-width: 560px; }

/* Client profile + Google Partner gauge (2026-09-29) */
.an-client-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 4px 0 14px; }
.an-client-grid .an-count { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.an-client-grid .an-big { font-size: 24px; }
.an-client-grid .an-big small { font-size: 14px; color: var(--an-muted); }
.an-client .an-kv { font-size: 14px; }
.an-sources { margin-top: 12px; font-size: 13px; }
.an-sources ul { margin: 6px 0 0; padding-left: 18px; }
.an-partner-row { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.an-partner .an-big { font-size: 26px; font-weight: 600; }
.an-partner-bar { height: 8px; border-radius: 4px; background: var(--an-track); overflow: hidden; margin: 8px 0; }
.an-partner-bar i { display: block; height: 100%; background: var(--an-fine); }
.an-small { font-size: 12px; }
.an-table-scroll { overflow-x: auto; }
@media (max-width: 700px) { .an-client-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* fix-monitoring */
.an-btn[disabled], .an-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.an-cost-strip .an-count { justify-content: flex-start; }
.an-daylabels { display: inline-flex; gap: 6px; }
.an-daylabels span { width: 9px; text-align: center; font-size: 9px; overflow: visible; }
.an-legend .an-dot { margin: 0 4px 0 10px; vertical-align: middle; }

/* Reports list on a phone (U31): the periodic form wraps inside its card row */
@media (max-width: 640px) {
  .an-cardrows td[data-label="Periodic"] { flex-wrap: wrap; }
  .an-cardrows td .an-inline-form { flex-wrap: wrap; flex: 1 1 100%; justify-content: flex-start; }
  .an-cardrows td .an-inline-form label { flex: 1 1 130px; }
  .an-cardrows td .an-inline-form label input { min-width: 0; flex: 1; }
}

/* monday-time: The Monday card on the Cost page */
.an-monday-strip .an-count { justify-content: flex-start; }
.an-monday .an-table { margin-top: 12px; }
.an-monday h2 { margin-bottom: 14px; }
.an-monday h2 .an-muted { margin-left: 8px; font-weight: 400; }

/* --- Google Partner checklist (accounts/partner.html) --- */
.an-bar-line { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 8px 0; border-bottom: 1px solid var(--an-line); }
.an-bar-line:last-child { border-bottom: 0; }
.an-bar-line .an-pill { min-width: 64px; justify-content: center; }
.an-partner-form { display: flex; gap: 16px; align-items: flex-end; flex-wrap: wrap; padding: 16px; }
.an-partner-form > div { flex: 1 1 200px; min-width: 0; }
.an-partner-form > div.an-check { flex: 0 0 auto; height: 40px; display: flex; align-items: center; }
.an-partner-form label { display: block; margin-bottom: 4px; }
.an-partner-form .an-check label { margin: 0; }
.an-partner-form + .an-muted { padding: 0 16px 16px; }
/* --- end Google Partner checklist --- */

/* UI-2 phase 2: a clean day on the Health page needs no placeholder dash on a phone */
@media (max-width: 640px) { .an-page-health .an-row .an-chips > .an-muted { display: none; } }

/* SDT3 B3: queue */
.an-page-actions .an-queue-grid .an-why-text { display: block; min-width: 0; line-height: 1.4; overflow-wrap: anywhere; font-size: 13.5px; }
.an-page-actions .an-emptylanes { margin: 0 0 16px; }
.an-emptylanes .an-el + .an-el::before { content: ", "; }
.an-page-actions .an-steps summary { cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.an-page-actions .an-steps p { margin: 6px 0 0; line-height: 1.45; }
.an-tech > summary { cursor: pointer; list-style: none; }
.an-tech > summary::-webkit-details-marker { display: none; }
.an-tech > summary h2 { display: inline; margin: 0; font-size: 15px; }
.an-tech > summary::after { content: "Show"; float: right; text-decoration: underline; font-size: 14px; }
.an-tech[open] > summary::after { content: "Hide"; }

/* SDT3 B3: reports */
.an-page-reports .an-card { margin-bottom: 16px; }
.an-page-reports .an-npill { display: inline-grid; place-items: center; min-width: 24px; height: 22px; padding: 0 7px; border-radius: 11px; background: var(--an-sunk); font-size: 12.5px; font-weight: 600; color: var(--an-muted); margin-left: 8px; }
.an-send-rows { padding: 0 16px 8px; }
.an-send-row { display: flex; align-items: center; gap: 8px 12px; flex-wrap: wrap; padding: 10px 0; border-top: 1px solid var(--an-line); }
.an-send-row:first-child { border-top: 0; }
.an-send-name { font-weight: 600; }
.an-send-none { padding: 4px 16px 14px; margin: 0; }
.an-generate > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.an-generate > summary::-webkit-details-marker { display: none; }
.an-generate > summary .an-link { text-decoration: underline; text-underline-offset: 3px; font-size: 14px; }
.an-generate-body { padding: 0 16px 16px; }
.an-generate-all { display: flex; align-items: center; gap: 8px 14px; flex-wrap: wrap; margin-bottom: 14px; }
.an-rowmenu > summary { list-style: none; cursor: pointer; }
.an-rowmenu > summary::-webkit-details-marker { display: none; }
.an-rowmenu-body { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 0; }
.an-page-reports .an-p2-flush { padding: 0; overflow: hidden; }
.an-page-reports .an-p2-flush .an-table { border: 0; }
.an-page-reports .an-card-head { padding-left: 16px; }
/* SDT3 B3: health reasons and notification rows */
.an-failing-why { padding: 0 16px 10px 46px; font-size: 13.5px; line-height: 1.45; color: var(--an-muted); }
.an-failing-why p { margin: 2px 0; }
.an-failing-why b { color: var(--an-ink); }
.an-page-reports .an-tosend, .an-page-reports .an-generate, .an-page-reports .an-p2-flush { padding: 0; }
.an-page-reports .an-tosend > .an-card-head, .an-page-reports .an-generate > .an-card-head, .an-page-reports .an-p2-flush > .an-card-head { margin: 0; padding: 0 16px; border-radius: 0; }
.an-page-reports .an-generate-body, .an-page-reports .an-send-rows { padding-top: 12px; }
.an-page-actions .an-queue-grid .an-why { white-space: normal; }
.an-page-actions .an-queue-grid .an-why-text { white-space: normal; flex: 1 1 100%; min-width: 0; }