/* =========================================================
   COMPACT LAYOUT OVERRIDES
   For CyberChain / eHaCON Conference Sites
   ========================================================= */

/* ---------- Header (reduce height) ---------- */
header {
    padding: 22px 20px !important;
}

header h1 {
    font-size: 2.2em !important;
    margin-bottom: 6px;
}

header p {
    margin-top: 6px;
    font-size: 0.95em;
}

/* ---------- Logo Bar (compact + single-row friendly) ---------- */
.logo-container {
    padding: 10px 24px !important;
}

.logo {
    height: 48px !important;
    max-width: 140px;
}

.center-logo {
    height: 56px !important;
}

/* ---------- Navigation (slimmer) ---------- */
nav {
    padding: 8px 10px !important;
}

nav a {
    margin: 0 10px !important;
    font-size: 0.95em;
}

/* ---------- Main Layout: GRID (column-wise cards) ---------- */
main {
    max-width: 1100px;
    margin: 24px auto !important;
    padding: 0 16px;
}
/* ---------- Cards (compact, no vertical stacking) ---------- */
.card {
    padding: 20px !important;
    margin-bottom: 0 !important;
}

.card h2 {
    font-size: 1.5em;
    margin-bottom: 8px;
}


.card h3 {
    font-size: 1.2em;
    margin-bottom: 6px;
}

.card p {
    font-size: 0.95em;
    margin-bottom: 6px;
}
.person-card {
    background: linear-gradient(180deg, #020617, #0f172a);
    border-radius: 14px;
    padding: 16px;
    text-align: center;
    border: 1px solid rgba(0,229,255,0.2);
    box-shadow: 0 0 14px rgba(0,229,255,0.15);
}
/* CFP Poster Styling */
.cfp-card {
  max-width: 850px;     /* narrow like About / Submission Instructions */
  margin: 30px auto;
  text-align: center;
}

.cfp-poster {
  width: 100%;
  max-width: 500px;     /* prevents over-stretching */
  border-radius: 12px;
  margin: 12px auto;
  display: block;
  box-shadow: 0 0 18px rgba(0,229,255,0.25);
}


/* ---------- Mixed Layout Sections ---------- */

/* Full-width rows */
.full-width {
    width: 100%;
    margin-bottom: 24px;
}


/* Grid container for cards */
.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 20px;
}

/* Optional center alignment */
.center {
    text-align: center;
}

.submission-instructions {
  max-width: 900px;     /* adjust as needed: 800–1000px */
  margin: 0 auto 30px;  /* center horizontally */
}


/* ===== Committee Layout ===== */

/* ===== Committees Page Layout ===== */

.committee-section {
    width: 90%;
    margin: auto;
    padding: 40px 0;
}

.committee-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-bottom: 30px;
}

/* Committee cards */
.committee-card h3 {
    text-align: center;
    margin-bottom: 10px;
}

/* Photos */
.committee-photo {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 50%;
    margin: 0 auto 10px;
    display: block;
    border: 3px solid #90caf9;
}

/* Tables inside committees */
.committee-card table {
    width: 100%;
    border-collapse: collapse;
}

.committee-card td {
    padding: 6px 4px;
    font-size: 14px;
    border-bottom: 1px solid #e0e0e0;
    text-align: center;
}
.committee-row,
.committee-grid {
  display: grid;
  gap: 20px;
}

.three-col {
  grid-template-columns: repeat(3, 1fr);
}

.two-col {
  grid-template-columns: repeat(2, 1fr);
}

.center {
  justify-content: center;
}

.profile-pic {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 10px;
}

.committee-table {
  width: 100%;
  border-collapse: collapse;
}

.committee-table th {
  background: #002B5B;
  color: white;
  padding: 10px;
}

.committee-table td {
  vertical-align: top;
  padding: 12px;
  border: 1px solid #ddd;
}

/* Mobile responsive */
@media (max-width: 900px) {
    .committee-row {
        grid-template-columns: 1fr;
    }
}
.submission-section {
  padding: 20px;
}

.grid {
  display: grid;
  gap: 20px;
  margin-bottom: 30px;
}

.grid-2 {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.grid-3 {
  grid-template-columns: repeat(3, 1fr);
  justify-items: center;   /* KEY for visual centering */
}

.section-narrow {
  max-width: 1100px;   /* ideal for 2-column layouts */
  margin: 0 auto 40px;
}

.full-width {
  grid-column: 1 / -1;
}

.dates-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
}
.important-dates-table {
  width: 60%;
  border-collapse: collapse;
  margin-bottom: 24px;
}

.important-dates-table th,
.important-dates-table td {
  padding: 10px 12px;
  border: 1px solid #ccc;
  text-align: left;
}

.important-dates-table th {
  font-weight: 600;
}



/* ---------- Buttons (slightly smaller) ---------- */
.button, button {
    padding: 10px 22px !important;
    font-size: 0.95em;
}

/* ---------- Tables (compact) ---------- */
table {
    margin: 10px auto !important;
}

th, td {
    padding: 8px 14px !important;
    font-size: 0.95em;
}

/* ---------- Footer (less vertical space) ---------- */
footer {
    padding: 14px !important;
    margin-top: 30px;
}

/* ---------- Mobile optimization ---------- */
@media (max-width: 768px) {
    header h1 {
        font-size: 1.8em !important;
    }

    nav a {
        margin: 0 6px !important;
        font-size: 0.9em;
    }

    }

