/* /css/pages/community.css */

/* =========================
   PAGE
========================= */
.aw-main--community{ padding-bottom:32px; }

/* Main white content card */
.aw-community-card{
  background:#fff;
  border-radius:18px;
  padding:18px;
  box-shadow: var(--aw-shadow-card, 0 10px 30px rgba(0,0,0,.06));
}

/* Intro + hero note (stronger contrast on white) */
.aw-community-intro,
.aw-community-hero-note{
  color:#2f3d46;
  margin:10px 0 16px;
  line-height:1.6;
}

/* Quick nav */
.aw-community-nav{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:6px 0 14px;
}

/* Section titles */
.aw-community-section-title{
  margin:18px 0 10px;
  font-weight:800;
  font-size:16px;
  letter-spacing:.2px;
}
.aw-community-section-title span{
  color: var(--aw-color-menu-active, #CDAF54);
  margin-right:8px;
}

/* Grid */
.aw-community-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:12px;
}
@media (max-width:980px){
  .aw-community-grid{ grid-template-columns:1fr; }
}

/* =========================
   DARK MINI CARDS (READABLE)
========================= */
.aw-community-mini{
  padding:14px;
  border-radius:16px;
  background:#0f2f3a;
  border:1px solid rgba(255,255,255,.08);
  color:#fff;
}
.aw-community-mini__icon{
  font-size:20px;
  margin-bottom:8px;
  color: var(--aw-color-menu-active, #CDAF54);
}
.aw-community-mini__title{
  margin:0 0 6px;
  font-size:16px;
  color:#fff;
}
.aw-community-mini__text{
  margin:0;
  line-height:1.55;
  color: rgba(255,255,255,.88);
}
.aw-community-mini *{ color:inherit; }

/* =========================
   RULES BLOCK (DARK)
========================= */
.aw-community-block{
  padding:14px;
  border-radius:16px;
  background:#0f2f3a;
  border:1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.92);
}
.aw-community-list{
  margin:0;
  padding-left:18px;
  line-height:1.65;
  color: rgba(255,255,255,.92);
}
.aw-community-tip{
  margin-top:10px;
  color: rgba(255,255,255,.92);
}
.aw-community-tip a{
  color:#fff;
  text-decoration:underline;
  text-underline-offset:3px;
}

/* =========================
   HERO ACTIONS
========================= */
.aw-community-hero-actions{
  margin-top:14px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

/* =========================
   CTA
========================= */
.aw-community-cta{
  padding:14px;
  border-radius:16px;
  background:#fff;
  border:1px solid #e7edf2;
}
.aw-community-cta__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}
.aw-community-cta__text h3{
  margin:0 0 4px;
  font-size:16px;
}
.aw-community-cta__text p{
  margin:0;
  color:#4b5b66;
}
.aw-community-cta__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* =========================================================
   ASIDE CARDS (AUTONOMOUS, NO FAQ DEPENDENCY)
========================================================= */
.community-sidebar{ display:flex; flex-direction:column; gap:14px; }

/* Base card */
.community-side-card{
  background:#fff;
  border-radius:18px;
  padding:16px;
  border:1px solid #e7edf2;
  box-shadow: 0 10px 30px rgba(0,0,0,.04);
}

.community-side-card--accent{
  border-left:4px solid var(--aw-color-menu-active, #CDAF54);
}

.community-side-label{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#5b6b75;
  margin-bottom:8px;
}

.community-side-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  font-size:16px;
  color:#0a2230;
  margin:0 0 8px;
}

.community-side-title i{
  color: var(--aw-color-menu-active, #CDAF54);
}

.community-side-text{
  margin:0 0 12px;
  color:#4b5b66;
  line-height:1.55;
}

.community-side-note{
  margin-top:12px;
  color:#4b5b66;
  line-height:1.5;
  padding:10px 12px;
  border-radius:14px;
  background:#f6f9fb;
  border:1px solid #e7edf2;
}

/* Aside button group */
.community-link-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

/* Make “block” buttons full width if you use aw-btn-block */
.community-side-card .aw-btn-block{ width:100%; }

/* =========================================================
   MODAL (AUTONOMOUS, NO FAQ DEPENDENCY)
   Works with your existing modal JS: data-aw-modal-open/close
========================================================= */
.aw-modal{
  position:fixed;
  inset:0;
  display:none; /* shown by JS */
  z-index:9999;
}
.aw-modal.is-open{ display:block; }

.aw-modal__overlay{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.45);
}

.aw-modal__dialog{
  position:relative;
  max-width:560px;
  margin:8vh auto;
  padding:0 14px;
}

.aw-modal__content{
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  border:1px solid #e7edf2;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
}

/* Community modal skin */
.community-modal__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid #e7edf2;
  background:#fbfdff;
}

.community-modal__title{
  margin:0;
  font-size:16px;
  font-weight:900;
  color:#0a2230;
}

.community-modal__close{
  width:38px;
  height:38px;
  border-radius:12px;
  border:1px solid #e7edf2;
  background:#fff;
  cursor:pointer;
}

.community-modal__body{
  padding:14px 16px;
}

.community-modal__body p{
  margin:0 0 12px;
  color:#4b5b66;
  line-height:1.55;
}

/* Simple form styles (Bootstrap-free) */
.community-form-group{ margin-bottom:12px; }
.community-form-group label{
  display:block;
  margin-bottom:6px;
  font-weight:700;
  color:#0a2230;
  font-size:13px;
}
.community-form-control{
  width:100%;
  border-radius:14px;
  border:1px solid #dfe8ee;
  padding:10px 12px;
  outline:none;
  background:#fff;
}
.community-form-control:focus{
  border-color: rgba(0,0,0,.25);
  box-shadow: 0 0 0 3px rgba(205,175,84,.18);
}

.community-modal__footer{
  padding:14px 16px;
  border-top:1px solid #e7edf2;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  background:#fbfdff;
}

/* Honeypot hidden */
.aw-hp{ display:none; }

/* Small links */
.aw-community-card a,
.community-side-card a{
  text-underline-offset:3px;
}