/* pc-dec874 */

/* ===== DEC 874 (MK MIX 31/10): móvil GENÉRICO. Solo un rectángulo redondeado con pantalla: sin isla ni cámara, sin botones
   laterales, sin barrita de inicio, sin barra de estado ni iconos de cobertura/batería, sin manzana ni nombres de marca.
   La conversación va con los colores de la marca (variables --pc-p y --pc-acc), no como copia de WhatsApp.
   Con «html body» delante para ganar a cualquier regla anterior (también a la de un fragmento). */
html body .aproceso .pc-movil{background:color-mix(in srgb,var(--pc-p) 80%,#000);border-radius:calc(var(--pc-tel-alto,480px)*.05);
  padding:calc(var(--pc-tel-alto,480px)*.016);box-shadow:0 0 0 1px color-mix(in srgb,var(--pc-p) 55%,#000),
  0 24px 44px -20px rgba(10,20,40,.40),0 8px 18px -10px rgba(10,20,40,.20)}
html body .aproceso .pc-movil::before,html body .aproceso .pc-movil::after,
html body .aproceso .pc-pantalla::before,html body .aproceso .pc-pantalla::after,
html body .aproceso .pc-wa-cab::before,html body .aproceso .pc-wa-cab::after,
html body .aproceso .pc-bloqueo::before,html body .aproceso .pc-bloqueo::after,
html body .aproceso .pc-bloqueo>.pc-bl-hora::before{content:none!important;display:none!important;background:none!important}
html body .aproceso .pc-pantalla{border-radius:calc(var(--pc-tel-alto,480px)*.036);background:color-mix(in srgb,var(--pc-p) 6%,#fff)}
html body .aproceso .pc-wa-cab{background:var(--pc-p);padding-top:10px;padding-bottom:9px}
html body .aproceso .pc-wa-cuerpo{background-color:color-mix(in srgb,var(--pc-p) 6%,#fff);background-image:none}
html body .aproceso .pc-yo{background:color-mix(in srgb,var(--pc-acc) 16%,#fff)}
html body .aproceso .pc-dia{color:var(--pc-suave)}
html body .aproceso .pc-hora svg{color:var(--pc-acc)}
html body .aproceso .pc-wa-pie{background:color-mix(in srgb,var(--pc-p) 5%,#fff);padding-bottom:9px}
html body .aproceso .pc-wa-pie i{background:var(--pc-acc)}
html body .aproceso .pc-bl-app{background:var(--pc-acc)}
html body .aproceso .pc-bloqueo{padding-top:calc(var(--pc-tel-alto,480px)*.045)}
html body .aproceso .pc-bloqueo .pc-bl-hora{font-size:calc(var(--pc-tel-alto,480px)*.075);font-weight:700}
/* Sin logotipos de WhatsApp dentro del móvil: flecha de enviar y burbuja genéricas */
html body .aproceso .pc-wa-pie i svg,html body .aproceso .pc-bl-app:not(.pc-banco):not(.pc-mail) svg{display:none}
html body .aproceso .pc-wa-pie i::after{content:"";width:0;height:0;margin-left:3px;border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent}
html body .aproceso .pc-bl-app:not(.pc-banco):not(.pc-mail)::after{content:"";width:12px;height:9px;background:#fff;border-radius:4px 4px 4px 1px}
html body .aproceso .pc-wa-pie i::before{content:none!important;display:none!important}
/* La pantalla de avisos también es .pc-pantalla: conserva su fondo de marca (aviso de GDGT - Web, 31/10) */
html body .aproceso .pc-pantalla.pc-bloqueo{background:radial-gradient(120% 60% at 20% 0%,color-mix(in srgb,var(--pc-acc) 70%,#fff 10%),transparent 70%),
  linear-gradient(170deg,color-mix(in srgb,var(--pc-acc) 60%,var(--pc-p)),var(--pc-p) 70%,color-mix(in srgb,var(--pc-p) 80%,#000))}

/* ===== E0211-170 (02/11, revisión del SEO, DEC 836 bis): 16 px de aire bajo el título del simulador y resumen de al menos 1 rem. */
html body .aproceso .pc-cab .pc-resumen{margin-top:16px!important;font-size:1rem}

/* ===== DEC 898 (MK MIX 02/11, E0211-1786): móvil genérico DE CALIDAD (sigue la DEC 874: rectángulo con pantalla, sin isla, botones, barra de estado ni reflejo).
   Marco fino en grafito neutro, sombra suave y proporción de móvil de verdad; cabe en la pantalla sin llegar al botón fijo. Pasos sin recorte: .pc-tabs ya no recorta el aro del paso activo. */
html body .aproceso{--pc-tel-alto:470px;--pc-tel-alto:clamp(400px,calc(100svh - 200px),470px)}
html body .aproceso.pc-premium{--pc-tel-alto:500px;--pc-tel-alto:clamp(400px,calc(100svh - 190px),500px)}
@media (min-width:860px){
  html body .aproceso{--pc-tel-alto:clamp(440px,calc(100svh - 170px),520px)}
  html body .aproceso.pc-premium{--pc-tel-alto:clamp(440px,calc(100svh - 170px),540px)}
}
html body .aproceso .pc-tabs{overflow:visible;margin-top:8px;padding-bottom:10px}
html body .aproceso .pc-tabs [role=tab]{min-width:0}
@media (max-width:859px){html body .aproceso .pc-tabs [role=tab]{flex:1 1 0}}
html body .aproceso .pc-bola{position:relative;z-index:2}
html body .aproceso.pc-premium .pc-progreso i{box-shadow:none}
html body .aproceso .pc-movil{width:calc(var(--pc-tel-h)*9/17);background:linear-gradient(150deg,#31353c,#14161a);
  padding:calc(var(--pc-tel-alto,480px)*.0095);border-radius:calc(var(--pc-tel-alto,480px)*.07);
  box-shadow:0 0 0 1px #0b0c0e,inset 0 0 0 1px rgba(255,255,255,.16),0 22px 44px -20px rgba(12,24,48,.42),0 6px 14px -8px rgba(12,24,48,.24)}
html body .aproceso .pc-pantalla{border-radius:calc(var(--pc-tel-alto,480px)*.06);background:#fff}
html body .aproceso .pc-wa-cuerpo{background:color-mix(in srgb,var(--pc-p) 3%,#fff)}
html body .aproceso .pc-wa-pie{background:#fff;border-top:1px solid color-mix(in srgb,var(--pc-p) 8%,#fff)}
html body .aproceso .pc-movil .pc-ellos{box-shadow:0 1px 2px rgba(16,32,64,.14)}
