/* techdeskportal.net: the partner-portal layout (header band, portal bar, Poppins, footer band) in Techdesk's own
   teal/coral (Jamie 2026-11-01). Generic on purpose: nothing here may name or look like the reseller brand.
   Loaded AFTER techdesk.css by base.html only. One light theme, so the dark block below repeats the light tokens.
   Classes prefixed td- so they never collide with the hub's own. */
@font-face { font-family: "Poppins"; font-weight: 400; font-display: swap; src: url("/static/fonts/poppins-400.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 600; font-display: swap; src: url("/static/fonts/poppins-600.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 700; font-display: swap; src: url("/static/fonts/poppins-700.woff2") format("woff2"); }

:root {
  --brand: #0b4f4a;          /* teal: header, primary actions, headings (white on it 9.4:1) */
  --brand-hover: #16706a;
  --brand-tint: #e6f1ef;     /* icon tiles, SLA tags */
  --brand-ink: #ffffff;
  --accent: #ff7a59;         /* coral: header rule, mark, "ends soon" */
  --accent-ink: #06302d;     /* 5.6:1 on coral */
  --page: #f1f5f9;
  --card: #ffffff;
  --raised: #f8fafc;
  --zebra: #fbfcfe;
  --border: #e2e8f0;
  --border-soft: #eef2f7;
  --border-input: #cbd5e1;
  --text: #334155;
  --muted: #586577;
  --faint: #586577;
  --heading: #0b4f4a;
  --link: #0b4f4a;
  --link-hover: #16706a;
  --primary: var(--brand);
  --primary-ink: #ffffff;
  --primary-hover: var(--brand-hover);
  --danger: #b91c1c;
  --danger-tint: #fef2f2;
  --focus: #0b4f4a;
  --header-bg: var(--brand);
  --header-ink: #ffffff;
  --header-muted: #cde7e3;
  --avatar: #16706a;
  --badge-soon-bg: #ff7a59;  --badge-soon-ink: #06302d;
  --badge-warn-bg: #fff4d1;  --badge-warn-ink: #7a5300;
  --badge-ok-bg: #e7f5ee;    --badge-ok-ink: #14532d;
  --badge-exp-bg: #f1f5f9;   --badge-exp-ink: #475569;
  --bar-track: #eef2f7;
  --dot-1: #0b4f4a; --dot-2: #2f7f78; --dot-3: #6fb0a8; --dot-4: #a9d3cd; --dot-5: #94a3b8;
  --s-1: #0b4f4a; --s-2: #2f7f78; --s-3: #6fb0a8; --s-4: #a9d3cd; --s-other: #94a3b8; --seg-gap: #ffffff;
  --split-30: #ff7a59; --split-60: #ffb9a6; --split-90: #ffe3d9;
  --good: #14532d;
  --notice-bg: #e6f1ef; --notice-ink: #0b4f4a; --notice-rule: #0b4f4a;
  --error-bg: #fef2f2; --error-ink: #7f1d1d; --error-rule: #b91c1c;
  --shadow: 0 1px 2px rgba(15, 23, 42, .04);
  --shadow-lg: 0 10px 30px rgba(11, 79, 74, .08);
  --radius: 12px;
  --radius-sm: 8px;
  --font: "Poppins", system-ui, -apple-system, sans-serif;
  --mono: Consolas, "SF Mono", Menlo, monospace;
  color-scheme: light;
  --td-teal: #0b4f4a; --td-teal-3: #083b37; --td-coral: #ff7a59; --td-ink: #06302d; --td-white: #ffffff;
}
@media (prefers-color-scheme: dark) {
  :root {
  --brand: #0b4f4a;
  --brand-hover: #16706a;
  --brand-tint: #e6f1ef;
  --brand-ink: #ffffff;
  --accent: #ff7a59;
  --accent-ink: #06302d;
  --page: #f1f5f9;
  --card: #ffffff;
  --raised: #f8fafc;
  --zebra: #fbfcfe;
  --border: #e2e8f0;
  --border-soft: #eef2f7;
  --border-input: #cbd5e1;
  --text: #334155;
  --muted: #586577;
  --faint: #586577;
  --heading: #0b4f4a;
  --link: #0b4f4a;
  --link-hover: #16706a;
  --primary: var(--brand);
  --primary-ink: #ffffff;
  --primary-hover: var(--brand-hover);
  --danger: #b91c1c;
  --danger-tint: #fef2f2;
  --focus: #0b4f4a;
  --header-bg: var(--brand);
  --header-ink: #ffffff;
  --header-muted: #cde7e3;
  --avatar: #16706a;
  --badge-soon-bg: #ff7a59;  --badge-soon-ink: #06302d;
  --badge-warn-bg: #fff4d1;  --badge-warn-ink: #7a5300;
  --badge-ok-bg: #e7f5ee;    --badge-ok-ink: #14532d;
  --badge-exp-bg: #f1f5f9;   --badge-exp-ink: #475569;
  --bar-track: #eef2f7;
  --dot-1: #0b4f4a; --dot-2: #2f7f78; --dot-3: #6fb0a8; --dot-4: #a9d3cd; --dot-5: #94a3b8;
  --s-1: #0b4f4a; --s-2: #2f7f78; --s-3: #6fb0a8; --s-4: #a9d3cd; --s-other: #94a3b8; --seg-gap: #ffffff;
  --split-30: #ff7a59; --split-60: #ffb9a6; --split-90: #ffe3d9;
  --good: #14532d;
  --notice-bg: #e6f1ef; --notice-ink: #0b4f4a; --notice-rule: #0b4f4a;
  --error-bg: #fef2f2; --error-ink: #7f1d1d; --error-rule: #b91c1c;
  --shadow: 0 1px 2px rgba(15, 23, 42, .04);
  --shadow-lg: 0 10px 30px rgba(11, 79, 74, .08);
  --radius: 12px;
  --radius-sm: 8px;
  --font: "Poppins", system-ui, -apple-system, sans-serif;
  --mono: Consolas, "SF Mono", Menlo, monospace;
  color-scheme: light;
  }
}

/* ---- header band (the partner portal's website band, generic) ---- */
.td-site { background: var(--td-teal); }
.td-inner { max-width: 1320px; margin: 0 auto; padding: 18px 32px; display: flex; align-items: center; gap: 24px; }
a.td-logo { display: flex; align-items: center; gap: 12px; color: var(--td-white); font-weight: 700; font-size: 26px;
  letter-spacing: .2px; text-decoration: none; }
a.td-logo:hover { color: var(--td-white); text-decoration: none; }
.td-mark { width: 40px; height: 40px; border-radius: 10px; background: var(--td-coral); color: var(--td-ink);
  display: grid; place-items: center; flex: none; }
a.td-help { margin-left: auto; display: inline-flex; align-items: center; background: var(--td-coral); color: var(--td-ink); font-weight: 700;
  font-size: 16px; text-decoration: none; padding: 11px 26px; border-radius: 999px; white-space: nowrap; }
a.td-help:hover { background: var(--td-white); color: var(--td-ink); text-decoration: none; }
.td-site :focus-visible { outline: 2px solid var(--td-coral); outline-offset: 2px; }

/* ---- portal bar ---- */
.site-header { border-top: 1px solid rgba(255, 255, 255, .12); }
.site-header .brand-name { font-weight: 700; }
.who-org { color: #ffb9a6; }       /* light coral: 5.7:1 on teal (full coral is only 3.7:1) */

/* ---- footer: coral band ---- */
.td-footer { background: var(--td-coral); color: var(--td-ink); text-align: center; padding: 26px 16px 22px; font-size: 14px;
  margin-top: 32px; }
.td-footer p { margin: 4px 0; }

@media (max-width: 720px) {
  .td-inner { padding: 14px 16px; justify-content: space-between; }
  a.td-logo { font-size: 21px; gap: 10px; }
  .td-mark { width: 32px; height: 32px; border-radius: 8px; }
  a.td-help { font-size: 14px; padding: 8px 18px; }
}