/*
Theme Name: PixtraQ
Theme URI: https://pixtra.in/
Author: PixtraQ
Author URI: https://pixtra.in/
Description: Lightweight, accessibility-first block child theme for a web agency (PixtraQ)
Template: twentytwentyfive
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: pixtraq
*/

/* ──────────────────────────────────────────────────────────────
   PixtraQ minimal base styles
   Notes:
   - For block themes, style.css is used for metadata; we'll also
     enqueue it so these rules apply (in the next file).
   - Keep overrides subtle; let theme.json control most styling.
   ────────────────────────────────────────────────────────────── */

:root {
  /* Design tokens (mirrored in theme.json) */
  --pxq-ink: #0a0a0a;
  --pxq-bg: #ffffff;
  --pxq-muted: #f5f7f9;
  --pxq-green: #1e7d36;
  --pxq-mango: #ff9f1a;

  /* Spacing + radii */
  --pxq-radius: 16px;
  --pxq-radius-pill: 999px;

  /* Focus ring */
  --pxq-focus: #1a73e8;
  --pxq-focus-ring: 3px;
  --pxq-focus-offset: 2px;
}

/* Improve link readability + underline rendering */
a {
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.15em;
  text-decoration-skip-ink: auto;
}

/* Accessible focus outlines (only when keyboard focusing) */
:where(a, button, [role="button"], input, select, textarea):focus-visible {
  outline: var(--pxq-focus-ring) solid var(--pxq-focus);
  outline-offset: var(--pxq-focus-offset);
  box-shadow: 0 0 0 calc(var(--pxq-focus-ring) + 1px) color-mix(in srgb, var(--pxq-focus) 25%, transparent);
  border-radius: 6px; /* harmonizes with block controls */
}

/* Buttons: ensure focus ring isn’t clipped by pill radius */
:where(.wp-element-button, .wp-block-button__link):focus-visible {
  border-radius: var(--pxq-radius-pill);
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  * {
    transition-duration: 0.001ms !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}

/* High-contrast text on brand backgrounds */
.pxq-on-green,
.has-green-background-color,
.pxq-on-mango,
.has-mango-background-color {
  color: #ffffff;
}

/* Card utility used by service tiles (kept minimal) */
.pxq-card {
  background: var(--pxq-bg);
  border: 1px solid var(--pxq-muted);
  border-radius: var(--pxq-radius);
  padding: 24px;
}

/* Small helper for rounded containers (CTA strip, etc.) */
.pxq-rounded {
  border-radius: var(--pxq-radius);
  overflow: clip;
}

/* Skip-link (we’ll add the markup in the header) */
.pxq-skip-link {
  position: absolute;
  inset-inline-start: 8px;
  inset-block-start: 8px;
  padding: 8px 12px;
  background: #000;
  color: #fff;
  border-radius: 8px;
  transform: translateY(-150%);
}
.pxq-skip-link:focus {
  transform: translateY(0);
  outline: var(--pxq-focus-ring) solid var(--pxq-focus);
}

/* Print basics: avoid wasting ink, keep links readable */
@media print {
  a { color: #000; text-decoration: underline; }
  .wp-block-cover { background: none !important; }
}
