/*
Theme Name: Singapore Immigration Specialist
Theme URI: https://guide.immigrationspecialist.sg/
Author: Singapore Immigration Specialist
Author URI: https://immigrationspecialist.sg/
Description: Long-form guide theme ported from the Singapore Immigration Specialist static guide site. Hub-and-spoke guide architecture with sticky table of contents, FAQ blocks, callouts, checklists, timelines, related-guide carousels, light/dark theming and built-in Article, FAQPage and BreadcrumbList structured data.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: immigration-guide
Tags: blog, one-column, two-columns, custom-menu, custom-logo, featured-images, block-styles, translation-ready, accessibility-ready
*/

/*
 * The design system lives in assets/css/guide.css, which is enqueued as the
 * main stylesheet. This file exists for the theme header and for small
 * overrides you want to keep separate from the ported design system.
 */

/* --- WordPress specific additions on top of the ported design system --- */

/* Article layout with the contents column hidden. */
.layout--full { grid-template-columns: minmax(0, 1fr); }

/* Search form. */
.immigration-search { display: flex; gap: 0.6rem; flex-wrap: wrap; margin: 0 0 1.5rem; }
.immigration-search input[type="search"] {
  flex: 1 1 16rem; min-width: 0; padding: 0.7rem 0.9rem; font: inherit;
  color: var(--g-ink); background: var(--g-surface, #fff);
  border: 1px solid var(--g-line); border-radius: 10px;
}
.immigration-search input[type="search"]:focus-visible { outline: 2px solid var(--g-cyan-deep); outline-offset: 2px; }

/* Core pagination, styled to match the buttons. */
.pagination { margin: 2rem 0 0; }
.pagination .nav-links { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: center; }
.pagination .page-numbers {
  display: inline-grid; place-items: center; min-width: 2.4rem; height: 2.4rem;
  padding: 0 0.7rem; border-radius: 9px; border: 1px solid var(--g-line);
  color: var(--g-ink); text-decoration: none; font-size: 0.9rem; font-weight: 600;
}
.pagination .page-numbers.current { border-color: var(--g-cyan-deep); color: var(--g-cyan-deep); }

/* Core block alignment inside articles. */
.article .alignwide { width: 100%; }
.article .alignfull { width: 100%; }
.article .aligncenter { margin-left: auto; margin-right: auto; }
.article figure { margin: 1.25rem 0; }
.article figcaption { font-size: 0.82rem; color: var(--g-ink-soft); margin-top: 0.4rem; }
.article blockquote {
  margin: 1.25rem 0; padding: 0.6rem 0 0.6rem 1.1rem;
  border-left: 3px solid var(--g-cyan); color: var(--g-ink-soft);
}

/* Comments, when a site chooses to enable them. */
.comments-area { margin-top: 2.5rem; }
.comments-area .comment-list { list-style: none; margin: 0; padding: 0; }
.comments-area .comment-body { padding: 1rem 0; border-top: 1px solid var(--g-line); }

/* Editor and accessibility helper. */
.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* Service landing pages drop the enquiry form into their closing band, which is
   a narrow, centred copy column. The form is two columns and needs the page
   width, and its labels read left-aligned like every other form on the site.
   The band's own copy keeps its original measure. */
.apr-closing:has(.lead-wrap) { max-width: 74rem; }
.apr-closing:has(.lead-wrap) > :not(.lead-wrap) { max-width: 44rem; margin-inline: auto; }
.apr-closing .lead-wrap { text-align: left; }

/* The services filter marks non-matching cards with [hidden], but .svc-card
   sets its own display value, which beats the browser's [hidden] rule and
   leaves every card on screen. The design system fixes this for link cards in
   the guides carousel and not for service cards, so it is corrected here. */
.svc-card[hidden] { display: none; }

/* An imported services grid that lost its .shell wrapper still needs the page
   measure and gutters, so its cards line up with everything above them. */
main > .svc-grid {
  max-width: 74rem;
  margin-inline: auto;
  padding-inline: clamp(1.5rem, 5vw, 2rem);
}
