/* SALES DESK THEME — shared by the desk, quote and onboarding pages. */
:root {
  --ink:#142536;
  --muted:#566576;
  --paper:#f4f7f8;
  --line:#dce3e7;
  --lime:#caff5c
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:24px
}

body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.65 system-ui,sans-serif
}

header,main {
  width:min(1120px,calc(100% - 40px));
  margin:auto
}

header {
  padding:24px 0;
  display:flex;
  justify-content:space-between;
  border-bottom:1px solid var(--line)
}

header a {
  font-weight:800;
  text-decoration:none
}

header span,.small,.intro {
  color:var(--muted)
}

h1 {
  font-size:clamp(28px,4vw,42px);
  line-height:1.15;
  margin:32px 0 12px;
  letter-spacing:-1px
}

h2 {
  font-size:25px;
  line-height:1.25;
  margin:12px 0 20px
}

h3 {
  font-size:17px
}

a {
  color:inherit;
  text-underline-offset:4px
}

nav {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:24px 0
}

nav a {
  background:white;
  border:1px solid var(--line);
  padding:10px 14px;
  text-decoration:none;
  border-radius:8px;
  font-weight:600
}

section {
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:28px;
  margin-bottom:20px;
  scroll-margin-top:24px
}

.grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px
}

.eyebrow {
  font-size:12px;
  font-weight:800;
  letter-spacing:1.5px;
  color:#526439
}

.button,button {
  display:inline-block;
  background:var(--ink);
  color:white;
  padding:13px 18px;
  border:0;
  border-radius:8px;
  text-decoration:none;
  font:600 15px/1.5 system-ui;
  cursor:pointer
}

.button:hover,button:hover {
  background:#30485c
}

.secondary {
  display:block;
  margin:16px 0
}

.small {
  font-size:13px
}

blockquote {
  margin:0;
  border-left:4px solid var(--lime);
  padding:8px 0 8px 18px
}

footer {
  padding:16px 0 36px;
  font-size:14px
}

iframe {
  width:100%;
  border:0;
  min-height:760px
}

a:focus-visible,button:focus-visible,input:focus-visible {
  outline:3px solid #698f26;
  outline-offset:3px
}

table {
  width:100%;
  border-collapse:collapse
}

th,td {
  text-align:left;
  border-bottom:1px solid var(--line);
  padding:12px 8px
}

label {
  display:block;
  margin:12px 0
}

input {
  display:block;
  width:100%;
  font:inherit;
  padding:10px;
  border:1px solid #97a4af;
  border-radius:6px
}

.badge {
  background:var(--lime);
  padding:5px 10px;
  border-radius:5px;
  font-weight:700;
  font-size:12px
}

@media(max-width:720px) {
  .grid {
  grid-template-columns:1fr;
  gap:0
}

section {
  padding:20px
}

header {
  font-size:13px
}

nav a {
  font-size:13px;
  padding:8px 10px
}


}

@media print {
  header,nav,button,.no-print,footer {
  display:none
}

body {
  background:white;
  font-size:11pt
}

main {
  width:100%
}

section {
  break-inside:avoid;
  border:0;
  padding:0
}

h1 {
  font-size:24pt
}

.grid {
  display:block
}


}


/* Agent guide additions. Scoped so customer pages keep their existing layout. */
.agent-desk .intro { max-width: 820px; }
.agent-desk .guide-nav { margin-top: -10px; }
.agent-desk .guide-nav a { background: transparent; }
.agent-desk .agent-note { color: var(--muted); font-size: 14px; }
.agent-desk .read-aloud {
  color: #9b1c24;
  background: #fff3f2;
  border: 1px solid #edb6b6;
  border-left: 5px solid #b4232e;
  border-radius: 8px;
  padding: 16px 20px;
  margin: 22px 0;
}
.agent-desk .read-aloud h3 { margin: 0 0 8px; color: #8c1720; }
.agent-desk .read-aloud p { margin: 8px 0; }
.agent-desk details { border-top: 1px solid var(--line); padding: 16px 0; }
.agent-desk summary { cursor: pointer; font-weight: 700; font-size: 17px; }
.agent-desk details p { margin: 12px 0 0; }
.agent-desk summary:focus-visible { outline: 3px solid #698f26; outline-offset: 4px; }
.agent-desk .check-row { display: flex; gap: 12px; align-items: flex-start; }
.agent-desk input[type="checkbox"] { width: 20px; height: 20px; flex: 0 0 20px; margin: 4px 0 0; padding: 0; accent-color: var(--ink); }
.agent-desk .copy-result { display: block; font-size: 14px; margin: 8px 0; }
.agent-desk .compact { gap: 28px; }
.agent-desk [hidden] { display: none !important; }
@media (max-width: 720px) {
  .agent-desk .read-aloud { padding: 14px; }
  .agent-desk .button, .agent-desk button { max-width: 100%; white-space: normal; }
  .agent-desk nav a { font-size: 14px; }
}
@media print { .agent-desk .read-aloud { background: white; border: 1px solid #b4232e; } }

/* Optional capabilities are labelled in text so availability is clear. */
.agent-desk .option-label { display: inline-block; font-size: 14px; color: #526439; padding: 2px 8px; border: 1px solid #c8d3ba; border-radius: 5px; }