/* R78-HF222. Readability-only enhancement for Work Hours Query and Project Overview charts.
   Does not change data, sorting, scope, permissions, graph values or click handlers. */
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart).role-stack-chart{
 gap:13px!important;max-height:690px!important;padding:12px 10px 14px!important;scrollbar-gutter:stable;
}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-row{
 display:grid!important;grid-template-columns:minmax(260px,38%) minmax(0,1fr) minmax(68px,78px)!important;
 column-gap:13px!important;align-items:center!important;padding:8px 4px 10px!important;
 border-bottom:1px solid #edf2f7;
}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-label{
 display:flex!important;flex-wrap:wrap!important;align-items:baseline!important;align-content:center!important;
 gap:5px 9px!important;min-width:0!important;font-size:15px!important;line-height:1.52!important;
 white-space:normal!important;overflow:visible!important;text-overflow:clip!important;word-break:break-word!important;
}
/* Visual order: CUSTOMER • CASE ID in one row, PROJECT on the following row.
   Original DOM, accessible text and chart computation are untouched. */
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-label > :is(.full-customer-label,.full-customer-chart){
 order:0!important;display:inline!important;margin:0!important;font-size:15px!important;font-weight:800!important;
 line-height:1.5!important;color:#142b50!important;overflow-wrap:anywhere;
}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-label > .case-chip{
 order:1!important;display:inline-flex!important;align-items:center!important;margin:0!important;
 padding:4px 9px!important;font-size:12px!important;line-height:1.35!important;font-weight:800!important;
 max-width:100%;white-space:normal!important;overflow-wrap:anywhere;
}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-label > .full-project-label{
 order:2!important;flex:0 0 100%!important;display:block!important;min-width:0!important;
 margin:0!important;color:#526581!important;font-size:13.5px!important;line-height:1.5!important;
 white-space:normal!important;overflow-wrap:anywhere;
}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-track{height:28px!important;border-radius:16px!important;}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-total{
 font-size:15px!important;line-height:1.5!important;padding-top:1px!important;align-self:center!important;white-space:nowrap;
}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-breakdown{
 display:flex!important;flex-wrap:wrap!important;gap:5px 6px!important;margin-top:7px!important;
}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-breakdown .role-time-chip{
 font-size:12px!important;line-height:1.45!important;padding:4px 8px!important;font-weight:750!important;
}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-time-chip:before{width:8px!important;height:8px!important;}
:where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-seg-label-r31{font-size:10px!important;line-height:28px!important;}
#page-report .report-chart-title{font-size:18px!important;line-height:1.5!important;}
#page-report .report-chart-sub{font-size:13px!important;line-height:1.55!important;margin-bottom:10px!important;}
:where(#page-report,#page-projectlist) .role-stack-legend{font-size:13px!important;line-height:1.5!important;gap:9px 14px!important;}
#page-report .hf144-role-axis{font-size:13px!important;line-height:1.5!important;}
#page-report .hf144-axis-ticks{font-size:12.5px!important;}
@media(max-width:1050px){
 :where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-row{
  grid-template-columns:minmax(220px,42%) minmax(0,1fr) 60px!important;gap:8px!important;
 }
}
@media(max-width:760px){
 :where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-row{
  grid-template-columns:minmax(0,1fr) 70px!important;row-gap:7px!important;
 }
 :where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-label{grid-column:1/-1!important;}
 :where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-track-wrap{grid-column:1!important;}
 :where(#page-report, #page-projectlist) :is(#personalProjectHoursChart,#managerProjectHoursChart) .role-stack-total{grid-column:2!important;}
}
