/* ======================================================
   WEBHVA GLOBAL READABILITY V2
   Medium-size typography across portals
   ====================================================== */

:root{
  --hw-body: 14px;
  --hw-text: 14px;
  --hw-small: 11px;
  --hw-label: 10px;
  --hw-menu: 12px;
  --hw-button: 11px;
  --hw-input: 14px;
}


/* ---------- GLOBAL ---------- */

html,
body{
  font-size:var(--hw-body) !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

body{
  line-height:1.45 !important;
}

p,
li,
td,
th,
label,
input,
textarea,
select{
  font-size:var(--hw-text) !important;
  line-height:1.45 !important;
}


/* ---------- SMALL TEXT ---------- */

small,
.small,
[class*="small"],
[class*="meta"],
[class*="caption"],
[class*="eyebrow"],
[class*="kicker"],
[class*="overline"],
[class*="hint"],
[class*="subtext"]{
  font-size:var(--hw-small) !important;
  line-height:1.45 !important;
}


/* ---------- SIDEBAR / NAV ---------- */

.portal-sidebar a,
.portal-sidebar button,
.portal-nav a,
.portal-nav button,
[class*="sidebar"] a,
[class*="sidebar"] button,
[class*="nav"] a,
[class*="nav"] button{
  font-size:var(--hw-menu) !important;
  line-height:1.35 !important;
}


/* numbers like 01 / 02 */

.portal-sidebar small,
.portal-nav small,
[class*="nav"] small{
  font-size:9px !important;
}


/* ---------- BUTTONS ---------- */

button,
.portal-button,
.client-auth-submit,
[class*="button"],
[class*="btn"]{
  font-size:var(--hw-button) !important;
  line-height:1.25 !important;
  letter-spacing:.045em !important;
}


/* ---------- INPUTS ---------- */

input,
textarea,
select{
  font-size:var(--hw-input) !important;
}

input{
  min-height:42px !important;
}

select{
  min-height:42px !important;
}

textarea{
  min-height:84px;
}

input::placeholder,
textarea::placeholder{
  font-size:13px !important;
  opacity:.76 !important;
}


/* ---------- DASHBOARD STATS ---------- */

.portal-stat-card small,
.portal-stat-card span,
[class*="stat"] small,
[class*="stat"] span{
  font-size:10px !important;
}

.portal-stat-card p,
[class*="stat"] p{
  font-size:11px !important;
}


/* ---------- CARDS ---------- */

.portal-card p,
.portal-panel p,
.portal-empty p,
[class*="card"] p,
[class*="panel"] p{
  font-size:12px !important;
  line-height:1.5 !important;
}


/* ---------- SECTION TITLES ---------- */

.portal-section-head small,
.portal-form-section-title span,
.portal-form-section-title strong{
  font-size:10px !important;
}

.portal-section-head h2{
  font-size:18px !important;
}


/* ======================================================
   CREATE REQUEST / ADD WEBSITE MODALS
   ====================================================== */

.portal-modal{
  font-size:14px !important;
}

.portal-modal h2{
  font-size:28px !important;
  line-height:1.05 !important;
}

.portal-modal-copy{
  font-size:13px !important;
  line-height:1.5 !important;
}

.portal-modal label > span{
  font-size:10px !important;
  line-height:1.35 !important;
  letter-spacing:.07em !important;
}

.portal-modal label > span em{
  font-size:9px !important;
}

.portal-modal input,
.portal-modal select,
.portal-modal textarea{
  font-size:14px !important;
}

.portal-modal input::placeholder,
.portal-modal textarea::placeholder{
  font-size:12px !important;
}


/* request section headings */

.portal-form-section-title{
  gap:8px !important;
}

.portal-form-section-title > span{
  font-size:9px !important;
}

.portal-form-section-title > strong{
  font-size:11px !important;
}


/* individual tasks */

.portal-request-item-head strong{
  font-size:11px !important;
}

.portal-request-item-head button{
  font-size:9px !important;
}


/* form status */

.portal-form-status{
  font-size:11px !important;
  line-height:1.45 !important;
}


/* ---------- SCREENSHOT UPLOADER ---------- */

.portal-screenshot-copy{
  font-size:12px !important;
}

.portal-screenshot-drop strong{
  font-size:12px !important;
}

.portal-screenshot-drop span{
  font-size:11px !important;
}

.portal-screenshot-drop small{
  font-size:9px !important;
}

.portal-screenshot-status{
  font-size:10px !important;
}

.portal-screenshot-item-info strong{
  font-size:11px !important;
}

.portal-screenshot-item-info span{
  font-size:10px !important;
}

.portal-screenshot-item-info small{
  font-size:9px !important;
}

.portal-screenshot-summary{
  font-size:9px !important;
}


/* ---------- PROFILE / USER ---------- */

.portal-top-user strong,
.portal-sidebar-user strong{
  font-size:11px !important;
}

.portal-top-user small,
.portal-sidebar-user small{
  font-size:9px !important;
}


/* ---------- LANG SWITCH ---------- */

.webhva-lang-button{
  font-size:9px !important;
}


/* ---------- AUTH PAGES ---------- */

.client-auth-card label{
  font-size:10px !important;
}

.client-auth-card input{
  font-size:14px !important;
}

.client-auth-copy{
  font-size:13px !important;
}

.client-auth-secondary-link{
  font-size:11px !important;
}

.register-password-meta{
  font-size:9px !important;
}


/* ---------- ADMIN PORTAL ---------- */

.admin-portal,
.admin-shell{
  font-size:14px !important;
}

.admin-portal small,
.admin-shell small{
  font-size:10px !important;
}

.admin-portal input,
.admin-portal textarea,
.admin-portal select,
.admin-shell input,
.admin-shell textarea,
.admin-shell select{
  font-size:14px !important;
}

.admin-portal button,
.admin-shell button{
  font-size:11px !important;
}


/* ---------- MOBILE ---------- */

@media(max-width:760px){

  :root{
    --hw-body:14px;
    --hw-text:14px;
    --hw-small:11px;
    --hw-menu:13px;
    --hw-button:11px;
    --hw-input:14px;
  }

  .portal-modal h2{
    font-size:24px !important;
  }

  .portal-section-head h2{
    font-size:17px !important;
  }
}


/* ======================================================
   WEBHVA REQUEST LIST READABILITY V3
   ====================================================== */


/* ---------- FILTER TABS ---------- */

[data-ticket-filter],
.portal-filter,
.portal-filters button,
[class*="filter"] button{
  font-size:13px !important;
  line-height:1.3 !important;
  min-height:48px !important;
  padding:0 18px !important;
}


/* numbers inside filters */

[data-ticket-filter] small,
[data-ticket-filter] span,
.portal-filter small,
.portal-filter span{
  font-size:12px !important;
}


/* ---------- REQUEST ROWS ---------- */

.portal-ticket-row,
.portal-request-row,
[class*="ticket-row"],
[class*="request-row"]{
  min-height:72px !important;
  padding-top:16px !important;
  padding-bottom:16px !important;
}


/* WEB-00001 */

.portal-ticket-number,
.portal-request-number,
[class*="ticket-number"],
[class*="request-number"]{
  font-size:13px !important;
  line-height:1.3 !important;
  font-weight:800 !important;
}


/* request title */

.portal-ticket-title,
.portal-request-title,
[class*="ticket-title"],
[class*="request-title"]{
  font-size:15px !important;
  line-height:1.35 !important;
  font-weight:700 !important;
}


/* subtitle / site / request type */

.portal-ticket-meta,
.portal-request-meta,
[class*="ticket-meta"],
[class*="request-meta"]{
  font-size:12px !important;
  line-height:1.45 !important;
}


/* ---------- BADGES ---------- */

.portal-badge,
.portal-ticket-status,
.portal-ticket-priority,
[class*="badge"],
[class*="status-badge"],
[class*="priority"]{
  font-size:11px !important;
  line-height:1.2 !important;
  padding:6px 9px !important;
  min-height:26px !important;
}


/* ---------- DATE ---------- */

.portal-ticket-date,
.portal-request-date,
[class*="ticket-date"],
[class*="request-date"]{
  font-size:12px !important;
  line-height:1.3 !important;
}


/* ---------- GENERIC TABLES ---------- */

.portal-table td,
.portal-table th,
.portal-list td,
.portal-list th,
[class*="table"] td,
[class*="table"] th{
  font-size:13px !important;
  line-height:1.4 !important;
}


/* ---------- EMPTY / DESCRIPTION TEXT ---------- */

.portal-section-copy,
.portal-list-copy,
.portal-empty-copy{
  font-size:13px !important;
  line-height:1.5 !important;
}


/* ---------- REQUEST LIST LINKS ---------- */

.portal-ticket-row a,
.portal-request-row a,
[class*="ticket-row"] a,
[class*="request-row"] a{
  font-size:inherit !important;
}


/* ---------- FORCE READABILITY INSIDE REQUEST LIST ---------- */

#ticketListWrap strong{
  font-size:15px !important;
  line-height:1.35 !important;
}

