/* CARIPVCARD 29 · responsive público, avatares consistentes y modo noche de perfiles */

/* =========================================================
   1) AVATARES GLOBALES: la fotografía llena el contenedor
   ========================================================= */
.avatar,
.sidebar-user-avatar,
.topbar-avatar,
.analytics-profile-avatar,
.editor-mini-avatar,
.profile-manager-avatar,
.featured-profile-thumb,
.company-card-avatar,
.account-avatar{
  overflow:hidden;
  flex:0 0 auto;
}
.avatar>img,
.sidebar-user-avatar>img,
.topbar-avatar>img,
.analytics-profile-avatar>img,
.editor-mini-avatar>img,
.profile-manager-avatar>img,
.featured-profile-thumb>img,
.company-card-avatar>img,
.account-avatar>img{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center center!important;
  border-radius:inherit!important;
}
/* Evita que imágenes pequeñas queden centradas dentro del recuadro sin ocuparlo. */
.person-cell .avatar{padding:0!important;line-height:0}
.person-cell .avatar img{min-width:100%;min-height:100%}
.user-chip .avatar{padding:0!important}
.sidebar-profile-card .sidebar-user-avatar{padding:0!important}

/* =========================================================
   2) PERFIL PÚBLICO: ancho seguro y sin desbordamientos
   ========================================================= */
body.public-profile{max-width:100%;overflow-x:hidden}
.public-profile .profile-canvas{
  width:100%;
  max-width:100vw;
  overflow-x:hidden!important;
  padding-inline:max(12px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-right));
}
.public-profile .profile-card-public{
  width:min(520px,calc(100vw - 24px))!important;
  max-width:100%!important;
  min-width:0!important;
}
.public-profile .profile-main,
.public-profile .profile-section,
.public-profile .profile-quick-actions,
.public-profile .profile-primary-buttons,
.public-profile .service-list,
.public-profile .social-grid,
.public-profile .public-document-list,
.public-profile .public-media-carousel,
.public-profile .public-qr-card,
.public-profile .location-card{
  min-width:0;
  max-width:100%;
}
.public-profile .profile-main *{min-width:0}
.public-profile .profile-heading h1,
.public-profile .profile-heading p,
.public-profile .profile-heading span,
.public-profile .profile-bio,
.public-profile .service-list strong,
.public-profile .service-list p,
.public-profile .location-card strong,
.public-profile .location-card span,
.public-profile .public-document-list strong,
.public-profile .public-document-list small{
  overflow-wrap:anywhere;
  word-break:normal;
}
.public-profile .profile-cover,
.public-profile .public-cover-image{max-width:100%}
.public-profile .public-cover-image{object-fit:cover;object-position:center}
.public-profile .profile-avatar-big>img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;display:block!important}

/* Botón claro/oscuro del perfil. */
.public-profile .profile-theme-toggle{
  position:absolute;
  right:64px;
  top:17px;
  width:37px;
  height:37px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.24);
  background:rgba(18,23,34,.16);
  color:#fff;
  display:grid;
  place-items:center;
  z-index:4;
  backdrop-filter:blur(12px);
  box-shadow:0 7px 20px rgba(0,0,0,.08);
  transition:transform .2s ease,background .2s ease;
}
.public-profile .profile-theme-toggle:hover{transform:translateY(-2px);background:rgba(18,23,34,.28)}
.public-profile .profile-theme-toggle i{font-size:14px;pointer-events:none}

/* =========================================================
   3) MODO NOCHE DEL PERFIL PÚBLICO
   ========================================================= */
