/*
Theme Name: Sunny Thailand
Theme URI: https://sunnythailand.com
Author: Sunny Thailand
Description: Official WordPress theme for the Sunny Thailand solar-engineering knowledge platform. Custom post types for Knowledge, News and Reviews with a Swiss-minimal Thai design system.
Version: 3.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: sunny-thailand
*/

/* Base styling lives in /assets/css/*. This file only holds the theme header
   plus a couple of WordPress-core overrides. */

/* WordPress alignment / caption helpers so the block editor content behaves. */
.article-body img.alignleft  { float: left;  margin: 0 var(--spacing-6) var(--spacing-4) 0; }
.article-body img.alignright { float: right; margin: 0 0 var(--spacing-4) var(--spacing-6); }
.article-body img.aligncenter{ display: block; margin: var(--spacing-6) auto; }
.article-body .wp-caption-text { font-size: var(--text-sm); color: var(--color-gray-500); text-align: center; }

/* Pagination (archives) */
.pagination, .nav-links { display: flex; gap: var(--spacing-2); justify-content: center; flex-wrap: wrap; }
.pagination .page-numbers,
.nav-links .page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 40px; height: 40px; padding: 0 var(--spacing-3);
  border: 1px solid var(--color-gray-200); border-radius: var(--radius-sm);
  color: var(--color-navy); text-decoration: none; font-family: 'Inter', sans-serif;
}
.pagination .page-numbers.current,
.nav-links .page-numbers.current { background: var(--color-navy); color: var(--color-white); border-color: var(--color-navy); }
.pagination .page-numbers:hover,
.nav-links .page-numbers:hover { border-color: var(--color-blue); }

/* Comment form (native WP) inherits the .comment-input-box look */
.comment-input-box textarea { width: 100%; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"] {
  width: 100%; max-width: 360px; padding: var(--spacing-2) var(--spacing-3);
  border: 1px solid var(--color-gray-300); border-radius: var(--radius-sm);
  font-family: 'IBM Plex Sans Thai', sans-serif; margin-bottom: var(--spacing-3);
}
.comment-reply-link { font-size: var(--text-sm); color: var(--color-blue); text-decoration: none; }

/* -------------------------------------------------------------------------
 * Block editor content (homepage + any page built with Gutenberg blocks)
 * Makes core blocks (paragraph, heading, button, columns, group, image)
 * inherit the Sunny Thailand design system instead of WP's generic defaults.
 * ---------------------------------------------------------------------- */
.block-editor-content {
  font-family: 'IBM Plex Sans Thai', sans-serif;
  color: var(--color-gray-700);
}
.block-editor-content h1,
.block-editor-content h2,
.block-editor-content h3,
.block-editor-content h4 {
  color: var(--color-navy);
  font-weight: 700;
  margin-bottom: var(--spacing-4);
}
.block-editor-content h2 { font-size: var(--text-2xl); margin-top: var(--spacing-12); }
.block-editor-content h3 { font-size: var(--text-xl); }
.block-editor-content p { line-height: 1.7; margin-bottom: var(--spacing-4); }
.block-editor-content > * + * { margin-top: var(--spacing-6); }
.block-editor-content .wp-block-group { margin-top: var(--spacing-16); }
.block-editor-content .wp-block-columns { gap: var(--spacing-8); }
.block-editor-content .wp-block-button__link,
.block-editor-content .wp-element-button {
  background: var(--color-blue);
  color: var(--color-white);
  border-radius: var(--radius-sm);
  padding: var(--spacing-3) var(--spacing-6);
  font-weight: 700;
  text-decoration: none;
  display: inline-block;
}
.block-editor-content .is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--color-navy);
  border: 2px solid var(--color-navy);
}
.block-editor-content img { border-radius: var(--radius-md); max-width: 100%; height: auto; }
.block-editor-content .wp-block-cover {
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-top: 0;
}