/* Cabecera común de las pantallas de plataforma FestaMiCs. */
.platformHeader.platformHeader {
  position: sticky;
  top: 0;
  z-index: 40;
  width: 100%;
  padding: 0;
  background: #fff;
  color: #172033;
  border-bottom: 1px solid #e5e7eb;
}

.platformHeader .platformHeaderInner {
  box-sizing: border-box;
  width: 100%;
  max-width: 1180px;
  min-height: 88px;
  margin: 0 auto;
  padding: 4px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.platformHeader .platformBrandLink {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  text-decoration: none;
}

.platformHeader .brandLogo {
  width: 260px;
  height: 76px;
  max-width: none;
  display: block;
  object-fit: contain;
}



.platformHeaderActions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-left: auto;
}

.platformHeaderButton {
  appearance: none;
  border: 1px solid #d6dee8;
  border-radius: 9px;
  padding: 9px 15px;
  background: #fff;
  color: #17365d;
  font: inherit;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
}

.platformHeaderButton:hover {
  background: #f4f7fa;
}

.platformHeaderButton.primary {
  border-color: #17365d;
  background: #17365d;
  color: #fff;
}

.platformHeaderButton.primary:hover {
  background: #102b4d;
}

/* Selector de idioma para visitantes sin sesión, en el lugar del botón principal. */
.platformHeaderLocale.platformVisitorLocale {
  min-height: 0;
  padding: 9px 30px 9px 13px;
  color: #fff;
  background: #17365d url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 7.5 10 12.5 15 7.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 9px center / 14px no-repeat;
  border-color: #17365d;
  font-size: inherit;
  line-height: 1;
  appearance: none;
}

.platformHeaderLocale.platformVisitorLocale:hover {
  background-color: #102b4d;
}

.platformVisitorLocale option {
  color: #17365d;
  background: #fff;
}

.platformUtilityBar {
  position: relative;
  z-index: 35;
  width: 100%;
  border-bottom: 1px solid #e7ebf0;
  background: rgba(255,255,255,.96);
}

