/* ==========================================================================
   PraVender 13.25.06-R170 — Refino Premium / Fase 1
   Escopo deliberadamente seguro: shell + Visão Geral.
   Não altera regras de negócio, dados, rotas, telefonia ou integrações.
   Desktop e mobile são tratados em blocos separados.
   ========================================================================== */

:root{
  --r170-line:#dbe4df;
  --r170-line-soft:#e9efec;
  --r170-ink:#16221c;
  --r170-text:#3d4c44;
  --r170-muted:#718078;
  --r170-brand:#155f42;
  --r170-brand-soft:#eef6f2;
  --r170-radius:10px;
}

/* Microacabamento global de baixo risco. */
.app-shell :is(button,[role="button"],select,input,textarea){-webkit-tap-highlight-color:transparent}
.app-shell :is(button,[role="button"],a):focus-visible,
.app-shell :is(input,select,textarea):focus-visible{
  outline:2px solid color-mix(in srgb,var(--r170-brand) 35%,transparent)!important;
  outline-offset:2px!important;
}
.app-shell :is(.dashboard-metric-strip,.metric-grid,.operation-health-grid) strong{
  font-variant-numeric:tabular-nums;
}

/* ============================== DESKTOP =================================== */
@media (min-width:821px){

  /* Cabeçalho da Visão Geral: contexto à esquerda, ações alinhadas na mesma base. */
  .app-shell .page-home .dashboard-command-bar{
    align-items:flex-end!important;
    gap:18px!important;
    padding:3px 0 12px!important;
  }
  .app-shell .page-home .dashboard-command-bar>div:first-child{
    flex:1 1 auto!important;
    min-width:0!important;
  }
  .app-shell .page-home .dashboard-command-bar h1{
    letter-spacing:-.025em!important;
  }
  .app-shell .page-home .dashboard-command-actions{
    display:grid!important;
    grid-template-columns:112px auto auto!important;
    align-items:end!important;
    gap:8px!important;
    flex:0 0 auto!important;
    margin:0!important;
  }
  .app-shell .page-home .dashboard-period-select{
    display:grid!important;
    gap:4px!important;
    width:112px!important;
    min-width:112px!important;
  }
  .app-shell .page-home .dashboard-period-select>span{
    display:block!important;
    margin:0!important;
    color:var(--r170-muted)!important;
    font-size:9px!important;
    line-height:1!important;
    font-weight:700!important;
  }
  .app-shell .page-home .dashboard-period-select>select{
    width:100%!important;
    min-height:36px!important;
    height:36px!important;
    padding:0 30px 0 11px!important;
    border:1px solid var(--r170-line)!important;
    border-radius:9px!important;
    background:#fff!important;
    color:var(--r170-ink)!important;
    font-size:11px!important;
    font-weight:650!important;
  }
  .app-shell .page-home .dashboard-command-actions :is(.primary-button,.secondary-button){
    min-height:36px!important;
    height:36px!important;
    padding:0 13px!important;
    border-radius:9px!important;
    white-space:nowrap!important;
    font-size:10.5px!important;
  }

  /* KPIs principais: mesma altura, leitura mais limpa, sem sensação de caixas soltas. */
  .app-shell .page-home .dashboard-metric-strip{
    overflow:hidden!important;
    border-color:var(--r170-line)!important;
  }
  .app-shell .page-home .dashboard-metric-strip>div{
    min-height:72px!important;
    padding:11px 14px!important;
    align-content:center!important;
  }
  .app-shell .page-home .dashboard-metric-strip small{
    color:#66756d!important;
    font-size:8.8px!important;
    line-height:1.15!important;
    letter-spacing:.055em!important;
    font-weight:750!important;
  }
  .app-shell .page-home .dashboard-metric-strip strong{
    margin-top:1px!important;
    color:var(--r170-ink)!important;
    font-size:19px!important;
    line-height:1.05!important;
    letter-spacing:-.015em!important;
  }
  .app-shell .page-home .dashboard-metric-strip em{
    margin-top:2px!important;
    color:var(--r170-muted)!important;
    font-size:9.6px!important;
    line-height:1.25!important;
    font-style:normal!important;
  }

  /* Qualidade da base: elimina reticências e mantém todos os significados visíveis. */
  .app-shell .page-home .call-quality-panel{
    padding:12px!important;
    border-color:var(--r170-line)!important;
  }
  .app-shell .page-home .call-quality-panel .section-head{
    margin-bottom:9px!important;
    padding-bottom:8px!important;
  }
  .app-shell .page-home .call-quality-panel .section-head>div{
    min-width:0!important;
  }
  .app-shell .page-home .call-quality-panel .section-head span{
    display:inline-block!important;
    margin-right:9px!important;
    color:#087a47!important;
    font-size:9px!important;
    line-height:1!important;
    letter-spacing:.09em!important;
    text-transform:uppercase!important;
    font-weight:800!important;
  }
  .app-shell .page-home .call-quality-panel .section-head h2{
    display:inline!important;
    color:var(--r170-ink)!important;
    font-size:14.5px!important;
    line-height:1.2!important;
  }
  .app-shell .page-home .call-quality-panel .section-head p{
    margin-top:5px!important;
    color:var(--r170-muted)!important;
    font-size:10.2px!important;
    line-height:1.35!important;
  }
  .app-shell .page-home .compact-premium-metrics{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .app-shell .page-home .compact-premium-metrics .metric-card{
    display:grid!important;
    grid-template-rows:auto auto 1fr!important;
    align-content:start!important;
    min-height:78px!important;
    padding:9px 10px!important;
    border:1px solid var(--r170-line-soft)!important;
    border-radius:9px!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  .app-shell .page-home .compact-premium-metrics .metric-card>span{
    min-width:0!important;
    color:#68766f!important;
    font-size:8.8px!important;
    line-height:1.18!important;
    letter-spacing:.025em!important;
    font-weight:740!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .app-shell .page-home .compact-premium-metrics .metric-card>strong{
    margin:6px 0 4px!important;
    color:var(--r170-ink)!important;
    font-size:17px!important;
    line-height:1!important;
  }
  .app-shell .page-home .compact-premium-metrics .metric-card>small{
    align-self:end!important;
    min-width:0!important;
    color:#617168!important;
    font-size:8.7px!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }

  /* Blocos inferiores: leve ganho de hierarquia sem mudar estrutura. */
  .app-shell .page-home .dashboard-main-grid{
    gap:10px!important;
    align-items:stretch!important;
  }
  .app-shell .page-home :is(.priority-panel,.operation-health-panel){
    border-color:var(--r170-line)!important;
  }
  .app-shell .page-home :is(.priority-panel,.operation-health-panel) .section-head{
    margin-bottom:4px!important;
    padding-bottom:8px!important;
  }
  .app-shell .page-home .priority-row{
    min-height:43px!important;
    padding-block:5px!important;
  }
  .app-shell .page-home .priority-row:hover{
    background:#f8fbf9!important;
  }
  .app-shell .page-home .priority-row>span:nth-child(2)>strong{
    color:var(--r170-ink)!important;
    font-size:10.6px!important;
    line-height:1.2!important;
  }
  .app-shell .page-home .priority-row>span:nth-child(2)>small{
    color:var(--r170-muted)!important;
    font-size:9px!important;
    line-height:1.2!important;
  }
  .app-shell .page-home .operation-health-item{
    padding-block:9px!important;
  }
  .app-shell .page-home .operation-health-item-top{
    align-items:baseline!important;
  }
  .app-shell .page-home .operation-health-item-top>span{
    color:#53655b!important;
    font-size:10.5px!important;
    font-weight:650!important;
  }
  .app-shell .page-home .operation-health-item-top>strong{
    color:var(--r170-ink)!important;
    font-size:13px!important;
  }
  .app-shell .page-home .operation-health-item>small{
    margin-top:5px!important;
    color:var(--r170-muted)!important;
    font-size:8.8px!important;
  }
}

/* Notebook: não espreme ações ou cartões. */
@media (min-width:821px) and (max-width:1240px){
  .app-shell .page-home .dashboard-command-actions{
    grid-template-columns:112px auto auto!important;
  }
  .app-shell .page-home .compact-premium-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

/* =============================== MOBILE =================================== */
@media (max-width:820px){
  .app-shell .page-home .system-dashboard{
    gap:9px!important;
  }
  .app-shell .page-home .dashboard-command-bar{
    padding-bottom:9px!important;
  }
  .app-shell .page-home .dashboard-command-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    width:100%!important;
  }
  .app-shell .page-home .dashboard-period-select{
    grid-column:1/-1!important;
    display:grid!important;
    gap:4px!important;
    width:100%!important;
  }
  .app-shell .page-home .dashboard-period-select>select{
    min-height:44px!important;
    height:44px!important;
    border-radius:10px!important;
  }
  .app-shell .page-home .dashboard-command-actions :is(.primary-button,.secondary-button){
    width:100%!important;
    min-height:44px!important;
    height:44px!important;
    border-radius:10px!important;
  }

  .app-shell .page-home .dashboard-metric-strip{
    gap:0!important;
    overflow:hidden!important;
  }
  .app-shell .page-home .dashboard-metric-strip>div{
    min-height:82px!important;
    padding:10px 11px!important;
  }
  .app-shell .page-home .dashboard-metric-strip small{
    font-size:9px!important;
    line-height:1.2!important;
  }
  .app-shell .page-home .dashboard-metric-strip strong{
    font-size:17px!important;
    line-height:1.08!important;
  }
  .app-shell .page-home .dashboard-metric-strip em{
    font-size:9.5px!important;
    line-height:1.25!important;
    font-style:normal!important;
  }

  .app-shell .page-home .call-quality-panel{
    padding:10px!important;
  }
  .app-shell .page-home .call-quality-panel .section-head h2{
    font-size:15px!important;
  }
  .app-shell .page-home .call-quality-panel .section-head p{
    margin-top:4px!important;
    font-size:10.5px!important;
    line-height:1.4!important;
  }
  .app-shell .page-home .compact-premium-metrics{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .app-shell .page-home .compact-premium-metrics .metric-card{
    display:grid!important;
    grid-template-rows:auto auto 1fr!important;
    min-height:92px!important;
    padding:10px!important;
    border-radius:10px!important;
  }
  .app-shell .page-home .compact-premium-metrics .metric-card>span{
    font-size:9.2px!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .app-shell .page-home .compact-premium-metrics .metric-card>strong{
    margin:6px 0 4px!important;
    font-size:18px!important;
    line-height:1!important;
  }
  .app-shell .page-home .compact-premium-metrics .metric-card>small{
    align-self:end!important;
    font-size:9.2px!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }

  .app-shell .page-home .priority-row{
    min-height:52px!important;
  }
  .app-shell .page-home .operation-health-item{
    padding-block:10px!important;
  }
}

@media (max-width:420px){
  .app-shell .page-home .compact-premium-metrics{
    grid-template-columns:1fr 1fr!important;
  }
  .app-shell .page-home .compact-premium-metrics .metric-card{
    min-height:98px!important;
  }
}
/* R187: improved individual-call summary spacing */
.my-work-summary { padding: 20px 22px 18px; margin-bottom: 16px; }
.my-work-summary > strong { display: block; font-size: 13px; line-height: 1.5; letter-spacing: .035em; color: #244d3c; margin: 0 0 16px; }
.my-work-summary .queue-overview-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); gap: 12px; margin: 0 0 15px; }
.my-work-summary .queue-kpi { box-sizing: border-box; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 9px; padding: 16px 18px; min-height: 88px; border-radius: 12px; }
.my-work-summary .queue-kpi strong { font-size: 25px; line-height: 1.1; margin: 0; }
.my-work-summary .queue-kpi span { font-size: 11px; line-height: 1.4; letter-spacing: .035em; }
.my-work-summary > small { display: block; line-height: 1.65; font-size: 12px; color: #60736a; margin-top: 4px; }
@media(max-width:680px){.my-work-summary{padding:16px}.my-work-summary .queue-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.my-work-summary .queue-kpi{padding:12px;min-height:75px}}