/*
Theme Name: Political Org Theme
Author: Generated by ChatGPT
Version: 1.0
Text Domain: political-theme
Description: Lightweight, accessible theme for a political organization. Dynamic Activities and Gallery with CPTs.
*/
:root{
  --primary: #211a93;
  --primary-dark: #11106a;
  --accent: #3b4ecf;
  --bg: #ffffff;
  --text: #222222;
}

/* Basic reset and typography */
html,body{ height:100%; }
body{
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  margin:0;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

a{ color: var(--primary); text-decoration: none; }
a:hover{ color: var(--accent); }

/* Header */
.site-header{
  background: var(--bg);
  border-bottom: 4px solid var(--primary);
  padding: 18px 24px;
  display:block;
}
.site-header .container{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.site-logo img{ max-height:72px; display:block; }

/* Navigation */
.site-nav ul{ list-style:none; margin:0; padding:0; display:flex; gap:16px; align-items:center; }
.site-nav li{ margin:0; }
.site-nav a{ padding:8px 10px; display:inline-block; border-radius:6px; }
.site-nav a:hover{ background: rgba(33,26,147,0.06); }

/* Simple container */
.container{ max-width:1200px; margin: 0 auto; padding: 24px; }

/* Page headings */
.entry-header h1{ color: var(--primary-dark); margin:0 0 12px 0; }

/* Activities grid */
.activities-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit,minmax(260px,1fr));
  gap:18px;
}

/* Activity card */
.activity-card{ border:1px solid #eee; border-radius:8px; overflow:hidden; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,0.03); }
.activity-card .thumb{ width:100%; height:200px; object-fit:cover; display:block; }
.activity-card .meta{ padding:12px; }
.activity-card .meta .date{ color:var(--primary-dark); font-weight:600; margin-bottom:8px; font-size:0.95rem; }

/* Masonry Gallery (CSS columns) */
.masonry{
  column-count: 3;
  column-gap: 12px;
}
@media (max-width:900px){ .masonry{ column-count:2; } }
@media (max-width:600px){ .masonry{ column-count:1; } }
.masonry-item{ break-inside: avoid; margin-bottom:12px; }
.masonry-item img{ width:100%; display:block; border-radius:6px; }

/* Footer */
.site-footer{ padding:20px; border-top:4px solid var(--primary); text-align:center; color:#555; margin-top:40px; }

/* Utility */
.text-center{ text-align:center; }
.small{ font-size:0.9rem; color:#666; }