/*
Theme Name: JMC Theme
Description: A custom WordPress theme for Jacksonville Music Collective using Bulma CSS framework
Version: 1.0.0
Author: Jacksonville Music Collective
Text Domain: jmc-theme
*/

/* Import Bulma CSS Framework */
@import url("https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css");

/* Import Google Fonts */
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&family=Barrio&display=swap");

/* Global Styles */
body {
  font-family: "Roboto", sans-serif;
  line-height: 1.6;
  background-color: #0a0a0a;
  color: #f5f5f5;
}

/* Dark Theme Header */
.site-header {
  background: #0a0a0a;
  padding: 1rem 0;
}

.site-title {
  font-family: "Barrio", cursive;
  font-size: 2rem;
  font-weight: 400;
  margin-bottom: 0.25rem;
  color: #f5f5f5;
}

.site-title a {
  color: #f5f5f5;
}

.site-description {
  font-size: 1rem;
  color: #f5f5f5;
}

/* Dark Theme Navigation */
.navbar {
  background-color: #0a0a0a !important;
  box-shadow: none;
}

.navbar-item {
  font-family: "Barrio", cursive !important;
  color: #f5f5f5 !important;
  font-weight: 400;
  transition: color 0.2s ease;
  line-height: 1.2;
  vertical-align: bottom;
  display: inline-flex;
  align-items: flex-end;
  margin: 0 2rem !important;
}

.navbar-item a {
  font-family: "Barrio", cursive !important;
  line-height: 1.2;
  vertical-align: bottom;
  display: inline-flex;
  align-items: flex-end;
  padding: 0 0.5rem;
}

/* Specific navbar menu items inherit from .navbar-item above */

/* Override body font inheritance for navbar */
.navbar,
.navbar *,
.navbar-brand,
.navbar-brand *,
.navbar-menu,
.navbar-menu *,
.navbar-start,
.navbar-start *,
.navbar-end,
.navbar-end * {
  font-family: "Barrio", cursive !important;
  margin-right: 1rem;
  margin-top: 3px;
  vertical-align: bottom;
  color: lightgray;
}

.navbar-item:hover {
  background-color: transparent !important;
  color: #3273dc !important;
}

/* Adjust spacing for navbar items */
.navbar-menu .navbar-item:not(:last-child) {
  margin-right: 2rem !important;
}

.navbar-item:first-child {
  margin-left: 0 !important;
}

.navbar-item:last-child {
  margin-right: 0 !important;
}

/* Additional spacing for all navbar items */
.navbar-start .navbar-item,
.navbar-end .navbar-item {
  margin: 0 1.5rem !important;
}

.navbar-burger {
  color: #f5f5f5 !important;
}

/* Full Width Main Content */
.main-content {
  min-height: 60vh;
  padding: 2rem 0;
}

/* Dark Theme Footer */
.site-footer {
  background-color: #0a0a0a;
  color: #f5f5f5;
  padding: 2rem 0;
  margin-top: 3rem;
}

/* Dark Theme Cards */
.card {
  background-color: #0a0a0a;
  box-shadow: none;
  border: none;
  border-radius: 0;
  transition: none;
}

.card:hover {
  transform: none;
}

.card-header {
  background-color: #0a0a0a;
  border: none;
}

.card-content {
  color: #f5f5f5;
}

.card-footer {
  background-color: #0a0a0a;
  border: none;
}

/* Dark Theme Event Manager Block Styling */
.event-manager-block {
  margin: 2rem 0;
}

.events-table {
  background: #0a0a0a;
  border: none;
  border-radius: 0;
  overflow: hidden;
}

.event-row {
  border: none;
  padding: 1rem;
  transition: none;
  color: #f5f5f5;
}

.event-row:hover {
  background-color: #0a0a0a;
}

.event-row:last-child {
  border: none;
}

/* Dark Theme Additional Styles */
.title,
.subtitle {
  font-family: "Barrio", cursive;
  color: #f5f5f5 !important;
}

/* Apply Barrio to all heading tags */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Barrio", cursive;
}

.content {
  color: #f5f5f5;
}

.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 {
  font-family: "Barrio", cursive;
  color: #f5f5f5;
}

.content a {
  color: #3273dc;
}

.content a:hover {
  color: #4a9eff;
}

.notification {
  background-color: #0a0a0a;
  color: #f5f5f5;
  border: none;
}

.notification.is-warning {
  background-color: #0a0a0a;
  color: #f5f5f5;
  border: none;
}

/* Dark Theme Form Elements */
.input,
.textarea,
.select select {
  background-color: #0a0a0a;
  border: none;
  color: #f5f5f5;
}

.input:focus,
.textarea:focus,
.select select:focus {
  border: none;
  box-shadow: none;
}

/* Responsive Design */
@media screen and (max-width: 768px) {
  .site-title {
    font-size: 1.5rem;
  }

  .site-description {
    font-size: 0.9rem;
  }

  .main-content {
    padding: 1rem 0;
  }
}