/*
 * main.css — the WordPress base under the design system.
 *
 * The starter's main.css (2,500 lines of components for its own markup) is replaced here: the templates print the
 * design system's markup, and site.css (components.css from design-system/web-austria/) styles all of it
 * (BUILD-PLAN.md, deviation 6). What remains is what only WordPress produces: its core classes, the admin bar, the
 * loader's admin warning, pagination and the plain-page fallback. Colours and sizes come from the tokens only.
 */

/* WordPress core classes */
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.screen-reader-text:focus { position: static; width: auto; height: auto; clip: auto; }
.alignleft { float: left; margin: 0 var(--gap-text) var(--gap-text) 0; }
.alignright { float: right; margin: 0 0 var(--gap-text) var(--gap-text); }
.aligncenter { display: block; margin-inline: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text, .gallery-caption { margin-top: .5rem; font-size: var(--text-small); line-height: var(--leading-small); color: var(--text-2); }
.prose img, .prose figure { max-width: 100%; height: auto; }
.prose table { width: 100%; border-collapse: collapse; }
.prose th, .prose td { padding: .75rem 1rem .75rem 0; border-bottom: var(--hairline) solid var(--rule); text-align: left; vertical-align: top; }
.prose th { font-weight: var(--title-weight); }

/* The admin bar sits above the sticky header for logged-in editors. */
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }

/* inc/acf.php prints this for administrators when a layout has no template part. */
.acf-missing-template { margin: var(--gap-text) var(--gutter); padding: 1rem; border: var(--hairline) solid var(--error); color: var(--error); }

/* Pagination (blog, categories, search). */
.pagination { margin-top: var(--gap-block); }
.pagination .nav-links { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: var(--control-h); min-height: var(--control-h);
  padding-inline: .75rem; border: var(--hairline) solid var(--rule); border-radius: var(--radius-control); color: var(--text); text-decoration: none; }
.pagination .page-numbers:hover { border-color: var(--line); }
.pagination .page-numbers.current { background: var(--cta); border-color: var(--cta); color: var(--on-cta); }
.pagination .page-numbers:focus-visible { outline: var(--focus-width) solid var(--focus); outline-offset: var(--focus-offset); }

/* Search form (searchform.php) and the 404. */
.search-form { display: flex; flex-wrap: wrap; gap: .5rem; align-items: end; max-width: 36rem; }
.search-form .field { flex: 1 1 16rem; margin: 0; }
.error-404__actions { display: flex; flex-wrap: wrap; gap: var(--gap-actions); margin-top: var(--gap-text); }

/* Password-protected pages (WordPress' own form, requirement A27). */
.post-password-form { display: grid; gap: var(--gap-text); max-width: 36rem; }
.post-password-form input[type="password"] { width: 100%; min-height: var(--control-h); padding: .75rem 1rem; font: inherit; color: var(--text);
  background: var(--bg); border: var(--hairline) solid var(--line); border-radius: var(--radius-control); }
.post-password-form input[type="submit"] { justify-self: start; min-height: var(--control-h); padding-inline: var(--control-pad-x); font: inherit;
  background: var(--cta); color: var(--on-cta); border: 0; border-radius: var(--radius-control); cursor: pointer; }
