/* NestPortal v492 · conserva los tiradores claros normales; aplica cabecera + brillo solo con novedades */

/*
 * IMPORTANTE: el estado normal no se redefine aquí.
 * Hereda exactamente el acabado claro y transparente de panel-buttons-v388.css.
 * Solo las clases de notificación activan el aspecto institucional oscuro.
 */
#communityDrawerHandleV277.hasUnreadV296,
#communityDrawerHandleV277.hasSystemUnreadV298,
#sectionDrawerHandleV298.hasNewV299{
  isolation:isolate!important;
  color:#f4fffc!important;
  border-color:rgba(255,229,151,.62)!important;
  background:
    radial-gradient(155% 130% at 82% -18%,rgba(255,229,143,.42) 0%,rgba(255,229,143,.14) 31%,transparent 55%),
    radial-gradient(145% 120% at 4% 112%,rgba(41,224,180,.30) 0%,transparent 55%),
    linear-gradient(118deg,#06483f 0%,#08766a 42%,#09917f 69%,#07594f 100%)!important;
  filter:saturate(108%)!important;
}
#communityDrawerHandleV277.hasUnreadV296,
#communityDrawerHandleV277.hasSystemUnreadV298{
  box-shadow:
    10px 12px 29px rgba(1,46,41,.26),
    0 0 0 1px rgba(255,215,112,.16),
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -16px 26px rgba(1,42,37,.14)!important;
}
#sectionDrawerHandleV298.hasNewV299{
  box-shadow:
    -10px 12px 29px rgba(1,46,41,.26),
    0 0 0 1px rgba(255,215,112,.16),
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -16px 26px rgba(1,42,37,.14)!important;
}

/* Mantiene el color de notificación también durante hover, foco e introducción. */
#communityDrawerHandleV277.hasUnreadV296:hover,
#communityDrawerHandleV277.hasUnreadV296:focus-visible,
#communityDrawerHandleV277.hasUnreadV296.drawerHandleIntroV325,
#communityDrawerHandleV277.hasSystemUnreadV298:hover,
#communityDrawerHandleV277.hasSystemUnreadV298:focus-visible,
#communityDrawerHandleV277.hasSystemUnreadV298.drawerHandleIntroV325,
#sectionDrawerHandleV298.hasNewV299:hover,
#sectionDrawerHandleV298.hasNewV299:focus-visible,
#sectionDrawerHandleV298.hasNewV299.drawerHandleIntroV325{
  border-color:rgba(255,235,174,.76)!important;
  background:
    radial-gradient(155% 130% at 82% -18%,rgba(255,234,161,.49) 0%,rgba(255,234,161,.17) 31%,transparent 56%),
    radial-gradient(145% 120% at 4% 112%,rgba(53,235,191,.34) 0%,transparent 56%),
    linear-gradient(118deg,#075046 0%,#098174 43%,#0a9987 69%,#086257 100%)!important;
  filter:saturate(114%) brightness(1.025)!important;
}

/* Luz interior de la cabecera, únicamente en el estado con novedades. */
#communityDrawerHandleV277.hasUnreadV296::before,
#communityDrawerHandleV277.hasSystemUnreadV298::before,
#sectionDrawerHandleV298.hasNewV299::before{
  z-index:0!important;
  inset:3px!important;
  border-radius:inherit!important;
  background:
    radial-gradient(circle at 72% 13%,rgba(255,248,204,.25) 0 1.5px,transparent 2.5px),
    linear-gradient(168deg,transparent 0 40%,rgba(217,255,246,.10) 42%,transparent 46%),
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(0,50,44,.055))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16)!important;
}
#communityDrawerHandleV277.hasUnreadV296>span:first-child,
#communityDrawerHandleV277.hasSystemUnreadV298>span:first-child,
#sectionDrawerHandleV298.hasNewV299>span:first-child{
  color:#f3fffc!important;
  text-shadow:0 1px 0 rgba(0,35,31,.42),0 4px 12px rgba(0,25,22,.24)!important;
}
#communityDrawerHandleV277.hasUnreadV296 .drawerHandleLabelV325,
#communityDrawerHandleV277.hasUnreadV296 .drawerHandleLabelV325 b,
#communityDrawerHandleV277.hasUnreadV296 .drawerHandleLabelV325 strong,
#communityDrawerHandleV277.hasSystemUnreadV298 .drawerHandleLabelV325,
#communityDrawerHandleV277.hasSystemUnreadV298 .drawerHandleLabelV325 b,
#communityDrawerHandleV277.hasSystemUnreadV298 .drawerHandleLabelV325 strong,
#sectionDrawerHandleV298.hasNewV299 .drawerHandleLabelV325,
#sectionDrawerHandleV298.hasNewV299 .drawerHandleLabelV325 b,
#sectionDrawerHandleV298.hasNewV299 .drawerHandleLabelV325 strong{
  color:#f4fffc!important;
  text-shadow:0 1px 0 rgba(0,37,32,.40)!important;
}

/* Reflejo: no existe en reposo; aparece exclusivamente mientras haya novedades. */
#communityDrawerHandleV277.hasUnreadV296::after,
#communityDrawerHandleV277.hasSystemUnreadV298::after,
#sectionDrawerHandleV298.hasNewV299::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:1!important;
  top:-28%!important;
  bottom:-28%!important;
  left:-72%!important;
  width:46%!important;
  height:auto!important;
  border-radius:999px!important;
  pointer-events:none!important;
  opacity:0!important;
  background:linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.10) 24%,
    rgba(255,248,207,.82) 50%,
    rgba(255,255,255,.26) 68%,
    rgba(255,255,255,0) 100%)!important;
  box-shadow:0 0 13px rgba(255,239,174,.25)!important;
  transform:translate3d(0,0,0) skewX(-17deg)!important;
  will-change:transform,opacity;
  animation:panelUnreadShineV492 4.6s cubic-bezier(.22,.72,.24,1) infinite!important;
}
@keyframes panelUnreadShineV492{
  0%,62%{opacity:0;transform:translate3d(0,0,0) skewX(-17deg)}
  65%{opacity:.18}
  69%{opacity:.92}
  84%{opacity:.88;transform:translate3d(430%,0,0) skewX(-17deg)}
  88%,100%{opacity:0;transform:translate3d(430%,0,0) skewX(-17deg)}
}

/* Los indicadores permanecen encima del reflejo. */
#communityDrawerHandleV277.hasUnreadV296 em#communityDrawerHandleBadgeV296,
#communityDrawerHandleV277.hasSystemUnreadV298 em#communityDrawerHandleBadgeV296,
#sectionDrawerHandleV298.hasNewV299 i{
  z-index:5!important;
  background:linear-gradient(180deg,#fff0aa,#efb531)!important;
  border-color:rgba(255,255,255,.98)!important;
  box-shadow:0 4px 11px rgba(0,31,27,.26),0 0 0 1px rgba(111,72,0,.07)!important;
}

@media(prefers-reduced-motion:reduce){
  #communityDrawerHandleV277.hasUnreadV296::after,
  #communityDrawerHandleV277.hasSystemUnreadV298::after,
  #sectionDrawerHandleV298.hasNewV299::after{
    animation:none!important;
    display:none!important;
  }
}