/*
Theme Name: gomi2d
Theme URI: http://gomi2d.com/
Author: gomi2d
Author URI: http://gomi2d.com/
Description: Portfolio, commissions and shop theme for the illustrator gomi2d. Classic (PHP template) theme, no plugin dependencies: portfolio pieces, commission types and shop items are custom post types, and every editable string lives either in the page editor or in the Customizer.
Version: 0.1.0
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gomi2d
Tags: portfolio, custom-menu, custom-logo, featured-images, translation-ready
*/

/* =========================================================================
   This file holds ONLY the WordPress-specific additions.

   The design itself lives in assets/css/styles.css, which is a byte-for-byte
   copy of the static MVP's stylesheet (C:\projects\gomi2d.com\assets\css\
   styles.css) and is refreshed by wp-theme/sync-assets.sh. Do not hand-edit
   that copy: change the MVP file and re-run the sync, so the prototype and
   the theme can never drift apart.

   Both files are enqueued (inc/enqueue.php); this one loads last.
   ========================================================================= */

/* --- Admin bar ---------------------------------------------------------- */
/* The site header is sticky, so it has to start below the admin bar or it
   sits on top of it for logged-in editors. */
body.admin-bar .site-header { top: 32px; }
@media screen and (max-width: 782px) {
  body.admin-bar .site-header { top: 46px; }
}

/* --- Core class aliases -------------------------------------------------- */
/* WordPress emits .screen-reader-text; the design calls it .visually-hidden. */
.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.screen-reader-text:focus {
  position: static !important;
  width: auto;
  height: auto;
  clip: auto;
  clip-path: none;
  margin: 0;
}

/* --- Editor output ------------------------------------------------------- */
/* Blocks the artist can drop into a page: keep them inside the design's
   rhythm instead of letting core defaults through. */
.entry-content > * + * { margin-top: var(--space-md); }

.alignwide { max-width: min(100%, 1100px); margin-inline: auto; }
.alignfull { width: 100%; }
.aligncenter { margin-inline: auto; text-align: center; }
.alignleft { float: left; margin: 0 var(--space-md) var(--space-sm) 0; }
.alignright { float: right; margin: 0 0 var(--space-sm) var(--space-md); }

.wp-caption { max-width: 100%; }
.wp-caption-text,
.wp-element-caption,
figcaption {
  font-size: var(--fs-sm);
  color: var(--color-cream-muted);
  margin-top: var(--space-2xs);
}

.wp-block-image img { border-radius: var(--radius-md); }
.wp-block-quote {
  border-left: 3px solid var(--color-pink);
  padding-left: var(--space-md);
  margin-inline: 0;
  color: var(--color-cream-muted);
}
.wp-block-separator { border-top: 1px solid var(--color-border); }
.wp-block-button__link {
  background-color: var(--color-pink);
  color: var(--color-black-solid);
  border-radius: var(--radius-pill);
  font-weight: 600;
}

/* --- Pagination ---------------------------------------------------------- */
/* Archives are paginated once the artist has more pieces than fit one page. */
.pagination {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  justify-content: center;
  margin-top: var(--space-xl);
}
.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  padding: 0.4em 0.8em;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-pill);
  color: var(--color-cream);
  font-size: var(--fs-sm);
}
.pagination .page-numbers:hover { border-color: var(--color-pink); text-decoration: none; }
.pagination .page-numbers.current {
  background-color: var(--color-pink);
  border-color: var(--color-pink);
  color: var(--color-black-solid);
  font-weight: 600;
}

/* --- Empty states -------------------------------------------------------- */
/* Shown before the artist has published anything, so a fresh install never
   looks broken. */
.empty-state {
  background-color: var(--color-bg-alt);
  border: 1px dashed var(--color-border-strong);
  border-radius: var(--radius-md);
  padding: var(--space-xl);
  text-align: center;
  color: var(--color-cream-muted);
}
.empty-state__title { color: var(--color-cream); }