@charset "UTF-8";

/* Complemento a Material Kit / Bootstrap: carrusel, chips de info y media */

/* Material Kit redefine .material-icons → "Material Icons Round"; asegurar stack con la fuente clásica por si el CDN Round falla */
body.galeria-cobaqroo-app .material-icons{
  font-family:'Material Icons Round','Material Icons',sans-serif;
  font-weight:normal;
  font-style:normal;
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  display:inline-block;
  white-space:nowrap;
  word-wrap:normal;
  direction:ltr;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:'liga';
  -webkit-font-feature-settings:'liga';
}

:root{
  --gap:12px;
  --galeria-max-width:470px;
  --galeria-app-bg:#fafafa;
  --galeria-border:#dbdbdb;
}

*{box-sizing:border-box}

html,body{
  margin:0;
  padding:0;
}

.feed{
  min-height:60vh;
  padding-top:0.35rem;
  display:flex;
  flex-direction:column;
  gap:0;
}

/* Barra fija: búsqueda + filtros (estilo app social) */
.galeria-cobaqroo-toolbar-wrap{
  position:sticky;
  top:0;
  z-index:1020;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid rgba(0,0,0,.06);
  padding:0.65rem 0 0.45rem;
}

.galeria-search-group{
  border:1px solid var(--galeria-border);
  border-radius:12px;
  background:#fff;
  align-items:center;
  flex-wrap:nowrap;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}

.galeria-search-group .form-control{
  box-shadow:none !important;
  font-size:0.9rem;
}

.galeria-search-group .form-control:focus{
  border-color:transparent;
}

.galeria-search-icon{
  font-size:22px !important;
  opacity:.75;
}

.galeria-filter-chips .galeria-chip{
  border:1px solid var(--galeria-border);
  background:#fff;
  border-radius:999px;
  font-size:0.72rem;
  font-weight:600;
  padding:0.38rem 0.85rem;
  color:#262626;
  transition:background .15s ease,color .15s ease,border-color .15s ease,transform .1s ease;
  cursor:pointer;
}

.galeria-filter-chips .galeria-chip:hover{
  transform:translateY(-1px);
}

.galeria-filter-chips .galeria-chip.is-active{
  background:#262626;
  color:#fff;
  border-color:#262626;
}

