/*
 * JSC Complaints & Petitions v36
 * Shared accessibility, typography and responsive layer.
 * Loaded after the legacy/custom theme CSS so it can normalize many historic
 * one-off font sizes without rewriting dozens of working layout files.
 */

@font-face{font-family:Lato;src:url('../fonts/Lato-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Lato;src:url('../fonts/Lato-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

:root{
  --jsc-ui-font:Lato,Arial,Helvetica,sans-serif;
  --jsc-base-font-size:16px;
  --jsc-nav-font-size:16px;
  --jsc-ticket-font-size:16px;
  --jsc-form-font-size:16px;
  --jsc-small-font-size:14px;
  --jsc-ui-line-height:1.55;
  --jsc-heading-scale:1;
  --jsc-touch-target:44px;
  --jsc-focus:#b88700;
}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body:not(.jsc-admin-ui){font-family:var(--jsc-ui-font)!important;font-size:var(--jsc-base-font-size);line-height:var(--jsc-ui-line-height);overflow-wrap:break-word}
body:not(.jsc-admin-ui) button,body:not(.jsc-admin-ui) input,body:not(.jsc-admin-ui) select,body:not(.jsc-admin-ui) textarea{font-family:var(--jsc-ui-font)!important;font-size:var(--jsc-form-font-size);line-height:1.35}
p,li,td,th,label,a,button,input,select,textarea{overflow-wrap:anywhere}
img,video,canvas{max-width:100%;height:auto}
svg{max-width:100%}

/* Preserve keyboard visibility across highly customized pages. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--jsc-focus)!important;outline-offset:3px!important;box-shadow:0 0 0 2px #fff!important
}

/* Minimum interactive target without forcing text links to look like buttons. */
body:not(.jsc-admin-ui) button,body:not(.jsc-admin-ui) .btn,body:not(.jsc-admin-ui) input[type=submit],body:not(.jsc-admin-ui) input[type=button],body:not(.jsc-admin-ui) input[type=reset],body:not(.jsc-admin-ui) select,body:not(.jsc-admin-ui) .jsc-c-btn,body:not(.jsc-admin-ui) .jsc-btn,body:not(.jsc-admin-ui) .jshm-btn{min-height:var(--jsc-touch-target)}
input[type=checkbox],input[type=radio]{min-width:18px;min-height:18px}

/* ---------------- Shared public shell ---------------- */
.jsh-header,.jsf-footer{font-family:var(--jsc-ui-font)!important}
.jsh-brand strong{font-size:calc(28px * var(--jsc-heading-scale))!important}
.jsh-brand small,.jsh-brand em,.jsh-context span{font-size:var(--jsc-small-font-size)!important}
.jsh-context strong{font-size:calc(17px * var(--jsc-heading-scale))!important}
.jsh-nav__item,.jsh-nav.is-full-width .jsh-nav__item:not(.is-search){font-family:var(--jsc-ui-font)!important;font-size:var(--jsc-nav-font-size)!important;line-height:1.25!important;min-height:var(--jsc-touch-target)}
.jsf-brand strong,.jsf-brand small,.jsf-brand em,.jsf-link,.jsf-copyright{font-size:var(--jsc-nav-font-size)!important;line-height:1.35!important}
.jsf-link{min-height:var(--jsc-touch-target);display:inline-flex;align-items:center}

/* Generic mobile-menu button inserted by jsc-accessibility-responsive.js. */
.jsc-mobile-menu-toggle{display:none;align-items:center;justify-content:center;gap:10px;min-height:var(--jsc-touch-target);padding:9px 14px;border:1px solid rgba(255,255,255,.45);border-radius:7px;background:rgba(0,61,45,.92);color:#fff;font:800 var(--jsc-nav-font-size)/1 var(--jsc-ui-font);cursor:pointer;position:relative;z-index:6}
.jsc-mobile-menu-toggle svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

/* ---------------- Public complaint/petition forms ---------------- */
body.jsc-public-form-page{font-family:var(--jsc-ui-font)!important;font-size:var(--jsc-base-font-size)!important;line-height:var(--jsc-ui-line-height)!important;overflow-x:hidden}
.jsc-public-wrap,.jsc-public-shell,.jsc-public-main-column,.jsc-form-sections-grid,.jsc-form-card,.jsc-builder-section,.jsc-engine-grid{min-width:0;max-width:100%}
.jsc-public-heading-v202 h1{font-size:calc(30px * var(--jsc-heading-scale))!important;line-height:1.2!important}
.jsc-public-heading-v202 p,.jsc-public-heading-v202 .secure,.jsc-steps span,.jsc-card-title small,.jsc-field-help,.jsc-upload p,.jsc-side-card p,.jsc-side-card ul,.jsc-side-card li,.jsc-public-form .footer{font-size:var(--jsc-small-font-size)!important;line-height:var(--jsc-ui-line-height)!important}
.jsc-card-title h2,.jsc-bottom-grid h2,.jsc-side-card h3{font-size:calc(18px * var(--jsc-heading-scale))!important;line-height:1.3!important}
.jsc-engine-field label,.jsc-form-card .label,.jsc-choice,.jsc-upload h3,.jsc-bottom-grid p,.jsc-btn,.jsc-hesk-attachment-upload .fileinput-button{font-size:var(--jsc-form-font-size)!important;line-height:1.4!important}
.jsc-engine-field .jsc-fe-input,.jsc-engine-field input[type=text],.jsc-engine-field input[type=email],.jsc-engine-field input[type=tel],.jsc-engine-field input[type=date],.jsc-engine-field select,.jsc-engine-field textarea,.jsc-public-form input,.jsc-public-form select,.jsc-public-form textarea{font-size:var(--jsc-form-font-size)!important;min-height:var(--jsc-touch-target)!important}
.jsc-choice{min-height:32px}
.word-count,.jsc-word-counter,.jsc-help{font-size:var(--jsc-small-font-size)!important}
.jsc-side-hero__caption{font-family:var(--jsc-ui-font)!important;font-size:calc(18px * var(--jsc-heading-scale))!important;line-height:1.3!important}
.jsc-public-sidebar{min-width:0}

/* ---------------- Customer ticket/dashboard ---------------- */
.jsc-c-header,.jsc-c-wrap,.jsc-c-card,.jsc-c-footer{font-family:var(--jsc-ui-font)!important}
.jsc-c-header nav a,.jsc-c-footer,.jsc-c-footer *{font-size:var(--jsc-nav-font-size)!important;line-height:1.4!important}
.jsc-c-brand-text b{font-size:calc(18px * var(--jsc-heading-scale))!important}.jsc-c-brand-text small,.jsc-c-service-mark small,.jsc-c-service-mark b{font-size:var(--jsc-small-font-size)!important}
.jsc-c-titlebar h1{font-size:calc(31px * var(--jsc-heading-scale))!important}.sub,.jsc-c-back,.jsc-c-flash{font-size:var(--jsc-base-font-size)!important}
.jsc-c-summary small,.category,.jsc-c-date-item b,.jsc-c-action-hint,.status,.section-title,.jsc-c-attachments-head h3,.jsc-c-file-meta b,.jsc-c-file-meta small,.jsc-c-empty,.jsc-c-update-count{font-size:var(--jsc-small-font-size)!important;line-height:1.45!important}
.jsc-c-trackline h2{font-size:calc(24px * var(--jsc-heading-scale))!important}
.jsc-c-btn,.jsc-c-mini-btn,.jsc-c-action-grid .jsc-c-btn,.jsc-c-secondary-action a{font-size:var(--jsc-form-font-size)!important;line-height:1.3!important;min-height:var(--jsc-touch-target)!important}
.jsc-c-card .head h2,.jsc-c-thread-item h3{font-size:calc(18px * var(--jsc-heading-scale))!important}
.jsc-c-field-table,.jsc-c-field-table th,.jsc-c-field-table td,.complaint-text,.jsc-c-thread-message,.jsc-c-response-form,.jsc-c-response-form>label,.jsc-c-response-form textarea,.jsc-c-response-files-title,.jsc-c-response-files p,.jsc-c-file-picker,.jsc-c-file-picker input[type=file],.jsc-c-file-limits{font-size:var(--jsc-ticket-font-size)!important;line-height:var(--jsc-ui-line-height)!important}
.jsc-c-thread-meta,.jsc-c-thread-badge,.jsc-c-step-copy small{font-size:var(--jsc-small-font-size)!important}.jsc-c-step-copy b{font-size:var(--jsc-small-font-size)!important;line-height:1.35!important}
.jsc-c-field-table{table-layout:fixed}.jsc-c-field-table th,.jsc-c-field-table td{overflow-wrap:anywhere}

/* ---------------- HESK staff/admin ----------------
   RC66.2A governance: authenticated backend typography and component
   sizing are intentionally NOT normalized here. Admin typography is
   owned by jsc-admin-typography-v66.css and module geometry remains
   with each module stylesheet. Keyboard focus and modal stacking below
   remain shared accessibility responsibilities.
   ------------------------------------------------------------------ */

/* Legacy extension pages using assets/jsc.css receive sane fallbacks too. */
.jsc-ext{font-family:var(--jsc-ui-font)!important;font-size:var(--jsc-base-font-size)!important;line-height:var(--jsc-ui-line-height)!important}
.jsc-ext .jsc-btn,.jsc-ext input,.jsc-ext select,.jsc-ext textarea{font-size:var(--jsc-form-font-size)!important}
.jsc-ext table,.jsc-ext td,.jsc-ext th{font-size:var(--jsc-small-font-size)!important}

/* ---------------- Responsive behavior ---------------- */
@media (max-width:1100px){
  .jsh-brand strong{font-size:calc(23px * var(--jsc-heading-scale))!important}
  .jsf-footer__inner{align-items:flex-start}
}

@media (max-width:900px){
  /* Public shell becomes a real collapsible vertical menu instead of tiny horizontal scrolling text. */
  .jsh-nav{overflow:visible!important;min-height:auto!important}
  .jsh-nav .jsc-mobile-menu-toggle{display:flex;margin:7px 12px 7px auto;min-width:106px;justify-content:center}
  .jsh-nav.is-mobile-ready .jsh-nav__inner{display:none!important;position:absolute!important;top:100%!important;right:12px!important;left:auto!important;width:min(360px,calc(100% - 24px))!important;max-width:none!important;margin:0!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;min-height:0!important;padding:8px!important;overflow:visible!important;background:rgba(0,64,47,.98);border:1px solid #d6a619!important;border-radius:0 0 10px 10px!important;box-shadow:0 14px 28px rgba(0,22,16,.32)!important;z-index:12!important}
  .jsh-nav.is-mobile-ready.is-open .jsh-nav__inner{display:flex!important}
  .jsh-nav__item,.jsh-nav.is-full-width .jsh-nav__item:not(.is-search),.jsh-nav__item.is-search{width:100%!important;max-width:none!important;min-width:0!important;min-height:var(--jsc-touch-target)!important;height:auto!important;flex:0 0 auto!important;justify-content:center!important;text-align:center!important;margin:0!important;padding:12px 14px!important;border-radius:5px!important;font-size:var(--jsc-nav-font-size)!important}
  .jsh-nav__item::after,.jsh-nav__item.is-active::before{display:none!important}.jsh-nav__item.is-active{transform:none!important}
  .jsh-nav__item.is-search .jsh-nav__label{position:static!important;width:auto!important;height:auto!important;margin:0!important;clip:auto!important;overflow:visible!important;white-space:normal!important}
  .jsh-nav__landmark{width:100%!important;opacity:.16!important}

  /* Customer dashboard/withdrawal header mobile menu. */
  .jsc-c-header{flex-wrap:wrap!important;min-height:auto!important;padding:9px 12px!important;gap:10px!important}
  .jsc-c-header .jsc-mobile-menu-toggle{display:flex;margin-left:auto}
  .jsc-c-header.is-mobile-ready nav{display:none!important;width:100%!important;order:10!important;margin:0!important;padding:6px 0!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;border-top:1px solid rgba(255,255,255,.2)}
  .jsc-c-header.is-mobile-ready.is-open nav{display:flex!important}
  .jsc-c-header nav a{width:100%;min-height:var(--jsc-touch-target);display:flex;align-items:center;padding:10px 8px!important;font-size:var(--jsc-nav-font-size)!important}
  .jsc-c-brand{min-width:0!important;flex:1 1 280px}.jsc-c-brand img{max-width:92px}.jsc-c-service-mark{display:none!important}

  .jsc-public-shell,.jsc-form-sections-grid,.jsc-bottom-grid,.jsc-public-sidebar,.jsc-c-dashboard-grid,.jsc-c-summary{grid-template-columns:1fr!important}
  .jsc-public-sidebar{position:static!important}.jsc-form-card,.jsc-c-card{min-width:0}
  .jsc-builder-section .jsc-engine-grid{grid-template-columns:1fr!important}.jsc-builder-section .jsc-engine-field,.jsc-builder-section .jsc-hesk-attachment-upload{grid-column:1!important}
  .jsc-upload{grid-template-columns:1fr!important}.jsc-public-wrap{padding-left:14px!important;padding-right:14px!important}

}

@media (max-width:700px){
  .jsh-header__top{gap:10px!important}.jsh-brand{gap:10px!important}.jsh-brand img{max-width:96px!important}.jsh-brand strong{font-size:calc(18px * var(--jsc-heading-scale))!important}.jsh-brand small,.jsh-brand em{font-size:var(--jsc-small-font-size)!important}
  .jsf-footer__inner{display:grid!important;grid-template-columns:1fr!important;padding:14px 16px!important}.jsf-links{justify-content:flex-start!important;flex-direction:column!important;align-items:stretch!important;width:100%}.jsf-link{width:100%;font-size:var(--jsc-nav-font-size)!important}.jsf-copyright{width:100%;font-size:var(--jsc-small-font-size)!important;white-space:normal!important}

  .jsc-public-heading-v202 h1{font-size:calc(26px * var(--jsc-heading-scale))!important}.jsc-steps{grid-template-columns:1fr 1fr!important}.jsc-steps span{font-size:var(--jsc-small-font-size)!important}
  .jsc-form-actions,.jsc-c-response-actions{display:grid!important;grid-template-columns:1fr!important}.jsc-form-actions>*{width:100%!important;max-width:none!important}
  .jsc-c-wrap{padding:18px 12px 26px!important}.jsc-c-titlebar h1{font-size:calc(26px * var(--jsc-heading-scale))!important}.jsc-c-summary>div{padding:15px!important}.jsc-c-trackline h2{font-size:calc(21px * var(--jsc-heading-scale))!important}
  .jsc-c-action-grid,.jsc-c-action-row{grid-template-columns:1fr!important}.jsc-c-field-table{width:calc(100% - 20px)!important;margin-left:10px!important;margin-right:10px!important}.jsc-c-field-table th{width:42%!important}

}

@media (max-width:480px){
  .jsh-brand img{max-width:78px!important}.jsh-brand strong{font-size:calc(16px * var(--jsc-heading-scale))!important}.jsh-brand small{font-size:12px!important}.jsh-flag{width:40px!important}
  .jsc-steps{grid-template-columns:1fr!important}.jsc-public-wrap{padding:14px 10px 24px!important}.jsc-form-card{padding:12px 10px!important}
  .jsc-c-brand-text b{font-size:calc(16px * var(--jsc-heading-scale))!important}.jsc-c-brand-text small{display:block!important;font-size:12px!important}.jsc-c-brand img{width:76px!important;height:44px!important}
  .jsc-c-field-table,.jsc-c-field-table tbody,.jsc-c-field-table tr,.jsc-c-field-table th,.jsc-c-field-table td{display:block;width:100%!important}.jsc-c-field-table th{border-right:0!important;border-bottom:0!important;padding-bottom:4px!important;font-weight:800!important}.jsc-c-field-table td{padding-top:4px!important}.jsc-c-field-table tr{border-bottom:1px solid #e3ebef}
}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* JSC institutional chrome used by the HESK backend and some legacy public screens. */
body:not(.jsc-admin-ui) .jsc-global-header,body:not(.jsc-admin-ui) .jsc-global-footer,body:not(.jsc-admin-ui) .footer{font-family:var(--jsc-ui-font)!important}
body:not(.jsc-admin-ui) .jsc-global-header__identity strong{font-size:calc(20px * var(--jsc-heading-scale))!important}
body:not(.jsc-admin-ui) .jsc-global-header__identity small,body:not(.jsc-admin-ui) .jsc-global-header__eyebrow{font-size:var(--jsc-small-font-size)!important;line-height:1.35!important}
body:not(.jsc-admin-ui) .jsc-global-header__motto,body:not(.jsc-admin-ui) .jsc-global-footer__brand strong,body:not(.jsc-admin-ui) .jsc-global-footer__brand span,body:not(.jsc-admin-ui) .jsc-global-footer__link,body:not(.jsc-admin-ui) .footer,body:not(.jsc-admin-ui) .footer a{font-size:var(--jsc-nav-font-size)!important;line-height:1.4!important}
body:not(.jsc-admin-ui) .jsc-global-footer__link{min-height:var(--jsc-touch-target)!important}

/* Login/account pages: keep security/help copy and controls comfortably readable. */
.jsc-login-page,.jsc-account-page,body[class*="account"]{font-family:var(--jsc-ui-font)!important;font-size:var(--jsc-base-font-size)!important;line-height:var(--jsc-ui-line-height)!important}
.jsc-login-page input,.jsc-login-page select,.jsc-login-page button,.jsc-account-page input,.jsc-account-page select,.jsc-account-page button{font-size:var(--jsc-form-font-size)!important;min-height:var(--jsc-touch-target)!important}

/* Knowledge base: normalize the legacy 11–12.5px article/list copy seen in v31 styles. */
body.jsc-kb-public,body.jsc-kb-article{font-family:var(--jsc-ui-font)!important;font-size:var(--jsc-base-font-size)!important;line-height:var(--jsc-ui-line-height)!important}
body.jsc-kb-public .jsc-kb-hero__eyebrow,body.jsc-kb-public .topics__list a,body.jsc-kb-public .navlink__descr,body.jsc-kb-public .jsc-kb-help-card p,body.jsc-kb-article .jsc-kb-article-kicker,body.jsc-kb-public .breadcrumbs,body.jsc-kb-article .breadcrumbs{font-size:var(--jsc-small-font-size)!important;line-height:var(--jsc-ui-line-height)!important}
body.jsc-kb-public .jsc-kb-hero p,body.jsc-kb-public #kb_search,body.jsc-kb-public .preview__title,body.jsc-kb-public .jsc-kb-help-card h3,body.jsc-kb-article .block--description,body.jsc-kb-article .ticket__params{font-size:var(--jsc-base-font-size)!important;line-height:var(--jsc-ui-line-height)!important}
body.jsc-kb-public .topics__title,body.jsc-kb-article .ticket__params .accordion-title{font-size:calc(18px * var(--jsc-heading-scale))!important;line-height:1.35!important}

/* Standard HESK customer ticket lookup/view screens. */
body:not(.jsc-admin-ui) .ticket__body,body:not(.jsc-admin-ui) .ticket__params,body:not(.jsc-admin-ui) .ticket__message,body:not(.jsc-admin-ui) .ticket__message p,body:not(.jsc-admin-ui) .ticket__message li,body:not(.jsc-admin-ui) .block--description{font-size:var(--jsc-ticket-font-size)!important;line-height:var(--jsc-ui-line-height)!important}
body:not(.jsc-admin-ui) .form label,body:not(.jsc-admin-ui) .param__label,body:not(.jsc-admin-ui) .label{font-size:var(--jsc-small-font-size)!important;line-height:1.45!important}
body:not(.jsc-admin-ui) .form input,body:not(.jsc-admin-ui) .form select,body:not(.jsc-admin-ui) .form textarea{font-size:var(--jsc-form-font-size)!important;min-height:var(--jsc-touch-target)!important}

/* v35.2 withdrawal audit panel on the customer dashboard. */
.jsc-c-withdrawal-note .meta{font-size:var(--jsc-small-font-size)!important}.jsc-c-withdrawal-note .explain,.jsc-c-withdrawal-note .reason{font-size:var(--jsc-ticket-font-size)!important;line-height:var(--jsc-ui-line-height)!important}

/* =========================================================
   v36.3 — Admin drawers/modals must sit above institutional header
   HESK right-side editors use .right-bar at z-index:20 while the
   JSC institutional header uses z-index:100. Raise the editor layer
   so customer/user/category/profile panels remain fully visible.
   ========================================================= */
body.jsc-admin-ui .right-bar {
    z-index: 2200 !important;
}

/* Keep common HESK modal/blocker layers above the institutional shell too. */
body.jsc-admin-ui .modal,
body.jsc-admin-ui .jquery-modal.blocker,
body.jsc-admin-ui [class*="modal-backdrop"] {
    z-index: 2300;
}

/* A right-bar is a full-screen editing surface; its panel and backdrop
   should cover the JSC header rather than start visually underneath it. */
body.jsc-admin-ui .right-bar .right-bar__body {
    z-index: 1;
}
