/* Trial UX additions. Screen only — trial.css collapses the whole app to the notice when printing.
   Inherits the app's own tokens and type. */

.ux-identity{border-left:4px solid #146c55}

/* --- compact progress: one line, detail behind a disclosure -------------------------------------- */
.ux-progress{margin:0 0 24px}
.ux-ms{background:#fff;border:1px solid var(--line);border-radius:9px}
.ux-ms>summary{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;padding:12px 18px;
  cursor:pointer;list-style:none;font-size:14px}
.ux-ms>summary::-webkit-details-marker{display:none}
.ux-ms>summary::after{content:"Show detail";margin-left:auto;color:#146c55;font-size:13px;
  text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.ux-ms[open]>summary::after{content:"Hide detail"}
.ux-ms-summary{font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.ux-ms-caveat{color:#4f6169;font-size:13.5px}
.ux-ms-list{list-style:none;margin:0;padding:0 18px 6px;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2px}
.ux-ms-list li{display:flex;gap:9px;align-items:baseline;padding:6px 8px;border-radius:6px;font-size:13.5px}
.ux-ms-list li.met{background:#eef6f2}
.ux-ms-list li span[aria-hidden]{color:#93a6ad;font-size:11px}
.ux-ms-list li.met span[aria-hidden]{color:#146c55}
.ux-ms-state{margin-left:auto;font-size:11px;letter-spacing:1px;text-transform:uppercase;
  color:#74858d;white-space:nowrap}
.ux-ms-list li.met .ux-ms-state{color:#146c55}
.ux-ms-links{margin:0;padding:0 18px 14px;font-size:13.5px;color:#4f6169}

/* --- six tiles ------------------------------------------------------------------------------------ */
.ux-tiles{list-style:none;margin:22px 0 30px;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px}
.ux-tile{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px;
  display:flex;flex-direction:column;gap:8px}
.ux-tile.touched{border-color:#7cb6a2}
.ux-tile-head{display:flex;gap:10px;align-items:baseline;justify-content:space-between}
.ux-tile-n{font-size:12px;color:#74858d;font-variant-numeric:tabular-nums}
.ux-tile-touched{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#146c55}
.ux-tile h3{margin:0;font-size:18px}
.ux-tile p{margin:0;font-size:13.5px;color:#4f6169;line-height:1.55}
.ux-tile-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:10px}
.ux-tile-actions button{flex:1;min-width:140px}
.ux-subs{list-style:none;margin:2px 0 0;padding:12px 0 0;border-top:1px solid #e8edef;display:grid;gap:6px}
.ux-subs[hidden]{display:none}
.ux-subs button{text-align:left;padding:8px 0;min-height:44px}

/* --- risk panel ----------------------------------------------------------------------------------- */
.ux-context{background:#f4f8f7;border:1px solid #d5e3de;border-radius:9px;padding:16px 18px;margin:0 0 20px}
.ux-context h4{margin:0 0 12px;font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:#4f6169}
.ux-ctx-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ux-ctx.wide{grid-column:1/-1}
.ux-ctx h5{margin:0 0 3px;font-size:11.5px;letter-spacing:1px;text-transform:uppercase;color:#74858d;font-weight:650}
.ux-ctx p{margin:0;font-size:14px;line-height:1.55;white-space:pre-wrap}
.ux-none{color:#74858d;font-style:italic}
.ux-calc{display:block;font-size:13px;color:#4f6169;margin-top:3px}

@media(max-width:760px){
  .ux-ctx-grid{grid-template-columns:1fr}
  .ux-tiles{grid-template-columns:1fr}
  .ux-tile-actions button{flex:1 1 100%}
  .ux-ms>summary{padding:12px 14px}
  .ux-ms-list{padding:0 14px 6px}
  .ux-ms>summary::after{margin-left:0}
}
@media print{.ux-progress,.ux-tiles,.ux-context,.ux-identity{display:none!important}}

/* --- grouped wizard pages (same rules as the desktop candidate) --- */

/* --- grouped wizard pages ------------------------------------------------------------------- */
/* Several related questions share a page. The shipped rules already show any .wizard-current
   element, so this only spaces them and handles the labels. */
.guided-mode.wizard-grouped .wizard-current+.wizard-current{margin-top:34px;padding-top:30px;border-top:1px solid #e8edef}
.wizard-question-title[data-grouped-suppressed]{display:none!important}
.guided-mode.wizard-grouped .wizard-current label>.field-label-text,
.guided-mode.wizard-grouped .wizard-current .list-field-label{font-size:15px;text-transform:none;letter-spacing:0;color:#19343f;font-weight:650;margin-bottom:8px}
.guided-mode.wizard-grouped .entry-field textarea{min-height:110px}
.guided-mode.wizard-grouped .entry-help{margin-top:12px}
/* Keep question names available to screen readers without repeating them visibly.
   The trial does not load guide.css, so it needs this rule here. */
.sr-only,.visually-hidden-label{position:absolute!important;width:1px;height:1px;margin:-1px;
  padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

.ux-identity[hidden],#ux-tailoring-page[hidden]{display:none!important}