/*
Theme Name: NUES Unijos
Theme URI: https://nuesunijos.org
Author: NUES Unijos Development Team
Author URI: https://nuesunijos.org
Description: A professional block theme for the National Union of Eggon Students (NUES) University of Jos chapter. Features Eggon cultural colors, modern typography with Playfair Display and Inter, and seamless integration with the NUES Unijos Core plugin.
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nues-unijos-theme
Tags: block-theme, custom-colors, education, featured-images, full-site-editing, organization, threaded-comments, translation-ready, wide-blocks
*/

/**
 * NUES Unijos Theme Styles
 * 
 * Typography: 
 * - Headings: Playfair Display (Elegant serif for authority)
 * - Body: Inter (Modern, highly readable sans-serif)
 * - Accent: Source Serif Pro (Cultural sophistication)
 * 
 * Color Palette:
 * - Heritage Green (#2D6A4F) - Primary brand color
 * - Unity Red (#BA181B) - Accent and urgent actions
 * - Ancestral Brown (#8D6E63) - Historical elements
 * - Parchment (#F5F5DC) - Warm background
 */

/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700;800;900&family=Inter:wght@300;400;500;600;700;800&family=Source+Serif+Pro:ital,wght@0,400;0,600;0,700;1,400&display=swap');

/* CSS Variables for Easy Customization */
:root {
  /* Colors */
  --nues-primary: #2D6A4F;
  --nues-primary-dark: #1B4332;
  --nues-secondary: #BA181B;
  --nues-tertiary: #8D6E63;
  --nues-background: #F5F5DC;
  --nues-surface: #FFFFFF;
  --nues-text: #4A4A4A;
  --nues-text-light: #757575;
  --nues-border: #E0E0E0;
  --nues-accent: #2E7D32;

  /* Typography */
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-accent: 'Source Serif Pro', Georgia, serif;

  /* Spacing */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-2xl: 3rem;
  --spacing-3xl: 4rem;

  /* Shadows */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);

  /* Border Radius */
  --radius-sm: 0.25rem;
  --radius-md: 0.375rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 300ms ease;
  --transition-slow: 500ms ease;
}

/* Base Styles */
body {
  font-family: var(--font-body);
  color: var(--nues-text);
  background-color: var(--nues-background);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: var(--spacing-md);
}

h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
h2 { font-size: clamp(1.75rem, 4vw, 2.5rem); }
h3 { font-size: clamp(1.5rem, 3vw, 2rem); }
h4 { font-size: clamp(1.25rem, 2.5vw, 1.5rem); }
h5 { font-size: 1.125rem; }
h6 { 
  font-size: 1rem; 
  font-family: var(--font-body);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Links */
a {
  color: var(--nues-primary);
  text-decoration: none;
  transition: color var(--transition-fast);
}

a:hover,
a:focus {
  color: var(--nues-primary-dark);
  text-decoration: underline;
}

/* Buttons */
.wp-block-button__link,
.wp-element-button {
  background-color: var(--nues-primary);
  color: var(--nues-surface);
  padding: 0.75rem 1.5rem;
  border-radius: var(--radius-md);
  font-weight: 600;
  letter-spacing: 0.025em;
  transition: all var(--transition-base);
  border: none;
  cursor: pointer;
  display: inline-block;
}

.wp-block-button__link:hover,
.wp-element-button:hover {
  background-color: var(--nues-primary-dark);
  color: var(--nues-surface);
  text-decoration: none;
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

/* Secondary Button */
.wp-block-button.is-style-outline .wp-block-button__link {
  background-color: transparent;
  color: var(--nues-primary);
  border: 2px solid var(--nues-primary);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background-color: var(--nues-primary);
  color: var(--nues-surface);
}

/* Alert/CTA Button */
.wp-block-button.is-style-alert .wp-block-button__link {
  background-color: var(--nues-secondary);
}

.wp-block-button.is-style-alert .wp-block-button__link:hover {
  background-color: #9A1418;
}

/* Containers */
.wp-block-group {
  margin-bottom: var(--spacing-xl);
}

/* Cards */
.nues-card {
  background: var(--nues-surface);
  border-radius: var(--radius-lg);
  padding: var(--spacing-xl);
  box-shadow: var(--shadow-md);
  transition: all var(--transition-base);
}

.nues-card:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-4px);
}

/* Section Dividers */
.nues-divider {
  height: 1px;
  background: linear-gradient(to right, transparent, var(--nues-border), transparent);
  margin: var(--spacing-2xl) 0;
}

/* Cultural Pattern Background */
.nues-pattern-bg {
  background-image: 
    repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(45, 106, 79, 0.03) 10px, rgba(45, 106, 79, 0.03) 20px);
}

/* News Ticker Custom Styles */
.nues-news-ticker-wrapper {
  background: linear-gradient(135deg, var(--nues-secondary) 0%, #9A1418 100%);
  color: var(--nues-surface);
  font-family: var(--font-body);
  font-weight: 500;
}

.nues-ticker-label {
  background: rgba(0, 0, 0, 0.2);
  padding: 0.5rem 1rem;
}

/* Executive Cards Enhancement */
.nues-executive-card {
  background: var(--nues-surface);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  transition: all var(--transition-base);
}

.nues-executive-card:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-8px);
}

