/*
 * Jarsh app styles. Tokens come from the Jarsh design system (tokens.json):
 * two colours, Crimson Blaze and Shield Gray, plus white; Montserrat throughout.
 * Red is the signal, so it is used sparingly: the active tab, the one primary
 * action on a screen, and the send button. Small red text uses crimson-700.
 */
@font-face{font-family:"Montserrat";src:url("fonts/Montserrat-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --crimson:#dc2b2d; --crimson-700:#b02224; --crimson-900:#84191b;
  --gray:#423e3e; --gray-900:#272525; --gray-400:#545151; --gray-300:#676464; --gray-100:#8d8b8b;
  --white:#ffffff;
  --line:rgba(66,62,62,.14); --wash:rgba(66,62,62,.045); --wash-2:rgba(66,62,62,.08);
  --ok:#2f6f4f; --font:"Montserrat","Segoe UI",Arial,sans-serif;
  --hdr:56px; --nav:64px; --r:16px; --r-sm:10px;
  --safe-b:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.jx{margin:0;font-family:var(--font);font-size:15px;line-height:1.5;color:var(--gray);background:var(--white);-webkit-font-smoothing:antialiased}
body.jx a{color:inherit}
.jx-app{min-height:100dvh;display:flex;flex-direction:column}

/* ---------- header ---------- */
.jx-hdr{position:sticky;top:0;z-index:30;height:var(--hdr);display:flex;align-items:center;gap:16px;padding:0 16px;padding-top:env(safe-area-inset-top,0px);background:var(--white);border-bottom:1px solid var(--line)}
.jx-logo{display:block;height:30px;width:auto}
.jx-hdr-sp{flex:1}
.jx-user{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:500;color:var(--gray-400)}
.jx-av{width:32px;height:32px;border-radius:50%;background:var(--gray);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:700;letter-spacing:.02em}
.jx-out{font-size:12px;font-weight:600;color:var(--gray-300);text-decoration:none;padding:6px 10px;border-radius:999px}
.jx-out:hover{background:var(--wash)}
.jx-user-name{display:none}

/* ---------- navigation: bottom bar on phones, inline on wide screens ---------- */
.jx-nav{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;height:calc(var(--nav) + var(--safe-b));padding-bottom:var(--safe-b);background:var(--white);border-top:1px solid var(--line)}
.jx-nav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;font-size:11px;font-weight:600;color:var(--gray-300);min-width:0}
.jx-nav svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.jx-nav a[aria-current="page"]{color:var(--crimson-700)}
.jx-nav a[aria-current="page"] svg{stroke:var(--crimson)}
.jx-main{flex:1;padding-bottom:calc(var(--nav) + var(--safe-b))}

@media (min-width:900px){
  .jx-user-name{display:inline}
  .jx-nav{position:static;order:0;height:auto;padding:0;border:0;background:none;gap:4px;margin-left:24px}
  .jx-nav a{flex:none;flex-direction:row;gap:8px;font-size:13px;padding:8px 14px;border-radius:999px}
  .jx-nav a:hover{background:var(--wash)}
  .jx-nav a[aria-current="page"]{background:var(--wash-2);color:var(--gray)}
  .jx-nav svg{width:18px;height:18px}
  .jx-main{padding-bottom:0}
}

/* ---------- buttons ---------- */
.jx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 14px var(--font);border:0;border-radius:999px;padding:11px 20px;cursor:pointer;text-decoration:none;transition:background .15s,transform .05s}
.jx-btn:active{transform:translateY(1px)}
.jx-btn-primary{background:var(--crimson);color:#fff}
.jx-btn-primary:hover{background:var(--crimson-700)}
.jx-btn-primary:disabled{background:var(--gray-100);cursor:default}
.jx-btn-quiet{background:var(--wash-2);color:var(--gray)}
.jx-btn-quiet:hover{background:rgba(66,62,62,.13)}
.jx-btn:focus-visible,.jx-chip:focus-visible,.jx-send:focus-visible,.jx-in:focus-visible{outline:2px solid var(--gray);outline-offset:2px}

/* ---------- Sakshi chat ---------- */
.sk{display:flex;flex-direction:column;height:calc(100dvh - var(--hdr) - var(--nav) - var(--safe-b));max-width:780px;margin:0 auto}
@media (min-width:900px){.sk{height:calc(100dvh - var(--hdr))}}
.sk-log{flex:1;overflow-y:auto;padding:20px 16px 20px;display:flex;flex-direction:column;gap:14px;scroll-behavior:smooth}
.sk-log{min-height:0}
.sk-log>*{flex-shrink:0}
.sk-hero{margin:auto 0;padding:8px 0 4px}
.sk-hero-mark{width:48px;height:48px;border-radius:14px;background:var(--gray);display:grid;place-items:center;margin-bottom:18px}
.sk-hero-mark img{width:28px;height:auto}
.sk-hero h1{margin:0 0 8px;font-size:clamp(22px,6vw,30px);line-height:1.2;font-weight:800;letter-spacing:-.01em;color:var(--gray)}
.sk-hero p{margin:0 0 20px;color:var(--gray-300);font-size:15px;max-width:34em}
.sk-chips{display:flex;flex-wrap:wrap;gap:8px}
.jx-chip{font:600 13px var(--font);color:var(--gray);background:var(--white);border:1px solid var(--line);border-radius:999px;padding:9px 14px;cursor:pointer;text-align:left}
.jx-chip:hover{background:var(--wash);border-color:rgba(66,62,62,.3)}

.sk-row{display:flex;gap:10px;align-items:flex-end;max-width:100%}
.sk-row.me{justify-content:flex-end}
.sk-av{flex:none;width:30px;height:30px;border-radius:50%;background:var(--gray);display:grid;place-items:center}
.sk-av img{width:17px;height:auto}
.sk-b{max-width:min(82%,560px);padding:11px 15px;border-radius:var(--r);font-size:15px;line-height:1.5;overflow-wrap:anywhere}
.sk-row.bot .sk-b{background:var(--wash);border-bottom-left-radius:4px}
.sk-row.me .sk-b{background:var(--gray);color:#fff;border-bottom-right-radius:4px}
.sk-row.err .sk-b{background:#fff;border:1px solid var(--crimson);color:var(--crimson-700)}
.sk-b p{margin:0}.sk-b p+p,.sk-b ul+p,.sk-b p+ul{margin-top:8px}
.sk-b ul{margin:0;padding-left:20px}.sk-b li{margin:2px 0}
.sk-b b{font-weight:700}
.sk-typing{display:inline-flex;gap:4px;padding:4px 2px}
.sk-typing i{width:7px;height:7px;border-radius:50%;background:var(--gray-100);animation:skdot 1s infinite ease-in-out}
.sk-typing i:nth-child(2){animation-delay:.15s}.sk-typing i:nth-child(3){animation-delay:.3s}
@keyframes skdot{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){.sk-typing i{animation:none;opacity:.7}.sk-log{scroll-behavior:auto}}

/* quote card */
.sk-card{margin-left:40px;margin-bottom:4px;scroll-margin-bottom:12px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;max-width:600px;box-shadow:0 1px 2px rgba(39,37,37,.05)}
.sk-card-h{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-bottom:1px solid var(--line)}
.sk-card-h small{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gray-300)}
.sk-card-h b{font-size:15px;font-weight:700}
.sk-lines{padding:4px 16px}
.sk-line{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:11px 0;border-bottom:1px solid var(--wash-2)}
.sk-line:last-child{border-bottom:0}
.sk-line-n{font-weight:600;font-size:14px}
.sk-line-m{grid-column:1;font-size:12px;color:var(--gray-300)}
.sk-line-a{grid-row:1;grid-column:2;font-weight:700;font-variant-numeric:tabular-nums}
.sk-tier{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.05em;padding:2px 7px;border-radius:999px;background:var(--wash-2);color:var(--gray);margin-left:6px;vertical-align:1px}
.sk-sum{display:flex;justify-content:space-between;align-items:baseline;padding:12px 16px;background:var(--wash);font-size:13px;color:var(--gray-300)}
.sk-sum b{font-size:18px;font-weight:800;color:var(--gray);font-variant-numeric:tabular-nums}
.sk-act{display:flex;flex-wrap:wrap;gap:8px;padding:14px 16px}
.sk-ok{padding:14px 16px;font-size:14px;display:flex;gap:10px;align-items:flex-start}
.sk-ok svg{flex:none;width:20px;height:20px;stroke:var(--ok);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;margin-top:1px}

/* composer */
.sk-comp{padding:10px 12px calc(10px + 0px);background:linear-gradient(to top,var(--white) 70%,rgba(255,255,255,0))}
.sk-form{display:flex;align-items:flex-end;gap:8px;background:var(--white);border:1px solid rgba(66,62,62,.28);border-radius:26px;padding:6px 6px 6px 18px;box-shadow:0 2px 10px rgba(39,37,37,.06)}
.sk-form:focus-within{border-color:var(--gray);box-shadow:0 2px 12px rgba(39,37,37,.12)}
.jx-in{flex:1;border:0;outline:0;background:none;font:500 15px/1.4 var(--font);color:var(--gray);padding:9px 0;resize:none;max-height:120px;min-height:22px}
.jx-in::placeholder{color:var(--gray-100)}
.jx-send{flex:none;width:40px;height:40px;border:0;border-radius:50%;background:var(--crimson);color:#fff;display:grid;place-items:center;cursor:pointer}
.jx-send:hover{background:var(--crimson-700)}
.jx-send:disabled{background:var(--gray-100);cursor:default}
.jx-send svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sk-foot{display:flex;justify-content:center;gap:14px;padding:6px 0 0;font-size:11px;color:var(--gray-100)}
.sk-foot button{all:unset;cursor:pointer;font-size:11px;font-weight:600;color:var(--gray-300);text-decoration:underline;text-underline-offset:2px}

/* ---------- Quotes page ---------- */
.q{max-width:1100px;margin:0 auto;padding:20px 16px 8px}
.q h1{margin:0 0 4px;font-size:26px;font-weight:800;letter-spacing:-.01em}
.q-sub{margin:0 0 18px;color:var(--gray-300);font-size:14px}
.q-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.q-stat{background:var(--wash);border-radius:var(--r);padding:14px 16px}
.q-stat b{display:block;font-size:22px;font-weight:800;line-height:1.2;font-variant-numeric:tabular-nums}
.q-stat span{font-size:11px;font-weight:600;color:var(--gray-300);letter-spacing:.03em}
.q-stat.due b{color:var(--crimson-700)}
.q-filter{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.q-filter select,.q-filter input[type=text],.q-filter input:not([type]){font:500 13px var(--font);color:var(--gray);background:var(--white);border:1px solid var(--line);border-radius:999px;padding:9px 14px}
.q-filter label{font-size:13px;font-weight:500;display:flex;gap:6px;align-items:center}
.q-list{display:flex;flex-direction:column;gap:10px}
.q-item{display:grid;grid-template-columns:1fr auto;gap:6px 14px;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;background:var(--white)}
.q-item.is-due{border-color:rgba(220,43,45,.5)}
.q-no{font-weight:700;font-size:15px}
.q-flag{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--crimson-700);border:1px solid rgba(176,34,36,.4);border-radius:999px;padding:1px 7px;margin-left:6px;vertical-align:1px}
.q-cust{font-size:14px;color:var(--gray-400)}
.q-meta{font-size:12px;color:var(--gray-300)}
.q-amt{grid-row:1;grid-column:2;text-align:right;font-weight:800;font-size:17px;font-variant-numeric:tabular-nums}
.q-ctl{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-top:8px;border-top:1px solid var(--wash-2)}
.q-ctl select,.q-ctl input{font:500 13px var(--font);color:var(--gray);border:1px solid var(--line);border-radius:999px;padding:7px 12px;background:#fff}
.q-ctl label{display:flex;align-items:center;gap:8px;min-width:0}
.q-ctl input[type=date]{width:140px;min-width:0}
.q-ctl select{max-width:100%}
.q-ctl a{margin-left:auto;font-size:13px;font-weight:700;color:var(--crimson-700);text-decoration:none}
.q-empty{padding:40px 16px;text-align:center;color:var(--gray-300)}
.q-sav{outline:2px solid var(--ok);outline-offset:2px}
@media (min-width:760px){.q-item{grid-template-columns:1.1fr 1.5fr auto;align-items:center}.q-amt{grid-row:auto;grid-column:auto}.q-ctl{grid-column:1/-1}}

/* ---------- legacy dashboards (incentive / admin) inside the shell ---------- */
.jx .jid{font-family:var(--font)!important;background:var(--white)!important;max-width:1100px;margin:0 auto}
.jx .jid-topbar{display:none!important}
.jx .jid *{font-family:inherit}
.jx .jid h1,.jx .jid h2,.jx .jid h3,.jx .jid-target-big,.jx .jid-tn-v{font-family:var(--font)!important;font-weight:800}

/* ---------- login ---------- */
body.login{background:var(--white)!important;font-family:var(--font)}
body.login #login{width:min(380px,92vw);padding-top:7vh}
body.login h1 a{background:url("img/jarsh-logo-vertical.svg") center/contain no-repeat!important;width:190px!important;height:150px!important;margin:0 auto 18px!important}
body.login form{border:1px solid var(--line)!important;border-radius:var(--r)!important;box-shadow:none!important;padding:26px!important;background:var(--white)!important}
body.login label{font-weight:600;color:var(--gray);font-size:13px}
body.login .input,body.login input[type=text],body.login input[type=password]{border:1px solid rgba(66,62,62,.28)!important;border-radius:12px!important;padding:10px 12px!important;font:500 15px var(--font)!important;box-shadow:none!important}
body.login .input:focus{border-color:var(--gray)!important;outline:2px solid rgba(66,62,62,.15)}
body.login .button-primary{background:var(--crimson)!important;border:0!important;border-radius:999px!important;font:700 14px var(--font)!important;padding:6px 22px!important;height:auto!important;text-shadow:none!important;box-shadow:none!important}
body.login .button-primary:hover{background:var(--crimson-700)!important}
body.login #nav,body.login #backtoblog,body.login .privacy-policy-page-link,body.login .language-switcher{display:none!important}
body.login #nav a{color:var(--gray-300)!important}
body.login .message,body.login #login_error{border-left-color:var(--crimson)!important;border-radius:10px}

/* ---------- quote log: source and edited markers ---------- */
.q-stats{grid-template-columns:repeat(auto-fit,minmax(104px,1fr))}
.q-src{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--gray-300);background:var(--wash-2);border-radius:999px;padding:2px 8px;margin-left:6px;vertical-align:1px}
.q-edit{display:inline-block;font-size:11px;font-weight:700;color:#fff;background:var(--crimson-700);border-radius:999px;padding:2px 9px;margin-left:6px;vertical-align:1px}
.q-det{grid-column:1/-1;border-top:1px solid var(--wash-2);padding-top:6px}
.q-det summary{cursor:pointer;font-size:12px;font-weight:700;color:var(--gray-300);padding:4px 0;list-style:none}
.q-det summary::-webkit-details-marker{display:none}
.q-det summary::before{content:"\25B8";display:inline-block;margin-right:6px;transition:transform .15s}
.q-det[open] summary::before{transform:rotate(90deg)}
.q-li{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--wash);font-size:13px}
.q-li:last-child{border-bottom:0}
.q-li-r{text-align:right;font-variant-numeric:tabular-nums}
.q-li.ed .q-li-r{color:var(--crimson-700);font-weight:700}
.q-li .q-edit{display:block;margin:4px 0 0 auto;width:max-content;max-width:100%;font-weight:700}

/* ---------- New quote (manual) ---------- */
.nq{max-width:720px;margin:0 auto;padding:20px 16px 8px}
.nq h1{margin:0 0 4px;font-size:26px;font-weight:800;letter-spacing:-.01em}
.nq-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:12px}
.nq-lbl{display:block;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gray-300);margin:0 0 6px}
.nq-card .nq-lbl:not(:first-child){margin-top:16px}
.nq-in{width:100%;font:500 15px var(--font);color:var(--gray);background:var(--white);border:1px solid rgba(66,62,62,.28);border-radius:12px;padding:11px 13px;min-width:0}
.nq-in:focus{outline:2px solid rgba(66,62,62,.18);border-color:var(--gray)}
.nq-in[readonly]{background:var(--wash);color:var(--gray-400)}
.nq-in.ed{border-color:var(--crimson);color:var(--crimson-700);font-weight:700;background:#fff}
.cb{position:relative}
.cb-list{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 4px);background:var(--white);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(39,37,37,.14);max-height:280px;overflow:auto}
.cb-opt{all:unset;box-sizing:border-box;display:block;width:100%;padding:10px 14px;cursor:pointer}
.cb-opt:hover,.cb-opt:focus-visible{background:var(--wash)}
.cb-t{display:block;font-size:14px;font-weight:600;color:var(--gray)}
.cb-s{display:block;font-size:12px;color:var(--gray-300)}
.cb-empty{padding:12px 14px;font-size:13px;color:var(--gray-300)}
.nq-sel{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--wash);border-radius:12px;padding:11px 14px}
.nq-chg,.nq-rm{all:unset;cursor:pointer;font:700 12px var(--font);color:var(--crimson-700);text-decoration:underline;text-underline-offset:2px}
.nq-line-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.nq-line-n{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gray-300)}
.nq-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.nq-f{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:600;color:var(--gray-300);min-width:0}
.nq-f:last-child{grid-column:1/-1}
@media (min-width:560px){.nq-grid{grid-template-columns:90px 1fr 1fr}.nq-f:last-child{grid-column:auto}}
.nq-list{margin-top:8px;font-size:12px;color:var(--gray-300)}
.nq-edited{margin-top:6px;font-size:13px;font-weight:700;color:var(--crimson-700)}
.nq-note{margin-top:6px;font-size:13px;font-weight:600;color:var(--crimson-700)}
.nq-amt-row{display:flex;justify-content:space-between;align-items:baseline;margin-top:10px;padding-top:10px;border-top:1px solid var(--wash-2);font-size:13px;color:var(--gray-300)}
.nq-amt-row b{font-size:17px;font-weight:800;color:var(--gray);font-variant-numeric:tabular-nums}
.nq-add{width:100%;margin-bottom:14px}
.nq-bar{position:sticky;bottom:calc(var(--nav) + var(--safe-b));background:var(--white);border-top:1px solid var(--line);margin:0 -16px;padding:10px 16px 12px;display:flex;flex-direction:column;gap:8px}
@media (min-width:900px){.nq-bar{bottom:0}}
.nq-barrow{display:flex;align-items:center;gap:14px}
.nq-tot{display:flex;flex-direction:column;font-size:11px;font-weight:600;color:var(--gray-300);line-height:1.2}
.nq-tot b{font-size:20px;font-weight:800;color:var(--gray);font-variant-numeric:tabular-nums}
.nq-warn,.nq-err{font-size:13px;font-weight:700;color:var(--crimson-700);border:1px solid rgba(176,34,36,.4);border-radius:12px;padding:9px 12px}
.nq-go{flex:1;padding:14px 20px;font-size:15px}
.nq-warn{margin:0 0 12px}

.nq-sync{margin-top:8px;font-size:12px;color:var(--gray-300);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