.platformUtilityInner {
  width: min(1180px, calc(100% - 32px));
  min-height: 48px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

@media (max-width: 760px) {
  .platformHeaderActions { gap: 7px; }
  .platformHeaderButton { padding: 8px 11px; font-size: 13px; }
  .platformUtilityInner { justify-content: flex-start; overflow-x: auto; }
}

@media (max-width: 760px) {
  .platformHeader .platformHeaderInner {
    min-height: 99px;
    padding: 8px 16px;
    gap: 10px;
  }

  .platformHeader .brandLogo {
    width: 246px;
    height: 82px;
  }
}

.platformHeader [hidden],
.platformHeader .hidden {
  display: none !important;
}

.platformHeaderLocale {
  min-height: 38px;
  padding: 7px 10px;
  color: #31445e;
  background: linear-gradient(135deg, #f7fafc 0%, #e8eef5 100%);
  border: 1px solid #d6e0ea;
  border-radius: 9px;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.notificationCluster {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.notificationButton {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 38px;
  padding: 7px 10px;
  color: #40516a;
  background: #fff;
  border: 1px solid #d6e0ea;
  border-radius: 9px;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.notificationButton:hover {
  color: #17365d;
  background: #f3f7fb;
  border-color: #becddd;
}

.notificationBadge {
  display: inline-grid;
  place-items: center;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  color: #fff;
  background: #6f2232;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}

.notificationPanel {
  position: absolute;
  z-index: 80;
  top: calc(100% + 8px);
  right: 0;
  width: min(390px, calc(100vw - 32px));
  padding: 12px;
  color: #172033;
  background: #fff;
  border: 1px solid #d6e0ea;
  border-radius: 12px;
  box-shadow: 0 16px 38px rgba(23, 54, 93, 0.18);
}

.notificationPanel > strong {
  display: block;
  margin-bottom: 8px;
  color: #0c2440;
  font-size: 13px;
}

.notificationMentionList {
  display: grid;
  gap: 6px;
}

.notificationMention {
  display: grid;
  gap: 3px;
  width: 100%;
  padding: 9px 10px;
  text-align: left;
  color: #34445a;
  background: #f7f9fc;
  border: 1px solid #e0e7ef;
  border-radius: 9px;
  cursor: pointer;
}

.notificationMention:hover {
  background: #eef4f9;
  border-color: #c8d5e2;
}

.notificationMentionText {
  font-size: 12px;
  line-height: 1.35;
}

.notificationMentionDate {
  color: #69778b;
  font-size: 10px;
}

.notificationEmpty {
  padding: 9px 4px;
  color: #69778b;
  font-size: 12px;
}

.notificationReport {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e1d7da;
  border-radius: 10px;
}

.notificationReportOpen {
  display: grid;
  gap: 4px;
  width: 100%;
  padding: 10px;
  color: #34445a;
  background: #fff9fa;
  border: 0;
  text-align: left;
  cursor: pointer;
}

.notificationReportOpen:hover {
  background: #fdf1f3;
}

.notificationReportReason {
  color: #6f2232;
  font-size: 11px;
  font-weight: 800;
}

.notificationReportDetail {
  color: #56677d;
  font-size: 11px;
  line-height: 1.35;
}

.notificationReportActions {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  padding: 7px 9px;
  background: #f7f9fb;
  border-top: 1px solid #eceff3;
}

.notificationReportActions button {
  padding: 5px 8px;
  color: #4e6076;
  background: #fff;
  border: 1px solid #cdd8e3;
  border-radius: 7px;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}

.notificationReportActions button:hover {
  color: #17365d;
  border-color: #aebfd1;
}

@media (max-width: 980px) {
  .platformHeader .platformHeaderInner {
    align-items: flex-start;
  }

  .platformHeaderActions {
    flex-wrap: wrap;
  }
}

@media (max-width: 760px) {
  .notificationButton span[data-header-mentions],
  .notificationButton span[data-header-private],
  .notificationButton span[data-header-reports] {
    display: none;
  }

  .notificationButton {
    min-width: 36px;
    justify-content: center;
    padding: 7px 8px;
  }

  .platformHeaderLocale {
    max-width: 112px;
    font-size: 12px;
  }
}


/* Cabecera compacta de usuario + reserva central para publicidad. */
.platformHeaderAdSlot {
  /* Base 0: el hueco solo ocupa el espacio libre y nunca encoge el logo ni los botones. */
  flex: 1 1 0;
  min-width: 120px;
  max-width: 560px;
  min-height: 48px;
  margin: 0 16px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  border: 1px dashed #c9d4e1;
  border-radius: 12px;
  background: #f8fafc;
}

/* Texto provisional mientras el hueco no tiene anunciante. */
.platformAdPlaceholder {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: #607086;
  font-size: 13px;
  line-height: 1.3;
  text-align: center;
}

.platformAdContact {
  color: #8b2940;
  font-weight: 800;
  text-decoration: none;
}

.platformAdContact:hover {
  text-decoration: underline;
}

.platformUserMenu { position: relative; }
.platformUserTrigger {
  display: flex; align-items: center; gap: 9px;
  padding: 5px 10px 5px 6px; border: 1px solid #d6e0ea; border-radius: 999px;
  background: #f8fafc; color: #172033; font: inherit; font-weight: 800; cursor: pointer;
}
.platformUserAvatar {
  width: 34px; height: 34px; border-radius: 50%; overflow: hidden;
  display: grid; place-items: center; background: linear-gradient(135deg,#17365d,#8b2940);
  color: #fff; font-weight: 900;
}
.platformUserAvatar.large { width: 52px; height: 52px; }
.platformUserAvatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.platformUserChevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  color: #607086;
  transition: transform .18s ease, color .18s ease;
}
.platformUserChevron svg { width: 16px; height: 16px; display: block; }
.platformUserChevron path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.platformUserTrigger:hover .platformUserChevron { color: #17365d; }
.platformUserTrigger[aria-expanded="true"] .platformUserChevron {
  color: #17365d;
  transform: rotate(180deg);
}
.platformUserDropdown {
  position: absolute; z-index: 100; top: calc(100% + 10px); right: 0;
  width: 320px; padding: 10px; background: #fff; border: 1px solid #dbe3ec;
  border-radius: 16px; box-shadow: 0 20px 50px rgba(23,54,93,.2);
}
.platformUserCard {
  display: flex; align-items: center; gap: 12px; padding: 8px 8px 12px;
  border-bottom: 1px solid #edf0f4; margin-bottom: 5px;
}
.platformUserCard strong { display:block; font-size: 18px; color:#172033; }
.platformUserCard small { display:block; margin-top:2px; color:#758296; }
.platformUserDropdown .notificationCluster { display:grid; width:100%; gap:2px; }
.platformUserDropdown .notificationButton,
.platformMenuItem {
  width:100%; min-height:42px; display:flex; align-items:center; gap:10px;
  padding:9px 10px; border:0; border-radius:9px; background:transparent;
  color:#26364b; font:inherit; font-size:13px; font-weight:700; text-align:left; cursor:pointer;
}
.platformUserDropdown .notificationButton:hover,.platformMenuItem:hover { background:#f3f7fb; }
.platformMenuItem > span:nth-child(2), .platformMenuItem > span:first-of-type { flex:1; }
.platformMenuItem b { font-size:18px; }
.platformMenuItem.danger { margin-top:5px; padding-top:11px; border-top:1px solid #edf0f4; color:#b4232f; }
.platformLanguageItem { cursor:default; }
.platformLanguageValue { flex:0 0 auto !important; }
.platformUserDropdown .platformHeaderLocale {
  width:auto; min-height:32px; border:0; padding:3px 4px; background:transparent;
}
.platformUserDropdown .notificationPanel { right: calc(100% + 8px); top:0; }

@media (max-width: 900px) {
  .platformHeaderAdSlot { display:none; }
  .platformUserName { max-width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}