.executive-name {
  font-family: var(--font-heading);
  color: var(--nues-primary-dark);
}

.executive-role {
  font-family: var(--font-accent);
  color: var(--nues-primary);
  font-weight: 600;
}

/* Event Cards */
.nues-event-item {
  background: var(--nues-surface);
  border-left: 4px solid var(--nues-primary);
  box-shadow: var(--shadow-sm);
  transition: all var(--transition-fast);
}

.nues-event-item:hover {
  box-shadow: var(--shadow-md);
  border-left-color: var(--nues-secondary);
}

.event-date-box {
  background: linear-gradient(135deg, var(--nues-primary) 0%, var(--nues-primary-dark) 100%);
  font-family: var(--font-heading);
}

.event-title {
  font-family: var(--font-heading);
  color: var(--nues-primary-dark);
}

/* Gallery Cards */
.nues-gallery-album {
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  transition: all var(--transition-base);
}

.nues-gallery-album:hover {
  transform: scale(1.03);
  box-shadow: var(--shadow-lg);
}

.album-title {
  font-family: var(--font-heading);
  color: var(--nues-surface);
}

/* Archive Items */
.nues-archive-item {
  background: var(--nues-surface);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  transition: all var(--transition-base);
  overflow: hidden;
}

.nues-archive-item:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-4px);
}

.archive-category {
  background: var(--nues-tertiary);
  color: var(--nues-surface);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.archive-title {
  font-family: var(--font-heading);
}

/* Quote Blocks */
.wp-block-quote {
  border-left: 4px solid var(--nues-primary);
  padding-left: var(--spacing-lg);
  font-family: var(--font-accent);
  font-size: 1.25rem;
  font-style: italic;
  color: var(--nues-primary-dark);
}

.wp-block-quote cite {
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--nues-text-light);
  font-style: normal;
}

/* Pullquote */
.wp-block-pullquote {
  border-top: 4px solid var(--nues-tertiary);
  border-bottom: 4px solid var(--nues-tertiary);
  padding: var(--spacing-xl) 0;
  font-family: var(--font-accent);
}

/* Lists */
ul, ol {
  padding-left: var(--spacing-lg);
}

li {
  margin-bottom: var(--spacing-sm);
}

/* Images */
img {
  max-width: 100%;
  height: auto;
  display: block;
}

.wp-block-image {
  margin-bottom: var(--spacing-xl);
}

.wp-block-image img {
  border-radius: var(--radius-lg);
}

/* Tables */
table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: var(--spacing-xl);
}

th {
  background-color: var(--nues-primary);
  color: var(--nues-surface);
  padding: var(--spacing-md);
  text-align: left;
  font-weight: 600;
}

td {
  padding: var(--spacing-md);
  border-bottom: 1px solid var(--nues-border);
}

/* Site Header */
.wp-block-template-part[data-area="header"] {
  background-color: var(--nues-surface);
  box-shadow: var(--shadow-sm);
  position: sticky;
  top: 0;
  z-index: 100;
}

/* Navigation */
.wp-block-navigation {
  font-weight: 500;
}

.wp-block-navigation-item a {
  padding: var(--spacing-sm) var(--spacing-md);
  transition: all var(--transition-fast);
}

.wp-block-navigation-item a:hover {
  color: var(--nues-primary-dark);
  background-color: rgba(45, 106, 79, 0.05);
  border-radius: var(--radius-sm);
}

/* Footer */
.wp-block-template-part[data-area="footer"] {
  background: linear-gradient(135deg, var(--nues-primary-dark) 0%, #0F2920 100%);
  color: var(--nues-surface);
  margin-top: var(--spacing-3xl);
}

.wp-block-template-part[data-area="footer"] a {
  color: var(--nues-surface);
}

.wp-block-template-part[data-area="footer"] a:hover {
  color: var(--nues-background);
}

/* Responsive */
@media (max-width: 768px) {
  :root {
    --spacing-xl: 1.5rem;
    --spacing-2xl: 2rem;
    --spacing-3xl: 3rem;
  }

  .nues-executive-card,
  .nues-archive-item {
    margin-bottom: var(--spacing-lg);
  }
}

/* Accessibility */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background-color: var(--nues-background);
  clip: auto !important;
  color: var(--nues-text);
  display: block;
  font-size: 1rem;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

/* Print Styles */
@media print {
  * {
    background: white !important;
    color: black !important;
    box-shadow: none !important;
  }
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: var(--nues-background);
}

::-webkit-scrollbar-thumb {
  background: var(--nues-primary);
  border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--nues-primary-dark);
}

/* Selection */
::selection {
  background-color: var(--nues-primary);
  color: var(--nues-surface);
}

::-moz-selection {
  background-color: var(--nues-primary);
  color: var(--nues-surface);
}