/*
Theme Name: Monitor Custom
Theme URI: 
Description: Child theme for Twenty Twenty-Five
Author: Michael Bishop
Author URI: https://michaelbishop.me
Template: twentytwentyfive
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: monitor-custom
*/

/* Custom styles can be added below */

/* Ensure strong and bold tags display properly */
strong,
b {
  font-weight: 700 !important;
}

@view-transition {
  navigation: auto;
}

/* WordPress Details Block Styling - Tampa Monitor Theme */
.wp-block-details {
  border: 1px solid var(--wp--preset--color--accent-4); /* #8A8A82 */
  border-radius: 8px;
  margin: var(--wp--preset--spacing--40) 0;
  background: var(--wp--preset--color--base); /* #F1F1E6 */
  overflow: hidden;
}

/* Ensure proper display order for agenda items */
.wp-block-list-item {
  display: flex !important;
  flex-direction: column !important;
}

.wp-block-list-item .wp-block-details {
  order: 1 !important;
}

.wp-block-list-item .agenda-supporting-docs {
  order: 2 !important;
}

.wp-block-details summary {
  background: var(--wp--preset--color--accent-5); /* #F8F8F2 */
  padding-block: var(--wp--preset--spacing--30);
  padding-inline: var(--wp--preset--spacing--40);
  cursor: pointer;
  font-family: var(--wp--preset--font-family--libre-franklin);
  font-weight: 600;
  color: var(--wp--preset--color--contrast); /* #314A59 */
  border-bottom: 1px solid var(--wp--preset--color--accent-4);
  position: relative;
  transition: background-color 0.2s ease;
  -webkit-user-select: none;
  user-select: none;
  list-style: none;
}

.wp-block-details summary:hover {
  background: var(--wp--preset--color--accent-1); /* #E6B45E */
}

.wp-block-details summary:focus {
  outline: 2px solid var(--wp--preset--color--accent-3); /* #1D636B */
  outline-offset: 2px;
}

/* Hide default marker and add custom arrow */
.wp-block-details summary::marker,
.wp-block-details summary::-webkit-details-marker {
  display: none;
}

.wp-block-details summary::after {
  content: "▼";
  position: absolute;
  right: var(--wp--preset--spacing--40);
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.8em;
  color: var(--wp--preset--color--accent-3); /* #1D636B */
  transition: opacity 0.2s ease;
}

.wp-block-details[open] summary::after {
  content: "▲";
}

details::details-content {
  opacity: 0;
  transition: opacity 600ms, content-visibility 600ms allow-discrete;
}

details[open]::details-content {
  opacity: 1;
}

/* Content styling - target any paragraph inside the details block */
.wp-block-details p {
  padding-block: var(--wp--preset--spacing--40);
  padding-inline: var(--wp--preset--spacing--40);
  margin: 0;
  background: var(--wp--preset--color--base); /* #F1F1E6 */
  font-family: var(--wp--preset--font-family--pt-serif);
  line-height: 1.6;
  color: var(--wp--preset--color--contrast); /* #314A59 */
}

/* Ordered list styling inside details block */
.wp-block-details ol {
  padding: var(--wp--preset--spacing--40);
  margin: 0;
  background: var(--wp--preset--color--base); /* #F1F1E6 */
}

/* Supporting Documents Container - Now using proper WordPress blocks */
.wp-block-group.agenda-supporting-docs {
  margin: var(--wp--preset--spacing--40) 0;
}

.wp-block-group.agenda-supporting-docs .wp-block-heading {
  font-family: var(--wp--preset--font-family--libre-franklin);
  font-weight: 600;
  color: var(--wp--preset--color--contrast); /* #314A59 */
  margin: 0 0 var(--wp--preset--spacing--20) 0;
  border-top: 1px solid var(--wp--preset--color--accent-4); /* #8A8A82 */
  padding-top: var(--wp--preset--spacing--30);
}

.wp-block-group.agenda-supporting-docs .wp-block-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* CSS Grid layout for supporting docs with 6+ items */
.wp-block-group.agenda-supporting-docs .wp-block-list:has(li:nth-child(7)) {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
  margin-top: var(--wp--preset--spacing--20);
}

/* Reset margins for grid items */
.wp-block-group.agenda-supporting-docs .wp-block-list:has(li:nth-child(7)) li {
  margin-bottom: 0;
}