html[data-profile-theme="dark"] body.public-profile{
  background:#080b11;
  color:#edf2f8;
  color-scheme:dark;
}
html[data-profile-theme="dark"] .public-profile .profile-canvas{
  background:
    radial-gradient(circle at 18% 8%,color-mix(in srgb,var(--profile-primary) 22%,transparent),transparent 31%),
    radial-gradient(circle at 83% 91%,color-mix(in srgb,var(--profile-secondary) 18%,transparent),transparent 31%),
    #080b11!important;
}
html[data-profile-theme="dark"] .public-profile .profile-bg-orb{opacity:.2}
html[data-profile-theme="dark"] .public-profile .profile-card-public{
  background:#10151d!important;
  color:#edf2f8;
  box-shadow:0 28px 90px rgba(0,0,0,.48);
}
html[data-profile-theme="dark"] .public-profile .profile-card-public>.profile-inner-background{
  filter:saturate(.72) brightness(.62) contrast(1.04)!important;
}
html[data-profile-theme="dark"] .public-profile .profile-card-public>.profile-inner-background::after{
  background:linear-gradient(180deg,rgba(7,10,15,.40),rgba(8,12,18,.68) 45%,rgba(10,14,21,.82))!important;
}
html[data-profile-theme="dark"] .public-profile .profile-canvas.v13-pattern-enabled .profile-card-public::before{
  opacity:.065!important;
  filter:brightness(1.6) saturate(.7);
}
html[data-profile-theme="dark"] .public-profile .has-inner-profile-bg .profile-main{
  background:linear-gradient(180deg,rgba(12,17,24,.08),rgba(12,17,24,.28))!important;
  backdrop-filter:blur(1.5px);
}
html[data-profile-theme="dark"] .public-profile .profile-heading h1,
html[data-profile-theme="dark"] .public-profile .section-title span,
html[data-profile-theme="dark"] .public-profile .service-list strong,
html[data-profile-theme="dark"] .public-profile .location-card strong,
html[data-profile-theme="dark"] .public-profile .public-document-list strong,
html[data-profile-theme="dark"] .public-profile .public-qr-card strong,
html[data-profile-theme="dark"] .public-profile .public-media-item figcaption{
  color:#f6f8fb!important;
}
html[data-profile-theme="dark"] .public-profile .profile-heading span,
html[data-profile-theme="dark"] .public-profile .profile-bio,
html[data-profile-theme="dark"] .public-profile .section-title small,
html[data-profile-theme="dark"] .public-profile .service-list p,
html[data-profile-theme="dark"] .public-profile .location-card span,
html[data-profile-theme="dark"] .public-profile .public-document-list small,
html[data-profile-theme="dark"] .public-profile .public-qr-card span{
  color:#aeb7c5!important;
}
html[data-profile-theme="dark"] .public-profile .profile-quick-actions a,
html[data-profile-theme="dark"] .public-profile .location-card,
html[data-profile-theme="dark"] .public-profile .service-list article,
html[data-profile-theme="dark"] .public-profile .profile-service-link,
html[data-profile-theme="dark"] .public-profile .social-grid a,
html[data-profile-theme="dark"] .public-profile .public-document-list>a,
html[data-profile-theme="dark"] .public-profile .public-media-item,
html[data-profile-theme="dark"] .public-profile .public-qr-card{
  background:rgba(20,27,38,.90)!important;
  color:#e6ebf2!important;
  border-color:#2a3443!important;
  box-shadow:none!important;
}
html[data-profile-theme="dark"] .public-profile .profile-quick-actions a span,
html[data-profile-theme="dark"] .public-profile .social-grid a span{color:#dce3ec!important}
html[data-profile-theme="dark"] .public-profile .service-icon,
html[data-profile-theme="dark"] .public-profile .location-card>i,
html[data-profile-theme="dark"] .public-profile .document-icon,
html[data-profile-theme="dark"] .public-profile .document-open{
  background:color-mix(in srgb,var(--profile-primary) 18%,#131a24)!important;
}
html[data-profile-theme="dark"] .public-profile .public-share-main{
  background:#151c27!important;
  border-color:#334052!important;
  color:color-mix(in srgb,var(--profile-primary) 75%,#fff)!important;
}
html[data-profile-theme="dark"] .public-profile .profile-avatar-big{
  border-color:#10151d!important;
  box-shadow:0 14px 35px rgba(0,0,0,.42)!important;
}
html[data-profile-theme="dark"] .public-profile .verified{border-color:#10151d!important}
html[data-profile-theme="dark"] .public-profile .profile-footer{border-color:#293241!important}
html[data-profile-theme="dark"] .public-profile .profile-footer a{color:#cbd3de!important}
html[data-profile-theme="dark"] .public-profile .footer-sep{color:#596374!important}
html[data-profile-theme="dark"] .public-profile .v9-profile-footer .footer-cta{
  background:color-mix(in srgb,var(--profile-primary) 20%,#121923)!important;
  color:color-mix(in srgb,var(--profile-primary) 70%,#fff)!important;
}
/* El QR se conserva blanco para mantener máxima lectura. */
html[data-profile-theme="dark"] .public-profile .public-qr-code{background:#fff!important}

/* Modal de compartir también respeta el modo noche. */
html[data-profile-theme="dark"] .public-share-modal .modal-card{
  background:#111822!important;
  color:#edf2f8!important;
  border:1px solid #2a3443!important;
}
html[data-profile-theme="dark"] .public-share-modal .modal-head{border-color:#2a3443!important}
html[data-profile-theme="dark"] .public-share-modal .modal-head button{color:#d7dee8!important}
html[data-profile-theme="dark"] .public-share-modal .share-preview,
html[data-profile-theme="dark"] .public-share-modal .share-options a{
  background:#171f2b!important;
  border-color:#2a3443!important;
  color:#dce3ec!important;
}
html[data-profile-theme="dark"] .public-share-modal .share-preview span,
html[data-profile-theme="dark"] .public-share-modal .share-preview small{color:#aeb7c5!important}
html[data-profile-theme="dark"] .public-share-modal .share-copy{border-color:#2a3443!important}
html[data-profile-theme="dark"] .public-share-modal .share-copy input{background:#0e141d!important;color:#e5eaf1!important}
html[data-profile-theme="dark"] .public-share-modal .share-copy button{background:#171f2b!important;border-color:#2a3443!important;color:#bbaeff!important}

/* =========================================================
   4) RESPONSIVE FINO PARA CELULARES ESTRECHOS
   ========================================================= */
@media(max-width:780px){
  .public-profile .profile-canvas{padding:0!important}
  .public-profile .profile-card-public{width:100%!important;max-width:100vw!important;border-radius:0!important}
}
@media(max-width:420px){
  .public-profile .profile-main{padding-left:15px!important;padding-right:15px!important}
  .public-profile .profile-quick-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .public-profile .profile-primary-buttons{grid-template-columns:1fr!important}
  .public-profile .location-card{grid-template-columns:42px minmax(0,1fr)!important}
  .public-profile .location-card>a{grid-column:2;justify-self:start;margin-top:4px}
  .public-profile .public-qr-card{grid-template-columns:96px minmax(0,1fr)!important;gap:12px!important;padding:12px!important}
  .public-profile .public-qr-code{width:96px!important;height:96px!important}
  .public-profile .share-options{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:340px){
  .public-profile .profile-heading h1{font-size:25px!important}
  .public-profile .profile-main{padding-left:12px!important;padding-right:12px!important}
  .public-profile .profile-theme-toggle{right:59px}
  .public-profile .share-fab{right:14px}
}

@media(prefers-reduced-motion:reduce){
  .public-profile .profile-theme-toggle{transition:none}
}