/* Detalle: experiencia para celular */
.pd-help{margin:var(--cds-gap-xs) 0 var(--cds-gap-md);font-size:var(--cds-font-size-caption);color:var(--color-fg-muted)}
.pd-help summary{cursor:pointer;color:var(--color-fg);font-weight:600;list-style:none;display:inline-flex;align-items:center;gap:6px;padding:4px 0}
.pd-help summary::-webkit-details-marker{display:none}
.pd-help summary::before{content:"ⓘ";font-weight:400}
.pd-help[open] summary{margin-bottom:6px}
.pd-legend{margin:var(--cds-gap-xs) 0 var(--cds-gap-sm);font-size:var(--cds-font-size-caption);font-weight:600}
.pd-legend span{display:inline-block;margin-right:12px}
@media (max-width:640px){
  #pg-detalle{scroll-margin-top:0}
  #pg-detalle .pf-take{font-size:14px;margin:4px 0 8px}
  #pg-detalle h1{font-size:24px;margin:6px 0 2px}
  #pg-detalle .pf-upd{font-size:12px;padding:8px 12px}
  #filtro-promotor label{font-weight:600;color:var(--color-fg)}
  #filtro-promotor select{font-weight:600;border:2px solid #2364E6}
  /* barra de semana fija arriba al hacer scroll */
  #filtros{position:sticky;top:0;z-index:20;background:var(--color-bg);margin:0 -12px;padding:8px 12px;flex-direction:row;flex-wrap:wrap;gap:8px;box-shadow:0 2px 6px rgba(0,0,0,.08)}
  #filtros{flex-wrap:nowrap;align-items:flex-end}
  #filtros label{flex:1 1 auto;width:auto;font-size:11px}
  #filtros button{flex:0 0 48px;width:48px;font-size:18px;padding:9px 0}
  #pd-week-label{font-size:16px;line-height:1.3;margin-top:4px}
  #pd-who{font-weight:600;color:var(--color-fg)}
  #pg-detalle .pf-card{padding:14px 12px}
  #pg-detalle .pf-card h2{font-size:18px}
  /* KPIs en 2 columnas */
  #pg-detalle .pf-tiles{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
  #pg-detalle .pf-tile{padding:10px 12px}
  #pg-detalle .pf-tile .lbl{font-size:12px;line-height:1.25}
  #pg-detalle .pf-tile .big{font-size:26px;margin-top:2px}
  #pg-detalle .pf-tile .sub{font-size:11px}
  /* tablas como tarjetas */
  #pg-detalle .pf-tw{overflow:visible}
  #pg-detalle table.pf-table,#pg-detalle table.pf-table tbody{display:block;width:100%}
  #pg-detalle table.pf-table thead{display:none}
  #pg-detalle table.pf-table tbody tr{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;background:var(--color-panel);border:1px solid var(--color-border-line);border-radius:12px;padding:10px 12px;margin:0 0 8px}
  #pg-detalle table.pf-table tbody tr[hidden]{display:none}
  #pg-detalle table.pf-table td{display:flex;flex-direction:column;gap:1px;text-align:left !important;padding:0;border:0;white-space:normal;font-size:15px;min-width:0;overflow-wrap:anywhere}
  #pg-detalle table.pf-table td::before{content:attr(data-label);font-size:11px;font-weight:400;color:var(--color-fg-muted);text-transform:uppercase;letter-spacing:.3px}
  #pg-detalle table.pf-table td:first-child{grid-column:1/-1;font-weight:700;font-size:16px;flex-direction:row;align-items:baseline;gap:8px;border-bottom:1px solid var(--color-border-line);padding-bottom:6px}
  #pg-detalle table.pf-table td:first-child::before{display:none}
  #pg-detalle table.pf-table td.pd-ftb,#pg-detalle table.pf-table td.pd-falta,#pg-detalle table.pf-table td.pd-inv,#pg-detalle table.pf-table td.pd-arr{padding:4px 6px;border-radius:6px}
  #pg-detalle table.pf-table td.pd-ftb{background:rgba(30,123,52,.10)}
  #pg-detalle table.pf-table td.pd-falta{background:#FFF3B0;color:#8a5a00}
  /* préstamos: tipo de crédito junto a la fecha */
  #pg-detalle #pd-t-cl tbody tr td:first-child{grid-column:1;order:-2}
  #pg-detalle #pd-t-cl tbody tr td:nth-child(5){order:-1;align-self:center;justify-self:end;flex-direction:row;font-size:14px}
  #pg-detalle #pd-t-cl tbody tr td:nth-child(5)::before{display:none}
  #pg-detalle #pd-t-cl tbody tr td:first-child{border-bottom:0;padding-bottom:0}
  #pg-detalle #pd-t-cl tbody tr td:nth-child(2){grid-column:1}
  #pg-detalle table.pf-table tbody tr{gap:6px 12px}
  #pg-detalle.pd-one table.pf-table td[data-label="Promotor"]{display:none}
  /* tabla mensual: 3 columnas */
  #pg-detalle table.pf-retro tbody tr{grid-template-columns:repeat(3,1fr)}
  #pg-detalle table.pf-retro td{font-size:16px;font-variant-numeric:tabular-nums}
  #pg-detalle table.pf-retro td.pf-warn,#pg-detalle table.pf-retro td.pf-bad{font-weight:700}
  #pg-detalle table.pf-retro td.pf-warn{color:#a86400}
  #pg-detalle table.pf-retro td.pf-bad{color:#c62828}
}