#ticketListWrap small{
  font-size:12px !important;
  line-height:1.4 !important;
}

#ticketListWrap span{
  font-size:12px !important;
  line-height:1.35 !important;
}

#ticketListWrap time{
  font-size:12px !important;
}


/* Keep ticket code visible */

#ticketListWrap [class*="number"],
#ticketListWrap [class*="code"]{
  font-size:13px !important;
  font-weight:800 !important;
}


/* ---------- MOBILE ---------- */

@media(max-width:760px){

  [data-ticket-filter],
  .portal-filter{
    font-size:12px !important;
    padding:0 12px !important;
  }

  #ticketListWrap strong{
    font-size:14px !important;
  }

  #ticketListWrap small,
  #ticketListWrap span,
  #ticketListWrap time{
    font-size:12px !important;
  }

  .portal-ticket-row,
  .portal-request-row,
  [class*="ticket-row"],
  [class*="request-row"]{
    min-height:78px !important;
  }
}


/* ======================================================
   WEBHVA REQUEST ROW LAYOUT V4
   Fix priority/status collision after font increase
   ====================================================== */


/* ---------- DESKTOP REQUEST ROW ---------- */

#ticketListWrap .portal-ticket-row,
#ticketListWrap .portal-request-row,
#ticketListWrap [class*="ticket-row"],
#ticketListWrap [class*="request-row"]{
  display:grid !important;

  grid-template-columns:
    minmax(110px,130px)
    minmax(260px,1fr)
    max-content
    max-content
    minmax(110px,130px) !important;

  column-gap:20px !important;
  row-gap:8px !important;

  align-items:center !important;

  min-height:76px !important;

  padding:
    16px
    20px !important;
}


