/*
Theme Name:   NAMAH v18
Theme URI:    https://blog.namahconstruction.ae
Description:  NAMAH Construction journal — v18 Illoca-clone identity (navy / cream / coral).
              Child of Twenty Twenty-Five. Design tokens live in theme.json; this file carries
              only what theme.json cannot express.
Author:       NAMAH Platform
Template:     twentytwentyfive
Version:      1.0.0
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 8.1
License:      GPL-2.0-or-later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  namah-v18
Update URI:   false
*/

/* `Update URI: false` stops WordPress from ever matching this slug against a wordpress.org
   theme of the same name and "updating" our theme out from under us. */

:root {
  /* Mirrors D:\AI\dc1-namah-deploy\v18-design\02-component-application-spec.md §1.1 verbatim.
     If that table changes, this block and theme.json change with it — in the same commit. */
  --namah-rule-navy:  color-mix(in srgb, #1B2A4A 18%, transparent);
  --namah-rule-cream: color-mix(in srgb, #D9C7A0 30%, transparent);
}

/* DottedRule — the reference's separator, applied to post-list rows and the FAQ pattern. */
.wp-block-separator.is-style-namah-dotted {
  border: 0;
  border-top: 2px dotted var(--namah-rule-navy);
  opacity: 1;
  margin-block: var(--wp--preset--spacing--50);
}

/* CoralCTAButton — the pill. Label is #FFFFFF, never cream: doc 02 §1.3 measures cream-on-coral
   at 4.21:1 (fails) and white-on-coral at 4.89:1 (passes AA). */
.wp-block-button.is-style-namah-cta .wp-block-button__link {
  background-color: var(--wp--preset--color--coral);
  color: #FFFFFF;
  border-radius: 999px;
  padding: 0.85rem 1.75rem;
  font-family: var(--wp--preset--font-family--body);
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  transition: background-color 160ms ease;
}
.wp-block-button.is-style-namah-cta .wp-block-button__link:hover,
.wp-block-button.is-style-namah-cta .wp-block-button__link:focus-visible {
  background-color: var(--wp--preset--color--coral-deep);   /* hover deepens, never lightens */
}
/* On a navy ground the coral fill is 2.9:1 against its background — under the 3:1 non-text floor.
   Doc 02 §1.3's remedy, applied literally: a 1px coral-bright ring. */
.has-navy-background-color .wp-block-button.is-style-namah-cta .wp-block-button__link {
  box-shadow: 0 0 0 1px var(--wp--preset--color--coral-bright);
}

/* Focus ring — coral-bright, matching the main site. */
:where(a, button, input, textarea, select, summary):focus-visible {
  outline: 2px solid var(--wp--preset--color--coral-bright);
  outline-offset: 2px;
}

/* PaperTexture — the cream kraft grain, as a tiled SVG the asset wave emits in the v18 palette.
   Until assets/paper/cream-grain.svg exists this rule is inert (background-image fails silently
   and the flat cream from theme.json shows through). Ship the tile, no CSS change needed. */
body {
  background-image: url("assets/paper/cream-grain.svg");
  background-repeat: repeat;
  background-size: 512px 512px;
}

/* Header lockup sizing — the compact mark+wordmark, never the tagline variant, in the nav. */
.wp-block-site-logo img { height: 44px; width: auto; }
@media (max-width: 600px) { .wp-block-site-logo img { height: 36px; } }

/* Long-form measure: the reference sets body copy in a narrow column. */
.wp-block-post-content > p { max-width: 68ch; }

/* --- Chrome for the child template parts (parts/header.html, parts/footer.html) ---------------
   Twenty Twenty-Five's own header renders the site TITLE as text; the SSOT requires the exact
   lockup, so the child overrides both parts and these rules dress them. */
.namah-header .wp-block-navigation a {
  color: var(--wp--preset--color--navy);
  text-decoration: none;
}
.namah-header .wp-block-navigation a:hover,
.namah-header .wp-block-navigation a:focus-visible {
  color: var(--wp--preset--color--coral);
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

/* Footer sits on navy: cream underlined links clear AA (13.1:1); coral on navy would not. */
.namah-footer a {
  color: var(--wp--preset--color--cream);
  text-decoration: underline;
  text-underline-offset: 0.18em;
}
.namah-footer a:hover,
.namah-footer a:focus-visible { color: var(--wp--preset--color--tan); }
.namah-footer .wp-block-separator.is-style-namah-dotted {
  border-top-color: var(--namah-rule-cream);   /* the navy rule would be invisible here */
}
.namah-footer-lockup img { max-width: 300px; height: auto; }
@media (max-width: 600px) { .namah-footer-lockup img { max-width: 220px; } }