.wp-block-group.agenda-supporting-docs .wp-block-list li {
  margin-bottom: var(
    --wp--preset--spacing--10
  ); /* Reduced from spacing--20 for more compact layout */
  padding-left: var(--wp--preset--spacing--40);
  position: relative;
  line-height: 1.4; /* Tighter line height for more compact look */
  font-size: var(
    --wp--preset--font-size--small,
    0.875rem
  ); /* Apply small font to entire list item */
}

.wp-block-group.agenda-supporting-docs .wp-block-list li::before {
  content: "📄";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1.1em;
}

.wp-block-group.agenda-supporting-docs .wp-block-list a {
  color: var(--wp--preset--color--accent-3); /* #1D636B */
  text-decoration: underline;
  text-decoration-color: var(--wp--preset--color--accent-1); /* #E6B45E */
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  font-family: var(--wp--preset--font-family--libre-franklin);
  font-weight: 500;
  font-size: var(--wp--preset--font-size--small, 0.875rem);
  transition: all 0.3s ease;
}

.wp-block-group.agenda-supporting-docs .wp-block-list a:hover {
  color: var(--wp--preset--color--contrast); /* #314A59 */
  text-decoration-color: var(--wp--preset--color--accent-3); /* #1D636B */
  text-decoration-thickness: 3px;
}

.wp-block-group.agenda-supporting-docs .wp-block-list a:focus {
  outline: 2px solid var(--wp--preset--color--accent-1); /* #E6B45E */
  outline-offset: 2px;
  border-radius: 3px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .wp-block-details summary {
    padding-block: var(--wp--preset--spacing--20);
    padding-inline: var(--wp--preset--spacing--30);
  }
  .wp-block-details p,
  .wp-block-details ol {
    padding: var(--wp--preset--spacing--30);
  }

  .wp-block-group.agenda-supporting-docs {
    margin-top: var(--wp--preset--spacing--30);
  }

  .wp-block-group.agenda-supporting-docs .wp-block-list li {
    font-size: var(--wp--preset--font-size--small);
  }

  /* Single column on mobile for grid layouts */
  .wp-block-group.agenda-supporting-docs .wp-block-list:has(li:nth-child(7)) {
    grid-template-columns: 1fr;
    gap: var(--wp--preset--spacing--10);
  }
}

/* Tablet responsive adjustments */
@media (min-width: 769px) and (max-width: 1024px) {
  .agenda-supporting-docs .wp-block-list:has(li:nth-child(7)) {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  }
}

/* Fallback for browsers without :has() support */
@supports not selector(:has(*)) {
  .agenda-supporting-docs .wp-block-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
  }

  .agenda-supporting-docs .wp-block-list li {
    margin-bottom: 0;
  }

  @media (max-width: 768px) {
    .agenda-supporting-docs .wp-block-list {
      grid-template-columns: 1fr;
      gap: var(--wp--preset--spacing--10);
    }
  }
}

/* File Number Paragraph Spacing */

.wp-block-list li p.file-number {
  margin-bottom: 0.2rem; /* Reduced spacing after file number */
  font-weight: 700;
}

.wp-block-list li p.file-number + p {
  margin-top: 0; /* Remove top margin from description paragraph */
}

/* Author Block with Donation Styling */
.wp-block-post-author-name a {
  color: var(--wp--preset--color--contrast);
  text-decoration: none;
  font-weight: 500;
}

.wp-block-post-author-name a:hover {
  color: var(--wp--preset--color--accent-3);
  text-decoration: underline;
}

.wp-block-post-author-biography {
  color: var(--wp--preset--color--contrast);
  line-height: 1.6;
}

/* Author image customization */
.wp-block-image.has-custom-border img {
  object-fit: cover;
  display: block;
}

/* Responsive adjustments for author block */
@media (max-width: 768px) {
  .wp-block-columns .wp-block-column[style*="flex-basis:25%"],
  .wp-block-columns .wp-block-column[style*="flex-basis:75%"] {
    flex-basis: 100% !important;
  }

  .wp-block-image.has-custom-border img {
    margin: 0 auto var(--wp--preset--spacing--30);
  }
}

/* Compact author bio pattern overrides */
.monitor-author-bio {
  max-width: 720px;
  margin-inline: auto;
  gap: var(--wp--preset--spacing--20);
}

