/*Comunitat - tema setmana*/

#llistaDebat .content {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.35s ease;
  margin-top: 0;
}

#llistaDebat .content.open {
  max-height: 400px;
  opacity: 1;
  margin-top: 0.6rem;
}


/* Comunitat v2.0 — Subnav + Tabs */

/* Estat desactivat del botó Comunitat */
.new-badge-btn.is-disabled{
  opacity:.55;
  cursor:not-allowed;
  pointer-events:auto; /* permet captar el clic per mostrar el missatge */
  filter: grayscale(18%);
}
.new-badge-btn.is-enabled{
  opacity:1;
  cursor:pointer;
  filter:none;
}


/* SUBNAV enganxada sota el degradat */
.subnav {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, .7);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(10, 26, 43, .08);
  box-shadow: 0 6px 20px rgba(15, 23, 42, .08);
}
.subnav .wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 10px 20px;
  position: relative;
  display: flex;
  gap: 8px;
}

/* Botons de tabs */
.tab-btn {
  border: 0;
  cursor: pointer;
  padding: 10px 16px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 15px;
  background: transparent;
  color: #0b1b2b;
  position: relative;
  transition: background .2s ease, color .2s ease;
}
.tab-btn:hover {
  background: #eef6ff;
}
.tab-btn.is-active {
  color: #0a4a6b;
  background: #e6f6ff;
}

/* Indicador actiu (barreta que es mou sota el tab actiu) */
.tab-indicator {
  position: absolute;
  bottom: 0;
  height: 3px;
  border-radius: 3px;
  background: linear-gradient(135deg, #0ea5ea, #5fddff);
  width: 0;
  left: 0;
  transition: left .25s ease, width .25s ease;
}

/* Panells de contingut */
.tab-panel {
  display: none;
}
.tab-panel.is-active {
  display: block;
  animation: fadeIn .25s ease;
}

@keyframes fadeIn {
  from {opacity: 0; transform: translateY(6px);}
  to   {opacity: 1; transform: translateY(0);}
}

/* Notes / placeholders dins dels panells */
.tab-note {
  background: #fff;
  border: 1px dashed #cfe8ff;
  color: #0a4a6b;
  padding: 14px;
  border-radius: 14px;
  margin: 14px 0;
}


/* Modal Q&A */
.ask-modal{
  position:fixed; inset:0; background:rgba(8,12,20,.6);
  display:none; align-items:center; justify-content:center; z-index:10000;
}
.ask-modal.open{ display:flex; }
.ask-dialog{
  width:min(620px,92vw); background:#fff; border-radius:16px;
  box-shadow:0 24px 60px rgba(0,0,0,.3); padding:16px;
}
.ask-label{ display:block; font-weight:700; font-size:14px; margin:10px 0 6px; }
.ask-dialog input, .ask-dialog textarea{
  width:100%; border:1px solid #e5edf5; border-radius:10px; padding:10px 12px; font:inherit; outline:none;
}
.ask-dialog input:focus, .ask-dialog textarea:focus{
  border-color:#0ea5ea; box-shadow:0 0 0 3px rgba(14,165,234,.15);
}
.ask-actions{ display:flex; gap:8px; justify-content:flex-end; margin-top:12px; }


/* ==========================
   CERCLes — rodones + carrusel
   Namespace: .c2-
   ========================== */
  #cx-circles{background:#fff;border-radius:18px;box-shadow:0 10px 30px rgba(15,23,42,.12);padding:18px;margin:20px 0}
  #cx-circles .cx-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:14px}
  #cx-circles .cx-hd h2{margin:0;font:800 18px/1 Inter,system-ui,sans-serif;color:#0b1b2b}
  #cx-circles .cx-hd p{margin:0;color:#6b7a8c;font:14px/1.4 Inter,system-ui,sans-serif}

  /* Carrusel (forçat) */
  #cx-circles .cx-scroller{
    display:flex !important;gap:18px !important;overflow-x:auto !important;
    padding:6px 2px 12px !important;scroll-snap-type:x mandatory !important;-webkit-overflow-scrolling:touch !important;
  }
  #cx-circles .cx-item{
    flex:0 0 140px !important;scroll-snap-align:center !important;
    display:flex !important;flex-direction:column !important;align-items:center !important;gap:10px !important;text-align:center !important;
  }

  /* Rodona tipus “stories” amb anell degradat */
  #cx-circles .cx-avatar{
    width:120px;height:120px;border-radius:50%;padding:4px;
    background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#1e3a8a,#0ea5ea) border-box;
    border:4px solid transparent;box-shadow:0 12px 30px rgba(15,23,42,.16);
    display:grid;place-items:center;overflow:hidden;
  }
  #cx-circles .cx-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
  #cx-circles .cx-avatar .cx-label{width:100%;height:100%;border-radius:50%;display:grid;place-items:center;background:#e6f6ff;color:#0b1b2b;font-weight:800}

  #cx-circles .cx-title{font-weight:800;font-size:14px;color:#0b1b2b;margin-top:6px}
  #cx-circles .cx-meta{color:#6b7a8c;font-size:12px}
  #cx-circles .cx-btn{border:0;border-radius:999px;padding:6px 10px;font-weight:800;cursor:pointer;background:#0ea5ea;color:#0b1b2b;box-shadow:0 6px 18px rgba(14,165,234,.25)}
  #cx-circles .cx-btn:hover{filter:brightness(1.05)}

  /* Fletxes */
  #cx-circles .cx-nav{display:flex;gap:8px}
  #cx-circles .cx-nav button{border:0;cursor:pointer;width:38px;height:38px;border-radius:999px;background:rgba(10,26,43,.08)}
  #cx-circles .cx-nav button:hover{background:rgba(10,26,43,.12)}

