/* ═══ /clubs polish ═══ */

#page-clubs .sl{
  font-size:10px !important;
  letter-spacing:4px !important;
  color:var(--p-accent) !important;
  text-transform:uppercase;
}
#page-clubs .st{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(38px, 5vw, 56px) !important;
  letter-spacing:.02em !important;
  line-height:1 !important;
  color:var(--p-ink) !important;
  margin-bottom:32px !important;
}

/* ── Top action buttons (Создать клуб / Ввести код) ── */
#page-clubs .cl-top{
  margin-bottom:36px !important;
  padding-bottom:24px;
  border-bottom:1px solid var(--p-line);
}
#page-clubs .cl-top .btn-g{
  padding:14px 26px !important;
  border-radius:var(--p-r) !important;
  transition:
    transform var(--p-base) var(--p-ease),
    box-shadow var(--p-base) var(--p-ease),
    background var(--p-base) var(--p-ease) !important;
}
#page-clubs .cl-top .btn-g:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(212,182,86,.35);
}
#page-clubs .cl-top button[onclick*="Join"]{
  padding:14px 26px !important;
  border-radius:var(--p-r) !important;
  transition:all var(--p-base) var(--p-ease) !important;
}
#page-clubs .cl-top button[onclick*="Join"]:hover{
  background:var(--p-accent-soft) !important;
  transform:translateY(-2px);
}

/* ── Карточки клубов ── */
#page-clubs .cl-card{
  background:var(--p-surface) !important;
  border:1px solid var(--p-line) !important;
  border-radius:var(--p-r-lg) !important;
  overflow:hidden;
  transition:
    border-color var(--p-base) var(--p-ease),
    background var(--p-base) var(--p-ease),
    transform var(--p-slow) var(--p-ease),
    box-shadow var(--p-slow) var(--p-ease) !important;
}
#page-clubs .cl-card:hover{
  border-color:var(--p-accent) !important;
  background:var(--p-surface-acc) !important;
  transform:translateY(-4px) !important;
  box-shadow:0 14px 36px rgba(0,0,0,.45), 0 0 22px rgba(212,182,86,.18);
}
#page-clubs .cl-cover,
#page-clubs .cl-cover-ph{
  border-radius:0 !important;            /* верхняя часть — без радиуса (потому что overflow:hidden) */
  transition:transform var(--p-slow) var(--p-ease);
}
#page-clubs .cl-card:hover .cl-cover{
  transform:scale(1.04);
}
#page-clubs .cl-name{
  font-size:20px !important;
  letter-spacing:.04em !important;
  color:var(--p-ink) !important;
  margin-bottom:6px !important;
}
#page-clubs .cl-desc{
  color:var(--p-ink-mute) !important;
  font-size:12.5px !important;
  line-height:1.5 !important;
}
#page-clubs .cl-meta{
  font-size:10px !important;
  letter-spacing:2px !important;
  color:var(--p-accent) !important;
  margin-top:12px !important;
  text-transform:uppercase;
}

/* ── Hero клуба (внутри клуба) ── */
#page-clubs .club-hero{
  padding:24px !important;
  background:linear-gradient(180deg,
    var(--p-surface-acc) 0%,
    var(--p-surface) 100%) !important;
  border:1px solid var(--p-line) !important;
  border-radius:var(--p-r-lg) !important;
  margin-bottom:32px !important;
}
#page-clubs .club-hero > img,
#page-clubs .club-hero-ph{
  border-radius:var(--p-r) !important;
  border:1px solid var(--p-line);
}
#page-clubs .club-chip{
  border-radius:9999px !important;
  padding:5px 12px !important;
  background:var(--p-surface-hi) !important;
  border:1px solid var(--p-line) !important;
  color:var(--p-ink-soft) !important;
  font-family:'Inter',sans-serif !important;
}

/* ── Block titles ── */
#page-clubs .club-block-title{
  font-size:11px !important;
  letter-spacing:3px !important;
  color:var(--p-accent) !important;
  text-transform:uppercase;
  margin-bottom:16px !important;
  display:flex;
  align-items:center;
  gap:10px;
}
#page-clubs .club-block-title::before{
  content:"";
  width:6px;height:6px;
  border-radius:50%;
  background:var(--p-accent);
  flex-shrink:0;
}