.monitor-author-bio__layout {
  align-items: center;
  column-gap: var(--wp--preset--spacing--20);
}

.monitor-author-bio__content {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--20);
}

.monitor-author-bio__meta {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--10);
}

.monitor-author-bio__meta .wp-block-heading {
  margin: 0;
  font-size: clamp(1.25rem, 2.5vw, var(--wp--preset--font-size--large));
}

.monitor-author-bio__meta .wp-block-post-author-name,
.monitor-author-bio__meta .wp-block-post-author-biography {
  margin: 0;
}

.monitor-author-bio__meta .wp-block-post-author-biography {
  font-size: 0.95rem;
  line-height: 1.5;
}

.monitor-author-bio__actions {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--20);
}

.monitor-author-bio__actions .wp-block-social-links {
  justify-content: flex-start;
}

@media (max-width: 768px) {
  .monitor-author-bio {
    padding-inline: var(--wp--preset--spacing--20) !important;
  }

  .monitor-author-bio__layout .wp-block-column {
    flex-basis: 100% !important;
  }

  .monitor-author-bio__layout .wp-block-column:first-child {
    display: flex;
    justify-content: center;
    margin-bottom: var(--wp--preset--spacing--20);
  }

  .monitor-author-bio__content {
    gap: var(--wp--preset--spacing--10);
  }

  .monitor-author-bio__actions {
    gap: var(--wp--preset--spacing--10);
  }
}

/* Category Badge System - Modern, Responsive Design */

/* Badge containers */
.category-badges-parent {
  margin-bottom: var(--wp--preset--spacing--20);
  gap: var(--wp--preset--spacing--10);
}

/* Base badge styling - simplified to single class */
.category-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  text-decoration: none;
  border-radius: 4px;
  font-family: var(--wp--preset--font-family--libre-franklin);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-right: 0.5rem;
  margin-bottom: 0.25rem;
  transition: opacity 0.2s ease;
  font-size: 0.7rem !important;
  line-height: 1;
  background-color: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
  vertical-align: middle;
  box-sizing: border-box;
}

.category-badge:hover {
  opacity: 0.8;
}

/* Parent category badges - default style */
.category-badge-parent {
  background-color: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
}

/* Child category badges - default style */
.category-badge-child {
  background-color: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
}

/* Parent category badges - accent style for Last Week sections */
/* Using Accent 3 (teal #1D636B) with Base text for better accessibility on dark backgrounds */
.category-badge-accent {
  background-color: var(--wp--preset--color--accent-3);
  color: var(--wp--preset--color--base);
}

/* Spacing between post titles and badge tags */
/* Add consistent margin-top to badge container groups */
.wp-block-post-title + .wp-block-group,
.wp-block-post-title + [class*="badge-context"] {
  margin-top: 0.5em;
}

/* Badge containers before title - add bottom margin */
[class*="badge-context"]:has(+ .wp-block-post-title) {
  margin-bottom: 0.75rem;
}

/* Also handle flex containers that contain badges before title */
.wp-block-group:has(.category-badge) {
  margin-bottom: 0.75rem;
}

/* Context-based sizing using semantic classes */

/* Large context - Single posts, main featured areas */
.badge-context-large .category-badge {
  font-size: 0.85rem !important;
  padding: 0.75rem 1.25rem;
}

/* Standard context - Front page main sections */
.badge-context-standard .category-badge {
  font-size: 0.7rem !important;
  padding: 0.5rem 1rem;
}

/* Compact context - Grid layouts, sidebar areas */
.badge-context-compact .category-badge {
  font-size: 0.65rem !important;
  padding: 0.4rem 0.8rem;
}

/* Mini context - Dense grid layouts */
.badge-context-mini .category-badge {
  font-size: 0.65rem !important;
  padding: 0.35rem 0.7rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .badge-context-large .category-badge {
    font-size: 0.7rem !important;
    padding: 0.5rem 1rem;
  }

  .badge-context-standard .category-badge {
    font-size: 0.65rem !important;
    padding: 0.4rem 0.8rem;
  }

  .badge-context-compact .category-badge,
  .badge-context-mini .category-badge {
    font-size: 0.6rem !important;
    padding: 0.3rem 0.6rem;
  }
}