/*
  /2026/assets/css/skins/sociales.css
  Skin de fechas sociales · Día de la Mujer / Día de la Madre / efemérides comunitarias

  Se activa desde header.php:
  - automáticamente en fechas sociales configuradas
  - manualmente con ?skin=sociales
*/

body.skin-sociales{
  --skin-lila:#8b5cf6;
  --skin-violeta:#6d28d9;
  --skin-rosa:#f472b6;
  --skin-rosa-2:#fce7f3;
  --skin-blanco:#ffffff;
  --skin-tinta:#0f172a;
}

body.skin-sociales{
  background:
    radial-gradient(circle at 14% 0%, rgba(244,114,182,.18), transparent 32%),
    radial-gradient(circle at 88% 4%, rgba(139,92,246,.15), transparent 30%),
    linear-gradient(180deg, #fff7fb 0%, #ffffff 42%, #faf5ff 100%);
}

body.skin-sociales .topbar{
  background:
    linear-gradient(90deg, rgba(244,114,182,.13), rgba(255,255,255,.96) 36%, rgba(255,255,255,.96) 64%, rgba(139,92,246,.13));
  border-bottom:1px solid rgba(139,92,246,.16);
}

body.skin-sociales .topbar::after{
  content:"";
  display:block;
  height:4px;
  background:
    linear-gradient(90deg,
      var(--skin-rosa) 0%,
      var(--skin-lila) 46%,
      var(--skin-violeta) 100%);
  box-shadow:0 1px 0 rgba(109,40,217,.12);
}

body.skin-sociales .brand-icon{
  filter:drop-shadow(0 4px 10px rgba(139,92,246,.18));
}

body.skin-sociales .brand-clima-word{
  color:#0f172a;
}

body.skin-sociales .brand-perga-word{
  color:var(--skin-violeta);
}

body.skin-sociales .station-switch-btn,
body.skin-sociales .hamburger-btn,
body.skin-sociales .header-user-badge{
  border-color:rgba(139,92,246,.18);
  background:rgba(255,255,255,.94);
  box-shadow:0 8px 22px rgba(139,92,246,.08);
}

body.skin-sociales .station-switch-btn:hover,
body.skin-sociales .hamburger-btn:hover,
body.skin-sociales .header-user-badge:hover{
  background:rgba(252,231,243,.82);
}

body.skin-sociales .header-user-badge{
  color:var(--skin-violeta);
  background:linear-gradient(90deg, rgba(252,231,243,.88), rgba(245,243,255,.92));
}

body.skin-sociales .header-user-avatar{
  background:linear-gradient(135deg, var(--skin-violeta), var(--skin-rosa));
  box-shadow:0 5px 14px rgba(139,92,246,.20);
}

body.skin-sociales .station-panel,
body.skin-sociales .header-user-panel,
body.skin-sociales .services-panel{
  border-color:rgba(139,92,246,.16);
  box-shadow:0 24px 64px rgba(139,92,246,.18);
}

body.skin-sociales .station-panel-title,
body.skin-sociales .header-user-panel-title,
body.skin-sociales .services-subtitle{
  color:rgba(109,40,217,.68);
}

body.skin-sociales .station-panel-item:hover,
body.skin-sociales .station-panel-item.is-active,
body.skin-sociales .header-user-panel-link:hover,
body.skin-sociales .services-link:hover{
  background:linear-gradient(90deg, rgba(252,231,243,.82), rgba(245,243,255,.92));
  border-color:rgba(139,92,246,.24);
}

body.skin-sociales .services-link.login{
  background:rgba(252,231,243,.70);
  border-color:rgba(139,92,246,.18);
  color:var(--skin-violeta);
}

body.skin-sociales .card,
body.skin-sociales .panel,
body.skin-sociales .mapa-card,
body.skin-sociales .pll-card{
  border-color:rgba(139,92,246,.12);
}

@media (max-width:640px){
  body.skin-sociales .topbar::after{
    height:3px;
  }
}