/* Prevent every direct cell from pushing neighbours */

#ticketListWrap .portal-ticket-row > *,
#ticketListWrap .portal-request-row > *,
#ticketListWrap [class*="ticket-row"] > *,
#ticketListWrap [class*="request-row"] > *{
  min-width:0 !important;
}


/* ---------- PRIORITY / STATUS ---------- */

#ticketListWrap .portal-badge,
#ticketListWrap [class*="badge"],
#ticketListWrap [class*="priority"],
#ticketListWrap [class*="status"]{
  display:inline-flex !important;

  width:max-content !important;
  max-width:none !important;

  min-height:28px !important;

  padding:
    5px
    9px !important;

  align-items:center !important;
  justify-content:center !important;

  white-space:nowrap !important;

  line-height:1 !important;

  margin:0 !important;
}


/* Give adjacent badges breathing room even if markup
   wraps them in the same container */

#ticketListWrap [class*="badge"] + [class*="badge"],
#ticketListWrap [class*="priority"] + [class*="status"],
#ticketListWrap [class*="status"] + [class*="priority"]{
  margin-left:10px !important;
}


/* If status/priority share one wrapper */

#ticketListWrap [class*="actions"],
#ticketListWrap [class*="statuses"],
#ticketListWrap [class*="badges"],
#ticketListWrap [class*="state"]{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:nowrap !important;
}


/* ---------- TITLE AREA ---------- */

#ticketListWrap strong{
  overflow:hidden;
  text-overflow:ellipsis;
}

#ticketListWrap .portal-ticket-title,
#ticketListWrap .portal-request-title,
#ticketListWrap [class*="ticket-title"],
#ticketListWrap [class*="request-title"]{
  min-width:0 !important;
}


/* ---------- DATE ---------- */

#ticketListWrap time,
#ticketListWrap [class*="date"]{
  white-space:nowrap !important;
  text-align:right !important;
}


/* ---------- LARGE SCREENS ---------- */

@media(min-width:1450px){

  #ticketListWrap .portal-ticket-row,
  #ticketListWrap .portal-request-row,
  #ticketListWrap [class*="ticket-row"],
  #ticketListWrap [class*="request-row"]{

    grid-template-columns:
      130px
      minmax(340px,1fr)
      max-content
      max-content
      130px !important;

    column-gap:26px !important;
  }
}


/* ---------- TABLET ---------- */

@media(max-width:1050px){

  #ticketListWrap .portal-ticket-row,
  #ticketListWrap .portal-request-row,
  #ticketListWrap [class*="ticket-row"],
  #ticketListWrap [class*="request-row"]{

    grid-template-columns:
      110px
      minmax(220px,1fr)
      max-content
      max-content !important;

    gap:12px 16px !important;
  }

  #ticketListWrap time,
  #ticketListWrap [class*="date"]{
    grid-column:2 / -1 !important;
    text-align:left !important;
  }
}


/* ---------- MOBILE ---------- */

@media(max-width:700px){

  #ticketListWrap .portal-ticket-row,
  #ticketListWrap .portal-request-row,
  #ticketListWrap [class*="ticket-row"],
  #ticketListWrap [class*="request-row"]{

    grid-template-columns:
      1fr
      auto !important;

    gap:10px 12px !important;

    min-height:0 !important;

    padding:
      16px
      14px !important;
  }

  #ticketListWrap .portal-ticket-number,
  #ticketListWrap .portal-request-number,
  #ticketListWrap [class*="ticket-number"],
  #ticketListWrap [class*="request-number"]{
    grid-column:1 !important;
  }

  #ticketListWrap .portal-ticket-title,
  #ticketListWrap .portal-request-title,
  #ticketListWrap [class*="ticket-title"],
  #ticketListWrap [class*="request-title"]{
    grid-column:1 / -1 !important;
  }

  #ticketListWrap time,
  #ticketListWrap [class*="date"]{
    grid-column:1 / -1 !important;
    text-align:left !important;
  }

  #ticketListWrap [class*="badge"],
  #ticketListWrap [class*="priority"],
  #ticketListWrap [class*="status"]{
    justify-self:start !important;
  }
}