.galeria-filter-chips .galeria-chip:focus-visible{
  outline:2px solid var(--bs-primary,#0d6efd);
  outline-offset:2px;
}

/* Franja tipo “historias” / accesos rápidos */
.galeria-stories{
  display:flex;
  gap:0.15rem;
  overflow-x:auto;
  padding:0.45rem 0.75rem 0.35rem;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  mask-image:linear-gradient(90deg,#000 92%,transparent);
}

.galeria-stories::-webkit-scrollbar{
  display:none;
}

.galeria-story{
  flex:0 0 auto;
  border:none;
  background:transparent;
  padding:0 0.2rem;
  cursor:pointer;
  text-align:center;
  max-width:76px;
}

.galeria-story:focus-visible{
  outline:2px solid var(--bs-primary,#0d6efd);
  outline-offset:2px;
  border-radius:8px;
}

.galeria-story-ring{
  display:block;
  width:64px;
  height:64px;
  padding:2.5px;
  border-radius:50%;
  margin:0 auto 0.35rem;
  background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);
}

.galeria-story-ring img{
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:cover;
  display:block;
  border:2.5px solid #fff;
}

.galeria-story-fallback{
  width:100%;
  height:100%;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  border:2.5px solid #fff;
  background:linear-gradient(135deg,var(--bs-primary,#0d6efd),var(--bs-cyan,#0dcaf0));
  color:#fff;
  font-size:0.65rem;
  font-weight:800;
}

.galeria-story-label{
  font-size:0.65rem;
  color:#262626;
  display:block;
  max-width:76px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Tarjeta tipo feed (Instagram / Threads) */
.galeria-cobaqroo-post{
  background:#fff;
  border-bottom:1px solid #efefef;
  margin-bottom:0;
  scroll-margin-top:118px;
}

.galeria-post-head{
  display:flex;
  align-items:center;
  padding:0.72rem 0.85rem 0.42rem;
  gap:0.65rem;
}

.galeria-post-avatar{
  flex-shrink:0;
}

.galeria-post-title-row{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:0.2rem 0.35rem;
  font-size:0.875rem;
  line-height:1.25;
}

.galeria-post-author{
  font-weight:600;
  color:#262626;
}

.galeria-post-dot,
.galeria-post-time{
  color:#8e8e8e;
  font-size:0.8rem;
  font-weight:400;
}

.galeria-post-badge{
  display:inline-block;
  margin-top:0.22rem;
  font-size:0.62rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.04em;
  color:#8e8eae;
}

.galeria-post-badge--plantel{ color:#0d9488; }
.galeria-post-badge--emsad{ color:#7c3aed; }
.galeria-post-badge--csai{ color:#ea580c; }
.galeria-post-badge--otro{ color:#737373; }

.galeria-post-more{
  flex-shrink:0;
  margin-left:auto;
  opacity:.85;
}

.galeria-post-more:hover{
  opacity:1;
}

.galeria-cobaqroo-post .media-block{
  margin:0;
  border-radius:0;
  overflow:hidden;
}

@media (min-width:576px){
  .galeria-cobaqroo-post .media-block{
    border-radius:6px;
    margin-left:0.85rem;
    margin-right:0.85rem;
  }
}

@media (max-width:575px){
  .galeria-cobaqroo-post .carousel-slide img,
  .galeria-cobaqroo-post .media-image{
    border-radius:0;
  }
}

.galeria-post-actions{
  display:flex;
  align-items:center;
  padding:0.45rem 0.85rem 0.35rem;
  gap:0.15rem;
}

.galeria-post-action{
  border:none;
  background:transparent;
  padding:0.28rem;
  color:#262626;
  line-height:0;
  border-radius:50%;
  transition:opacity .15s ease,transform .15s ease;
}

.galeria-post-action .material-icons{
  font-size:26px;
}

.galeria-post-action:disabled{
  opacity:0.32;
  cursor:default;
}

.galeria-post-action--active:not(:disabled){
  cursor:pointer;
  opacity:1;
}

.galeria-post-action--active:not(:disabled):hover{
  opacity:0.75;
}

.galeria-post-highlight{
  animation:galeriaPostFlash 1.25s ease;
}

@keyframes galeriaPostFlash{
  0%,100%{ background-color:transparent; }
  12%{ background-color:rgba(13,202,240,.14); }
}

.galeria-post-action--pulse{
  animation:galeriaBtnPop .45s ease;
}

@keyframes galeriaBtnPop{
  40%{ transform:scale(1.12); }
}

.galeria-cobaqroo-post .post-link{
  color:var(--bs-primary);
  text-decoration:none;
  transition:opacity .15s ease;
}

.galeria-cobaqroo-post .post-link:hover{
  opacity:.85;
}

.media-block{
  border-radius:6px;
  overflow:hidden;
}

.media-link{
  display:block;
}

.media-image{
  width:100%;
  object-fit:cover;
  display:block;
  border-radius:6px;
}

.media-banner{
  aspect-ratio:1200 / 630;
}

.media-square{
  aspect-ratio:1 / 1;
}

.carousel{
  display:block;
}

.carousel-track{
  display:flex;
  gap:var(--gap);
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  touch-action:pan-x;
  cursor:grab;
}

.carousel-track.is-dragging{
  cursor:grabbing;
  scroll-snap-type:none;
  user-select:none;
}

.carousel-track.is-dragging img{
  user-select:none;
  pointer-events:none;
}

.carousel:focus{
  outline:none;
}

.carousel:focus-visible{
  outline:2px solid var(--bs-primary,#0d6efd);
  outline-offset:2px;
  border-radius:6px;
}

.carousel-track::-webkit-scrollbar{
  display:none;
}

.carousel-slide{
  flex:0 0 calc(50% - (var(--gap) / 2));
  scroll-snap-align:start;
  aspect-ratio:1 / 1;
}

.carousel-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:6px;
}

.carousel-dots{
  display:flex;
  justify-content:center;
  gap:6px;
  margin-top:10px;
  color:var(--bs-primary,#0d6efd);
}

.carousel-dot{
  width:6px;
  height:6px;
  border-radius:999px;
  border:none;
  padding:0;
  background:currentColor;
  opacity:.35;
  cursor:pointer;
  position:relative;
  transition:transform 140ms ease, opacity 140ms ease;
}

.carousel-dot.is-active{
  opacity:.8;
}

.carousel-dot::before{
  content:"";
  position:absolute;
  inset:-6px;
}

.carousel-dot:hover{
  opacity:.6;
  transform:translateY(-1px);
}

.carousel-dot:active{
  opacity:.45;
  transform:scale(0.92);
}

.carousel-dot:focus-visible{
  opacity:.75;
  transform:translateY(-1px);
}

@supports not (aspect-ratio: 1 / 1){
  .media-banner,
  .media-square,
  .carousel-slide{
    position:relative;
  }
  .media-banner::before{
    content:"";
    display:block;
    padding-top:52.5%;
  }
  .media-square::before,
  .carousel-slide::before{
    content:"";
    display:block;
    padding-top:100%;
  }
  .media-banner > img,
  .media-square > img,
  .carousel-slide > img{
    position:absolute;
    top:0;
    left:0;
    height:100%;
  }
}

@media (max-width:360px){
  :root{ --gap:8px; }
}

/* Ficha del plantel: colapsable (details), debajo de la barra tipo comentarios/compartir */
.galeria-cobaqroo-post .galeria-post-details{
  margin:0.15rem 0.75rem 0.5rem;
  padding:0;
  border:none;
}

.galeria-cobaqroo-post .galeria-post-details-summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:0.35rem;
  padding:0.42rem 0.5rem;
  margin:0;
  font-size:0.8125rem;
  font-weight:600;
  color:#262626;
  border-radius:0.5rem;
  background:rgba(0,0,0,.03);
  border:1px solid rgba(0,0,0,.06);
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  transition:background .15s ease;
}

.galeria-cobaqroo-post .galeria-post-details-summary:hover{
  background:rgba(0,0,0,.045);
}

.galeria-cobaqroo-post .galeria-post-details-summary:focus{
  outline:2px solid var(--bs-primary,#0d6efd);
  outline-offset:1px;
}

.galeria-cobaqroo-post .galeria-post-details-summary::-webkit-details-marker,
.galeria-cobaqroo-post .galeria-post-details-summary::marker{
  display:none;
  content:'';
}

.galeria-cobaqroo-post .galeria-post-details-chevron{
  flex-shrink:0;
  font-size:1.35rem !important;
  color:#8e8e8e;
  transition:transform .2s ease;
  line-height:1;
}

.galeria-cobaqroo-post .galeria-post-details[open] .galeria-post-details-chevron{
  transform:rotate(180deg);
}

.galeria-cobaqroo-post .galeria-post-details-summary-text{
  flex-shrink:0;
}

.galeria-cobaqroo-post .galeria-post-details-preview{
  flex:1;
  min-width:0;
  font-weight:400;
  color:#8e8e8e;
  font-size:0.75rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  text-align:right;
}

/* Chips / bloque interior (solo visible al expandir) */
.galeria-cobaqroo-post .post-info{
  margin:0.45rem 0 0.35rem;
  padding:0.5rem 0.75rem;
  border-radius:0.5rem;
  background:var(--bs-light,#f8f9fa);
  border:1px solid rgba(0,0,0,.06);
  font-size:0.8125rem;
}

.galeria-cobaqroo-post .post-info-main{
  display:flex;
  flex-direction:column;
  gap:0.15rem;
  color:var(--bs-secondary,#6c757d);
}

.galeria-cobaqroo-post .post-info-caps{
  display:flex;
  flex-wrap:wrap;
  gap:0.35rem;
  margin-top:0.5rem;
}

.galeria-cobaqroo-post .post-info .tag{
  display:inline-block;
  padding:0.2rem 0.5rem;
  border-radius:999px;
  font-size:0.7rem;
  font-weight:500;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  color:var(--bs-body-color,#344767);
}