#cx-circles { grid-column: 1 / -1; }


/* Header (hero) recursos amb degradat com Comunitat */
.rc-hero{
  background:linear-gradient(135deg,#1e3a8a 0%,#0ea5ea 100%);
  color:#fff; padding:28px 16px;
  border-bottom-left-radius:20px; border-bottom-right-radius:20px;
}
.rc-hero .wrap{max-width:1100px;margin:0 auto}
.rc-hero h1{margin:0 0 8px}
.rc-hero p{margin:0;opacity:.95}


/* Header Cercles */
.c-hero{
  background:linear-gradient(135deg,#1e3a8a 0%,#0ea5ea 100%);
  color:#fff; padding:28px 16px;
  border-bottom-left-radius:20px; border-bottom-right-radius:20px;
}
.c-hero .wrap{max-width:1100px;margin:0 auto}
.c-hero h1{margin:0 0 8px}
.c-hero p{margin:0;opacity:.95}

/* === PATCH: llistat d’ofertes sempre visible === */
#ofertes-publicades {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.5rem;
}
@media (max-width: 768px) {
  #ofertes-publicades { grid-template-columns: 1fr; }
}


 /*Modal lliscant 2.0*/
  /* ✅ Modal Comunitat – habilitar swipe amb el teu HTML real */
#communityTrack{
  touch-action: pan-x;             /* permet el gest horitzontal */
  overscroll-behavior-x: contain;  /* evita “back swipe”/rebots */
}

/*Tags comunitat*/

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0 10px;
}

.tag {
  display: inline-block;
  background: rgba(14,165,234,0.15);
  color: #0b466d;
  font-weight: 600;
  font-size: 13px;
  padding: 4px 10px;
  border-radius: 999px;
  transition: all 0.25s ease;
}

.tag:hover {
  background: rgba(14,165,234,0.25);
}

.tag-alt {
  background: rgba(234,179,8,0.18);
  color: #6b4e00;
}

/*not allowed*/

.tab-btn.is-disabled {
  opacity: .55;
  cursor: not-allowed;
}
.tab-btn.is-disabled:hover {
  opacity: .7;
}


  /* Botó comunitat v2.0 */
  .new-badge-btn {
    display: inline-flex; align-items: center; justify-content: center;
    gap: .5rem; width: calc(100% - 20px); margin: 8px 10px 0;
    text-align: center;
  }
  .new-badge-btn .label { font-size: .78rem; }


/*Estils modal docent v2*/

.mdocent.hidden { display: none; }
.mdocent { position: fixed; inset: 0; z-index: 1000; }
.mdocent__overlay { position: absolute; inset: 0; background: rgba(17, 24, 39, .45); backdrop-filter: blur(2px); }
.mdocent__panel { position: relative; margin: 6vh auto; max-width: 520px; background: #fff; border-radius: 18px; box-shadow: 0 10px 30px rgba(0,0,0,.15); padding: 20px; }
.mdocent__close { position: absolute; top: 10px; right: 12px; border: 0; background: transparent; font-size: 28px; line-height: 1; cursor: pointer; color: #475569; }
.mdocent__header { display: flex; gap: 14px; align-items: center; margin-bottom: 8px; }
.mdocent__avatar { width: 64px; height: 64px; border-radius: 999px; object-fit: cover; border: 2px solid #e5e7eb; }
.mdocent__nom { margin: 0; font-size: 1.25rem; color: #111827; }
.mdocent__meta { font-size: .9rem; color: #6b7280; display: flex; gap: 8px; align-items: center; }
.mdocent__bio { color: #374151; font-size: .98rem; }
.mdocent__actions { margin-top: 14px; display: flex; gap: 10px; }
.btn { appearance: none; border: 0; padding: 10px 16px; border-radius: 12px; cursor: pointer; font-weight: 600; }
.btn--gold { background: linear-gradient(135deg, #a67c00, #d4af37); color: #1f2937; }
.btn--gold:hover { filter: brightness(1.05); }
.btn--outline { background: #fff; border: 1px solid #e5e7eb; color: #374151; }
.author-link { text-decoration: none !important; color: inherit !important; display: inline-flex; align-items: center; gap: 6px; }
.author-link:hover { text-decoration: underline !important; text-decoration-color: #d4af37 !important; color: #d4af37 !important; }


/*Seguidors v2*/

.user-stats {
  display: flex;
  justify-content: space-around;
  margin-top: 8px;
}

.stat-item {
  text-align: center;
}

.stat-item b {
  font-size: 1.2rem;
  color: #1a237e; /* blau corporatiu */
}


/* 🔹 Enllaç autor (preguntes i respostes) */
.author-link {
  text-decoration: none;
  color: inherit;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

.author-link span,
.author-link b {
  text-decoration: none;
  color: inherit;
}

/* 🔸 Hover → tot daurat */
.author-link:hover,
.author-link:hover span,
.author-link:hover b {
  color: #d4af37;                /* text daurat */
  text-decoration: underline;    
  text-decoration-color: #d4af37;
}

.author-link img {
  border-radius: 50%;
  transition: box-shadow 0.2s ease;
}

.author-link:hover img {
  box-shadow: 0 0 0 2px #d4af37; /* halo daurat */
}

.centres-confianca__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
  margin-top: 2rem;
}

.centre-card {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 16px;
  padding: 1.2rem;
  text-align: center;
}

.centre-logo {
  max-height: 60px;
  margin-bottom: 1rem;
  object-fit: contain;
}

.centre-tipus {
  font-size: 0.85rem;
  opacity: 0.7;
}

.centre-opinio {
  font-style: italic;
  margin: 0.8rem 0;
}

.centre-link {
  font-weight: 600;
  color: #1a237e;
  text-decoration: none;
}