/* Architecture tab styling — extends audit.css + dashboard.css */

.arch-hero {
  background: linear-gradient(135deg,#052e2b 0%,#0f766e 45%,#155e75 100%);
  color:#ecfeff; border-radius:20px; padding:44px 40px; margin-bottom:28px;
  box-shadow:0 16px 48px rgba(8,47,73,.28);
}
.arch-hero h1{margin:0 0 8px;font-size:36px;font-weight:800;letter-spacing:-.025em}
.arch-hero .lede{font-size:16px;opacity:.9;max-width:820px;line-height:1.6;margin:0}
.arch-hero .principles{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.arch-hero .principles .p{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);
  border-radius:999px;padding:5px 14px;font-size:12.5px;font-weight:600}

/* current vs future split */
.cf-split{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:22px}
@media(max-width:860px){.cf-split{grid-template-columns:1fr}}
.cf-col{border-radius:14px;padding:22px 24px;border:1px solid var(--border)}
.cf-col.current{background:#fef2f2;border-color:#fecaca}
.cf-col.future{background:#f0fdfa;border-color:#99f6e4}
.cf-col h3{margin:0 0 4px;font-size:18px;display:flex;align-items:center;gap:8px}
.cf-col.current h3{color:#991b1b}
.cf-col.future h3{color:#0f766e}
.cf-col .tagline{font-size:12.5px;color:var(--muted);margin:0 0 14px}
.cf-col ul{margin:0;padding-left:18px;font-size:13.5px;line-height:1.6}
.cf-col li{margin-bottom:7px}
.cf-col.current li::marker{color:#dc2626}
.cf-col.future li::marker{color:#0d9488}

/* layer decision table */
.layer-table{width:100%;border-collapse:collapse;font-size:13.5px;margin:6px 0 8px}
.layer-table th,.layer-table td{padding:11px 13px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.layer-table th{background:#f9fafb;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);position:sticky;top:0}
.layer-table .lyr{font-weight:700;white-space:nowrap}
.layer-table .cur{color:#9a3412}
.layer-table .tgt{color:#0f766e;font-weight:600}
.layer-table code{background:#f1f5f9;padding:1px 6px;border-radius:4px;font-size:12px;color:#0f766e}

.verdict{display:inline-block;padding:2px 9px;border-radius:999px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.verdict.endorse{background:#dcfce7;color:#166534}
.verdict.refine{background:#fef3c7;color:#92400e}
.verdict.replace{background:#fee2e2;color:#991b1b}

/* tech choice cards */
.tech-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.tech-card{border:1px solid var(--border);border-radius:12px;padding:18px 20px;background:#fff;border-top:4px solid #0f766e}
.tech-card h4{margin:0 0 2px;font-size:16px}
.tech-card .stack{color:#0f766e;font-weight:600;font-size:13px;margin:0 0 10px}
.tech-card .row{font-size:12.5px;margin:6px 0;line-height:1.5}
.tech-card .row .k{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;display:block}
.tech-card .why{color:#374151}
.tech-card .alt{color:#9a3412}
.tech-card .uchip{display:inline-block;margin-top:8px;font-size:11px;font-weight:600;padding:2px 8px;border-radius:6px}

/* aws service map */
.aws-map{background:#0b1220;color:#e2e8f0;border-radius:14px;padding:26px;font-family:"SF Mono",Menlo,monospace;
  font-size:12.5px;line-height:1.75;overflow-x:auto;white-space:pre;margin-bottom:8px}
.aws-map .svc{color:#fbbf24}
.aws-map .grp{color:#5eead4}
.aws-map .note{color:#64748b;font-style:italic}
.aws-map .flow{color:#94a3b8}

.aws-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:14px}
.aws-svc{background:#fff;border:1px solid var(--border);border-radius:10px;padding:12px 14px}
.aws-svc .name{font-weight:700;font-size:13px;color:#0f766e}
.aws-svc .purpose{font-size:12px;color:#475569;margin-top:2px;line-height:1.45}

/* migration timeline */
.timeline{position:relative;margin:10px 0 0;padding-left:0}
.tl-phase{display:grid;grid-template-columns:140px 1fr;gap:18px;padding:16px 0;border-bottom:1px solid var(--border)}
.tl-phase:last-child{border-bottom:0}
.tl-when{font-weight:700}
.tl-when .ph{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:#0f766e}
.tl-when .dur{font-size:12px;color:var(--muted);font-weight:500}
.tl-what h4{margin:0 0 6px;font-size:15px}
.tl-what ul{margin:0;padding-left:18px;font-size:13.5px;line-height:1.6}
.tl-what li{margin-bottom:4px}
.tl-tag{display:inline-block;font-size:10px;font-weight:700;padding:1px 7px;border-radius:5px;background:#ccfbf1;color:#0f766e;margin-left:6px}

/* effort chips */
.eff{display:inline-block;width:22px;height:22px;line-height:22px;text-align:center;border-radius:6px;font-size:11px;font-weight:800;color:#fff}
.eff.S{background:#16a34a}.eff.M{background:#ca8a04}.eff.L{background:#ea580c}.eff.XL{background:#dc2626}

.callout{border-left:4px solid #0f766e;background:#f0fdfa;border-radius:0 10px 10px 0;padding:14px 18px;margin:14px 0;font-size:14px;line-height:1.6}
.callout strong{color:#0f766e}

.nav-tabs{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.nav-tabs a{padding:7px 16px;border-radius:999px;border:1px solid var(--border);background:#fff;color:#374151;
  text-decoration:none;font-size:13.5px;font-weight:600}
.nav-tabs a:hover{border-color:#0f766e;color:#0f766e}
.nav-tabs a.active{background:#0f766e;border-color:#0f766e;color:#fff}

/* dependency verdict badges + inventory (General Feedback tab) */
.vd{display:inline-block;padding:2px 9px;border-radius:6px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-family:"SF Mono",Menlo,monospace}
.vd.critical{background:#dc2626;color:#fff}
.vd.high{background:#ea580c;color:#fff}
.vd.moderate{background:#ca8a04;color:#fff}
.vd.current{background:#16a34a;color:#fff}
.dep-table{width:100%;border-collapse:collapse;font-size:12.5px}
.dep-table th,.dep-table td{padding:8px 10px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.dep-table th{background:#f9fafb;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);position:sticky;top:0}
.dep-table td.pkg{font-family:"SF Mono",Menlo,monospace;font-weight:600;white-space:nowrap}
.dep-table td.ver{font-family:"SF Mono",Menlo,monospace}
.dep-table .arrow{color:#0f766e;font-weight:700}
.dep-table td.cve{color:#9a3412;font-size:11.5px}
.dep-table tr.row-critical{background:#fef2f2}
.dep-table tr.row-high{background:#fff7ed}
.dep-vsum{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin:6px 0 18px}
.dep-vsum .v{border-radius:10px;padding:12px 14px;color:#fff}
.dep-vsum .v .n{font-size:26px;font-weight:800;line-height:1}
.dep-vsum .v .l{font-size:11px;text-transform:uppercase;letter-spacing:.05em;opacity:.9;margin-top:3px}
.dep-vsum .v.critical{background:#dc2626}.dep-vsum .v.high{background:#ea580c}.dep-vsum .v.moderate{background:#ca8a04}.dep-vsum .v.current{background:#16a34a}
.inv details{border:1px solid var(--border);border-radius:10px;margin-bottom:8px;padding:0 14px;background:#fff}
.inv details summary{cursor:pointer;padding:12px 0;font-weight:700;font-size:14px}
.inv details[open] summary{border-bottom:1px solid var(--border);margin-bottom:10px}
.inv .eco{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;margin:8px 0 4px}
.inv .pills{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}
.inv .pill{font-family:"SF Mono",Menlo,monospace;font-size:11px;background:#f1f5f9;color:#334155;padding:2px 7px;border-radius:5px}
.inv .pill.rt{background:#ede9fe;color:#5b21b6;font-weight:700}
