/* Layout rules shared with PSC Tools' dashboards (from its marketing.css and leads.css). */
:root { --pt-accent: #0969da; --pt-accent-soft: rgba(9, 105, 218, .08); }
.mk-wrap { max-width: 1440px; margin: 0 auto; padding: 0 1rem 3rem; }
.mk-head { border-bottom: 2px solid var(--bs-border-color); margin-bottom: 1.25rem; }
.mk-head-top { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-bottom: .6rem; }
.mk-title { font-size: 1.5rem; font-weight: 700; letter-spacing: -.01em; margin: 0; color: var(--bs-emphasis-color); }
.mk-title small { font-size: .85rem; font-weight: 500; color: var(--bs-secondary-color); margin-left: .5rem; }
.mk-status { font-size: .75rem; font-weight: 600; padding: .2rem .55rem; border-radius: 1rem; border: 1px solid; }
.mk-status.on { color: #3fb950; border-color: #2ea043; background: rgba(46, 160, 67, .12); }
.mk-status.off { color: var(--bs-secondary-color); border-color: var(--bs-border-color); }
.mk-tabs { display: flex; gap: .25rem; margin-bottom: -2px; overflow-x: auto; }
.mk-tabs a { padding: .5rem 1rem; font-weight: 600; font-size: .95rem; white-space: nowrap; text-decoration: none;
             color: var(--bs-secondary-color) !important; border-bottom: 3px solid transparent; }
.mk-tabs a:hover { color: var(--bs-emphasis-color) !important; border-bottom-color: var(--bs-border-color); }
.mk-tabs a.active { color: var(--bs-emphasis-color) !important; border-bottom-color: var(--pt-accent); }
.mk-card { background: var(--bs-card-bg); border: 1px solid var(--bs-border-color); border-radius: .6rem;
           margin-bottom: 1rem; box-shadow: 0 1px 3px rgba(0, 0, 0, .18); }
.mk-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; padding: .6rem .9rem;
                background: var(--bs-tertiary-bg); border-bottom: 1px solid var(--bs-border-color);
                border-radius: .6rem .6rem 0 0; }
.mk-card-head h2 { font-size: .95rem; font-weight: 700; margin: 0; color: var(--bs-emphasis-color); }
.mk-card-head .count { font-size: .8rem; color: var(--bs-secondary-color); font-weight: 500; }
.mk-card-head .tools { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.mk-card-body { padding: .9rem; }
.mk-card-body.flush { padding: 0; }
.mk-card .form-label { font-weight: 600; font-size: .8rem; color: var(--bs-body-color); }
.mk-card .table { margin: 0; --bs-table-bg: transparent; }
.mk-card .table th { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color);
                     background: var(--bs-tertiary-bg); border-bottom: 1px solid var(--bs-border-color); padding: .5rem .75rem; }
.mk-card .table td { padding: .5rem .75rem; border-color: var(--bs-border-color); }
.mk-card .table tbody tr:hover { background: var(--pt-accent-soft); }
.mk-hint { font-size: .8rem; color: var(--bs-secondary-color); }
.ld-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.ld-kpi { background: var(--bs-card-bg); border: 1px solid var(--bs-border-color); border-radius: .6rem; padding: .8rem .9rem; }
.ld-kpi-label { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color); }
.ld-kpi-value { font-size: 1.7rem; font-weight: 700; color: var(--bs-emphasis-color); font-variant-numeric: tabular-nums; line-height: 1.2; margin-top: .2rem; }
.ld-kpi-note { font-size: .8rem; color: var(--bs-secondary-color); }
.mk-status.ld-bad { color: var(--bs-body-color); border-color: #d03b3b; }
/* Data Feed dashboard (/data-feed/). Sits on marketing.css + leads.css; theme colours come from Bootstrap vars. */
.df { --df-ok: #2ea043; --df-bad: #d1242f; --df-warn: #bf8700; --df-info: #0969da; }
.df .df-table td, .df .df-table th { vertical-align: top; }
.df .df-row-bad td:first-child { box-shadow: inset 3px 0 0 var(--df-bad); }
.df .df-row-muted td { opacity: .65; }
.df .df-reason { max-width: 32rem; white-space: normal; word-break: break-word; }
.df .df-id { font-family: var(--bs-font-monospace); font-size: .7rem; }
.df .df-pill { display: inline-block; font-size: .72rem; font-weight: 600; padding: .1rem .5rem; border-radius: 1rem;
  border: 1px solid var(--bs-border-color); color: var(--bs-body-color); white-space: nowrap; }
.df .df-pill.ok, .df .df-pill.sent { border-color: var(--df-ok); background: rgba(46, 160, 67, .12); }
.df .df-pill.bad, .df .df-pill.dead { border-color: var(--df-bad); background: rgba(209, 36, 47, .12); }
.df .df-pill.warn, .df .df-pill.failed { border-color: var(--df-warn); background: rgba(191, 135, 0, .14); }
.df .df-pill.info, .df .df-pill.pending { border-color: var(--df-info); background: rgba(9, 105, 218, .12); }
.df .df-pill.muted, .df .df-pill.dryrun { color: var(--bs-secondary-color); }
.df .df-kpi-bad { border-color: var(--df-bad); }
.df .df-problems { border-color: var(--df-bad); }
.df .df-diff { font-size: .8rem; border-collapse: collapse; }
.df .df-diff th { font-weight: 600; padding: .1rem .6rem .1rem 0; color: var(--bs-secondary-color); text-transform: none; letter-spacing: 0; }
.df .df-diff td { padding: .1rem .3rem; border: 0; }
.df .df-diff td.old { text-decoration: line-through; color: var(--bs-secondary-color); }
.df .df-diff td.new { font-weight: 600; }
.df .df-pre { font-size: .72rem; max-height: 20rem; overflow: auto; background: var(--bs-tertiary-bg); padding: .5rem; border-radius: .4rem; }
/* Standalone shell */
.df-top { border-bottom: 1px solid var(--bs-border-color); background: var(--bs-tertiary-bg); }
.df-top .brand { font-weight: 700; color: var(--bs-emphasis-color); text-decoration: none; }
.df-help { margin: 0 0 1rem; font-size: .9rem; }
.df-help summary { cursor: pointer; color: var(--bs-secondary-color); }
.df-auth { max-width: 26rem; margin: 2rem auto; }
.df-doc { max-width: 60rem; }
.df-doc h1 { font-size: 1.4rem; } .df-doc h2 { font-size: 1.15rem; margin-top: 1.5rem; } .df-doc h3 { font-size: 1rem; margin-top: 1.25rem; }
.df-doc table { font-size: .8rem; margin-bottom: 1rem; border-collapse: collapse; }
.df-doc th, .df-doc td { border: 1px solid var(--bs-border-color); padding: .25rem .5rem; vertical-align: top; }
.df-doc pre { background: var(--bs-tertiary-bg); padding: .6rem; border-radius: .4rem; font-size: .8rem; }
.df-doc code { font-size: .85em; }