/* ── Фильм недели pick ── */
#page-clubs .club-pick{
  background:var(--p-surface) !important;
  border:1px solid var(--p-line) !important;
  border-radius:var(--p-r-md) !important;
  padding:18px !important;
  transition:border-color var(--p-base) var(--p-ease);
}
#page-clubs .club-pick:hover{border-color:var(--p-line-strong) !important;}
#page-clubs .club-pick img{
  border-radius:var(--p-r) !important;
  transition:transform var(--p-base) var(--p-ease);
}
#page-clubs .club-pick img:hover{transform:scale(1.03);}
#page-clubs .cp-title{
  font-size:20px !important;
  letter-spacing:.04em !important;
}
#page-clubs .cp-title:hover{color:var(--p-accent) !important;}
#page-clubs .cp-meta{
  color:var(--p-ink-mute) !important;
  font-size:11px !important;
  letter-spacing:1px !important;
}
#page-clubs .cp-title + * + .btn-g,
#page-clubs .club-pick .btn-g{
  border-radius:var(--p-r) !important;
  padding:10px 18px !important;
}

/* ── Участники ── */
#page-clubs .cm-mem{
  background:var(--p-surface) !important;
  border:1px solid var(--p-line) !important;
  border-radius:var(--p-r-md) !important;
  padding:10px 14px !important;
  transition:background var(--p-base) var(--p-ease);
}
#page-clubs .cm-mem:hover{background:var(--p-surface-acc) !important;}
#page-clubs .cm-mem img,
#page-clubs .cm-mem-ph{
  width:36px !important;
  height:36px !important;
  border-radius:50% !important;
}
#page-clubs .cm-mem-name{color:var(--p-ink) !important;font-size:13px !important;}
#page-clubs .cm-mem-role{
  color:var(--p-ink-dim) !important;
  font-size:10px !important;
  letter-spacing:1px;
}

/* ── Чат ── */
#page-clubs .club-chat{
  border:1px solid var(--p-line) !important;
  border-radius:var(--p-r-md) !important;
  background:rgba(0,0,0,.2) !important;
}
#page-clubs .cmsg-ava,
#page-clubs .cmsg-ava-ph{
  width:32px !important;height:32px !important;
}
#page-clubs .cmsg-head b{color:var(--p-accent) !important;}
#page-clubs .cmsg-text{
  font-size:13.5px !important;
  color:var(--p-ink) !important;
  line-height:1.5 !important;
  max-width:60ch !important;            /* line-length cap */
}
#page-clubs .club-chat-form{
  margin-top:12px !important;
  gap:8px !important;
}
#page-clubs .club-chat-form input{
  padding:12px 16px !important;
  font-size:14px !important;
  border-radius:var(--p-r) !important;
  background:var(--p-surface) !important;
  border:1px solid var(--p-line) !important;
  transition:border-color var(--p-base) var(--p-ease) !important;
}
#page-clubs .club-chat-form input:focus{
  border-color:var(--p-accent) !important;
  outline:none;
}
#page-clubs .club-chat-form .btn-g{
  padding:0 18px !important;
  border-radius:var(--p-r) !important;
  font-size:16px !important;
}

/* Empty state */
#page-clubs .cl-empty{
  padding:60px 24px !important;
  background:var(--p-surface) !important;
  border:1px solid var(--p-line) !important;
  border-radius:var(--p-r-lg) !important;
}
#page-clubs .cl-empty-ico{font-size:48px !important;opacity:.6;}
#page-clubs .cl-empty-title{
  font-size:20px !important;
  letter-spacing:2px !important;
  color:var(--p-accent) !important;
}
#page-clubs .cl-empty-sub{
  font-size:13.5px !important;
  color:var(--p-ink-mute) !important;
  max-width:36ch;
  margin:0 auto 22px;
  line-height:1.6;
}
