/* Permanent responsive web policy. Keep this file last in the Portal cascade. */
:root{--rv-mobile-drawer-width:min(94vw,430px);--rv-safe-bottom:max(14px,env(safe-area-inset-bottom));--rv-layer-drawer:1300;--rv-layer-dialog:1400;--rv-layer-assistant:1350}
html,body{max-width:100%;overflow-x:hidden}
.qaPlanQuickControl label{color:#17202b!important}
/* The QA utility has its own light surface inside independently themed headers.
   Pair its button colors locally; inherited dark-header text is not readable. */
#qaPlanQuickControl #qaPlanQuickReset{background:#f7faff!important;color:#17202b!important;-webkit-text-fill-color:currentColor!important;border-color:#60758f!important;min-height:44px}
#qaPlanQuickControl #qaPlanQuickReset:hover{background:#e8f1ff!important}
#qaPlanQuickControl #qaPlanQuickReset:focus-visible{outline:3px solid #0754b8!important;outline-offset:2px}
#qaPlanQuickControl #qaPlanQuickReset:disabled{background:#e2e8f0!important;color:#475569!important;opacity:1!important;cursor:wait}
body[data-sidebar-mobile-open="1"],body[data-blocking-dialog-open="1"]{overflow:hidden!important;overscroll-behavior:none}
@media(max-width:1100px){
  .sidebar{width:var(--rv-mobile-drawer-width)!important;max-width:var(--rv-mobile-drawer-width)!important;z-index:var(--rv-layer-drawer)!important;transform:translateX(-102%)!important}
  body[data-sidebar-mobile-open="1"] .sidebar{transform:translateX(0)!important}
  .sidebarScrim{z-index:calc(var(--rv-layer-drawer) - 1)!important}
  .sideNav{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:5px!important}
  .sideNav>.sideBtn,.sideNav>.masterMenuGroup,.masterMenuChildren>.sideBtn,.sideBottom>.sideBtn{width:100%!important;max-width:100%!important;min-width:0!important}
  .sideBtn{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;min-height:44px!important;padding:9px 11px!important;font-size:15px!important;text-indent:0!important;white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important}
  .sideBtn>span:not(.masterMenuChevron){display:block!important;min-width:0!important;white-space:nowrap!important}
  body[data-sidebar-collapsed="1"] .sideBtn{width:100%!important;max-width:100%!important;justify-content:flex-start!important;gap:10px!important;font-size:15px!important}
  body[data-sidebar-collapsed="1"] .sideBtn>span{display:block!important}
  .shell{width:100%!important;max-width:100%!important;margin-left:0!important;min-height:100dvh!important;padding-bottom:calc(18px + env(safe-area-inset-bottom))!important}
  .topbar{position:sticky!important;top:0!important;z-index:80!important;margin:0!important;align-items:center!important;flex-direction:row!important;flex-wrap:wrap!important}
  .sidebarMobileToggle{display:inline-flex!important}
  .topbar .brand{flex:1 1 220px!important;min-width:0!important;flex-direction:row!important;align-items:center!important}
  .topbar .actions{width:100%!important;min-width:0!important;overflow:visible!important;flex-wrap:wrap!important}
  .topbar .actions>*{min-width:0!important}
  .qaPlanQuickControl{max-width:100%!important;flex-wrap:wrap!important}
  .qaPlanQuickControl label{color:#17202b!important}
  .tabPane :is(.panel,.heroCard,.clientOpsCard,.clevelCard,.revenueReviewCard,.capacityPlannerCard){height:auto!important;min-height:0!important}
  .tabPane .sectionTitle{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:start!important;gap:8px!important}
  .tabPane .sectionTitle>.field{grid-column:1/-1!important;width:100%!important;max-width:none!important}
  .tabPane .chart{height:190px!important;min-height:190px!important}
  .tabPane .chart:has(>.chartEmptyState){height:auto!important;min-height:112px!important}
  .tabPane :is(.riExecMainGrid,.riExecBottomGrid)>.panel{height:auto!important;min-height:0!important}
  .tabPane :is(.riMiniDonutWrap,.riFunnel,.riTrendChart){min-height:0!important}
  .formGrid,.row{grid-template-columns:minmax(0,1fr)!important}
  .modalBackdrop,.processBackdrop,.ruNotificationModal{padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important;z-index:var(--rv-layer-dialog)!important}
  .modal,.modalCard,.processModal,.ruNotificationModalCard{width:100%!important;max-width:100%!important;max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 16px)!important;overflow-y:auto!important;overscroll-behavior:contain!important}
  .modal :is(label,small,p),.processModal :is(label,small,p),.ruNotificationModalCard :is(label,small,p){color:var(--text)!important}
  .modalActions{position:sticky;bottom:0;z-index:2;padding-bottom:max(8px,env(safe-area-inset-bottom));background:inherit}
  .riGlobalRivaLauncher{right:max(12px,env(safe-area-inset-right))!important;bottom:var(--rv-safe-bottom)!important;z-index:var(--rv-layer-assistant)!important;min-width:96px!important;height:48px!important;padding:0 13px!important}
  body.rivaPanelOpen .riGlobalRivaLauncher,body[data-sidebar-mobile-open="1"] .riGlobalRivaLauncher,body[data-blocking-dialog-open="1"] .riGlobalRivaLauncher{display:none!important}
  .riCanonicalRiva.riGlobalRivaPanel{z-index:var(--rv-layer-dialog)!important}
  .riGlobalRivaPanel .riCanonicalRivaHeader{flex:0 0 auto!important}
  .riGlobalRivaPanel .riCanonicalRivaHeader>button{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;display:grid!important;place-items:center!important;padding:0!important}
  .riGlobalRivaPanel .riCanonicalRivaBody{flex:1 1 auto!important;height:auto!important;overflow-y:auto!important}
  .riGlobalRivaPanel .riCanonicalComposer{position:relative!important;bottom:auto!important;padding-bottom:max(6px,env(safe-area-inset-bottom))!important}
  .riGlobalRivaPanel .riCanonicalComposer button{width:44px!important;height:44px!important;flex:0 0 44px!important}
  .footer{padding-bottom:calc(72px + env(safe-area-inset-bottom))!important;overflow-wrap:anywhere}
}
@media(max-width:420px){.sideBtn{font-size:14px!important}.riCanonicalVoiceModes button{font-size:12px!important}.riGlobalRivaPanel .riCanonicalRivaActions{grid-template-columns:1fr!important}}
@media(max-width:560px){
  .topbar{position:relative!important;top:auto!important}
  .loggedUserIdentity{display:inline-flex!important;align-items:center!important;gap:8px!important}
  .qaPlanQuickControl{display:grid!important;grid-template-columns:minmax(0,1fr)!important;align-items:center!important;width:100%!important;color:#17202b!important}
  .qaPlanQuickControl label{grid-column:1/-1!important;width:auto!important;color:#17202b!important}
  .qaPlanQuickControl select{width:100%!important;min-width:0!important;max-width:none!important;color:#17202b!important}
  .qaPlanQuickControl .btn{min-width:0!important;padding-inline:10px!important;font-size:12px!important;white-space:normal!important}
}
@media(max-height:500px) and (orientation:landscape){.riGlobalRivaPanel .riCanonicalRivaHeader{min-height:52px!important}.riGlobalRivaPanel .riCanonicalRivaHeader img{width:42px!important;height:42px!important}}

/* Touch layout recovery. This file is intentionally loaded after every module
   stylesheet so desktop equal-height rules cannot reappear on phones/tablets. */
@media(max-width:1100px){
  .tabPane :is(.grid2,.grid3,.grid4,.analyticsGrid,.opsGrid,.pkGridTop,.pkGridMiddle,.pkGridInsights,.pkFeatureGrid,.pkFeatureGrid2,.pkFeatureGrid3,.riExecMainGrid,.riExecBottomGrid,.riDashGrid4,.myDayGrid,.favoritesWorkspace,.revenueOsGrid){
    grid-auto-rows:auto!important;align-items:start!important
  }
  .tabPane :is(.grid2,.grid3,.grid4,.analyticsGrid,.opsGrid,.pkGridTop,.pkGridMiddle,.pkGridInsights,.pkFeatureGrid,.pkFeatureGrid2,.pkFeatureGrid3,.riExecMainGrid,.riExecBottomGrid,.riDashGrid4,.myDayGrid,.favoritesWorkspace,.revenueOsGrid)>:is(.panel,.pkPanel,.card,.kpi,article,section){
    height:auto!important;min-height:0!important;align-self:start!important
  }
  #tab-kam360 :is(.pkPanel,.pkGridTop>.panel,.pkGridMiddle>.panel,.pkGridInsights>.panel,.pkFeatureGrid>.panel){
    height:auto!important;min-height:0!important;align-self:start!important
  }
  .tabPane .sectionTitle{height:auto!important;min-height:0!important}
  .tableWrap,.mobileSessionsTableWrap{box-sizing:border-box;width:100%!important;max-width:100%!important;overflow-x:auto!important;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  .performanceSectionNav{box-sizing:border-box;width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x proximity;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  .performanceSectionNav>button{scroll-snap-align:start}
}

@media(max-width:820px){
  .shell{padding:10px!important}
  .tabPane{box-sizing:border-box;width:100%!important;max-width:100%!important;min-width:0!important}
  .tabPane :is(.grid2,.grid3,.grid4,.analyticsGrid,.opsGrid,.pkGridTop,.pkGridMiddle,.pkGridInsights,.pkFeatureGrid,.pkFeatureGrid2,.pkFeatureGrid3,.riExecMainGrid,.riExecBottomGrid,.riDashGrid4,.myDayGrid,.favoritesWorkspace,.revenueOsGrid){
    grid-template-columns:minmax(0,1fr)!important;gap:12px!important;margin-block:12px!important
  }
  #tab-kam360 :is(.pkGridTop,.pkGridMiddle,.pkGridInsights,.pkFeatureGrid,.pkFeatureGrid2,.pkFeatureGrid3){
    display:block!important;grid-template-columns:minmax(0,1fr)!important;grid-auto-rows:max-content!important;align-items:start!important
  }
  #tab-kam360 :is(.pkPanel,.pkGridTop>.panel,.pkGridMiddle>.panel,.pkGridInsights>.panel,.pkFeatureGrid>.panel){
    height:auto!important;min-height:0!important;overflow:visible!important
  }
  body[data-visual-system="nplus1"] #tab-kam360 .pkGridTop>section.pkPanel,
  body[data-visual-system="nplus1"] #tab-kam360 .pkGridMiddle>section.pkPanel,
  body[data-visual-system="nplus1"] #tab-kam360 .pkGridInsights>section.pkPanel,
  body[data-visual-system="nplus1"] #tab-kam360 .pkFeatureGrid>section.pkPanel,
  body[data-visual-system="nplus1"] #tab-kam360 .pkFeatureGrid2>section.pkPanel,
  body[data-visual-system="nplus1"] #tab-kam360 .pkFeatureGrid3>section.pkPanel{
    height:auto!important;block-size:auto!important;min-height:0!important;align-self:start!important;margin-bottom:12px!important
  }
  #tab-kam360 .pkForecastWrap{grid-template-columns:minmax(0,1fr)!important}
  #tab-kam360 .pkHorizonGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #tab-kam360 .pkMetricCards,#tab-kam360 .pkForecastStats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .tabPane .panel,.tabPane .pkPanel{padding:14px!important;border-radius:14px!important}
  .tabPane .sectionTitle{margin-bottom:10px!important}
  .tabPane .sectionTitle>div:first-child{flex:none!important;min-height:0!important}
  .tabPane .sectionTitle>.revupHelpActions,.tabPane .sectionTitle>.cardActionRail{grid-column:2!important;grid-row:1!important;align-self:start!important;justify-self:end!important;width:auto!important;min-height:40px!important;margin:0!important}
  .revupResponsiveTable{display:block!important;width:100%!important;min-width:0!important;border:0!important}
  .revupResponsiveTable thead{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
  .revupResponsiveTable tbody{display:grid!important;gap:10px!important;width:100%!important}
  .revupResponsiveTable tbody tr{display:grid!important;width:100%!important;min-width:0!important;padding:10px!important;border:1px solid var(--border-default,var(--line,#d6e0eb))!important;border-radius:12px!important;background:var(--surface-elevated,var(--panel2,#fff))!important;box-sizing:border-box!important}
  .revupResponsiveTable tbody td{display:grid!important;grid-template-columns:minmax(104px,38%) minmax(0,1fr)!important;gap:10px!important;width:100%!important;min-width:0!important;min-height:0!important;padding:8px 4px!important;border:0!important;border-bottom:1px solid var(--border-default,var(--line,#d6e0eb))!important;white-space:normal!important;overflow-wrap:anywhere!important;box-sizing:border-box!important;text-align:left!important}
  .revupResponsiveTable tbody td:last-child{border-bottom:0!important}
  .revupResponsiveTable td::before{content:attr(data-label);color:var(--text-secondary,var(--muted,#617086));font-size:.78rem;font-weight:800;line-height:1.35}
  .revupMobileScrollTable{min-width:max-content!important}
}

@media(max-width:430px){
  .shell{padding:8px!important}
  #tab-kam360 .pkHorizonGrid{grid-template-columns:minmax(0,1fr)!important}
  #tab-kam360 :is(.pkMetricCard,.forecastStatCard){min-height:0!important;padding:12px!important}
  .revupResponsiveTable tbody td{grid-template-columns:minmax(92px,36%) minmax(0,1fr)!important;gap:8px!important}
}

/* RIVA viewport containment. Browser zoom and embedded WebViews can expose a
   CSS viewport wider than the phone breakpoint while retaining a short visual
   viewport. Never let assistant content determine the outer panel height. */
.riCanonicalRiva.riGlobalRivaPanel{
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  max-width:calc(100vw - 16px)!important;
  max-height:calc(var(--riva-viewport-height,100dvh) - 16px)!important;
  overflow:hidden!important;
  overscroll-behavior:contain!important;
  contain:layout paint!important;
}
.riGlobalRivaPanel .riCanonicalRivaHeader,
.riGlobalRivaPanel :is(.riCanonicalVoiceModes,.riCanonicalVoiceStatus,.riCanonicalRealtimeEnd,.riCanonicalNewConversation,.riCanonicalComposer){
  flex:0 0 auto!important;
}
.riGlobalRivaPanel .riCanonicalRivaBody{
  flex:1 1 0!important;
  min-height:0!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
}
.riGlobalRivaPanel .riCanonicalTranscript{
  max-height:clamp(180px,42dvh,360px)!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
}
.riGlobalRivaPanel .rivaDisplaySettings{display:flex;align-items:center;gap:8px;flex:0 0 auto;margin:0 14px 8px;padding:8px 10px;border:1px solid #d4deeb;border-radius:9px;background:#f7faff;color:#17202b}.riGlobalRivaPanel .rivaDisplaySettings label{font-weight:700}.riGlobalRivaPanel .rivaDisplaySettings select{margin-left:auto;min-height:36px;padding:5px 28px 5px 9px;border:1px solid #a9bfdb;border-radius:7px;background:#fff;color:#17202b}.riGlobalRivaPanel #rivaPreferenceStatus{min-width:54px;color:#526780;font-size:12px}.riGlobalRivaPanel .riCanonicalRivaBody :is(p,li){font-size:calc(13px * var(--riva-font-scale,1))!important;line-height:1.55!important}.riGlobalRivaPanel .riCanonicalRivaBody h3{font-size:calc(13px * var(--riva-font-scale,1))!important}.riGlobalRivaPanel .riCanonicalTurn p{font-size:calc(14px * var(--riva-font-scale,1))!important}.riGlobalRivaPanel .riCanonicalRivaBubble strong{font-size:calc(14px * var(--riva-font-scale,1))!important}.riGlobalRivaPanel .riCanonicalEvidence span{font-size:calc(10px * var(--riva-font-scale,1))!important}
@media(max-width:1100px){
  body.rivaPanelOpen{overflow:hidden!important;overscroll-behavior:none!important}
  .riCanonicalRiva.riGlobalRivaPanel{
    position:fixed!important;
    inset:var(--riva-viewport-top,0) 0 auto 0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:var(--riva-viewport-height,100dvh)!important;
    max-height:var(--riva-viewport-height,100dvh)!important;
    min-height:0!important;
    border-radius:0!important;
  }
}
