/*
Theme Name: Pale B2B — Poolrooms
Theme URI: https://b2b.palecoffee.pl
Description: Child theme of Pixl for b2b.palecoffee.pl. Base-coat recolour toward the "Poolrooms" palette — creamy tile background, ink text, deep-teal lines with a faint aqua neon glow, and a rose soft-distraction accent. Colours only at this stage; the one-page flow, vaporize transitions and full dream treatment are layered on later per otherFiles/b2b-redesign-build-spec.md.
Author: Pale
Template: pixl
Version: 0.3.2
License: GNU General Public License v2 or later
Text Domain: pale-b2b-poolrooms
*/

/* ---------------------------------------------------------------------------
   Base coat only. The palette itself is overridden in this child theme's
   theme.json (background / foreground / primary / tertiary). This file adds
   the "faint neon line" feel on top, using a glow rather than a bright fill
   so nothing in the order grid loses contrast.
   The bright aqua below is used ONLY as a shadow/glow, never as a text or
   fill colour — that is what keeps quantity/price cells legible.
--------------------------------------------------------------------------- */

:root {
  --pale-aqua-glow:      0 0 6px  rgba(95, 224, 238, 0.45); /* #5FE0EE */
  --pale-aqua-glow-soft: 0 0 10px rgba(95, 224, 238, 0.30);
}

/* Inputs / textareas: cream field, ink text (from theme.json), faint aqua halo. */
:is(textarea, input:not([type="submit"])) {
  box-shadow: var(--pale-aqua-glow-soft);
}

/* Buttons keep Pixl's shape; add a faint aqua halo around the teal fill. */
.wp-element-button,
.wp-block-button__link {
  box-shadow: var(--pale-aqua-glow) !important;
}

/* Links pick up a whisper of glow on hover (kept subtle). */
a:where(:not(.wp-element-button)):hover {
  text-shadow: var(--pale-aqua-glow-soft);
}

/* ===========================================================================
   Product-table harmonisation  (wc-product-table-lite → theme palette)
   ---------------------------------------------------------------------------
   The plugin prints a PER-TABLE, ID-scoped <style> block (#wcpt-{id}) built
   from each table's saved colour scheme in the database, and exposes the text
   colour as CSS variables on the container. So instead of editing every
   table by hand, we rebind those variables + the key colour props to the
   theme palette here, once. Every current and future table follows the theme
   automatically. !important is required only because the plugin's rules are
   ID-scoped; the plugin itself does not use !important on these, so we win
   cleanly. Class names verified against the plugin's templates +
   style-functions.php.
   color-mix gives a muted "secondary" ink; on a browser without color-mix the
   rule is simply ignored and that one value falls back to the table's own —
   nothing breaks.
=========================================================================== */

/* Text-colour variables the plugin reads for cell / heading / secondary text. */
[id^="wcpt-"] {
  --wcpt-primary-text-color:   var(--wp--preset--color--foreground) !important;
  --wcpt-secondary-text-color: color-mix(in srgb, var(--wp--preset--color--foreground) 62%, transparent) !important;
}

/* Cell body text + column headings → ink. */
[id^="wcpt-"] .wcpt-cell,
[id^="wcpt-"] .wcpt-heading {
  color: var(--wp--preset--color--foreground) !important;
}

/* Product name → teal accent, echoing links and buttons. */
[id^="wcpt-"] .wcpt-title,
[id^="wcpt-"] a.wcpt-title {
  color: var(--wp--preset--color--primary) !important;
}

/* Structural lines → teal, so table borders match the theme. */
[id^="wcpt-"] .wcpt-table,
[id^="wcpt-"] .wcpt-table-scroll-wrapper-outer,
[id^="wcpt-"] .wcpt-row,
[id^="wcpt-"] .wcpt-cell,
[id^="wcpt-"] .wcpt-heading-row,
[id^="wcpt-"] .wcpt-heading {
  border-color: var(--wp--preset--color--primary) !important;
}

/* Rose (tertiary) is deliberately held back from the grid — it stays a "soft
   distraction" for chrome / empty states per the build spec, so the tables
   read calm. Row even/odd backgrounds are left untouched; if striping looks
   off once live, map .wcpt-odd / .wcpt-even backgrounds here too. */

/* ===========================================================================
   Bottom navigation bar  (child footer part: parts/footer.html)
   The custom menu now lives in the footer. Pixl's default header and footer are
   both suppressed by the child parts (header is intentionally empty).
=========================================================================== */

.pale-footerbar {
  padding-top: var(--wp--preset--spacing--30);
  padding-bottom: var(--wp--preset--spacing--30);
  margin-top: var(--wp--preset--spacing--40);
  border-top: 2px solid var(--wp--preset--color--primary);
  box-shadow: 0 -3px 8px -4px rgba(95, 224, 238, 0.5); /* faint aqua overglow */
}

.pale-footerbar__links {
  gap: 0.75rem 1.5rem;
}

.pale-footerbar p {
  margin: 0;
}

/* ===========================================================================
   Floating cart widget  (wc-product-table-lite: .wcpt-cart-widget)
   The widget is part of the product-table plugin — there is no separate cart
   plugin. The plugin prints its colours as an inline <style> inside the widget
   at plain class specificity, so we override with !important. Matched to the
   maroon heading blocks: maroon fill + rose text, both palette colours, so it
   stays in sync with the scheme.
=========================================================================== */

.wcpt-cart-widget {
  background-color: var(--wp--preset--color--maroon) !important;  /* #731f1f */
  border-color: rgba(233, 174, 198, 0.40) !important;            /* faint rose edge */
}

.wcpt-cart-widget,
.wcpt-cart-widget a,
.wcpt-cw-figure,
.wcpt-cw-text,
.wcpt-cw-price-total,
.wcpt-amount,
.wcpt-currency,
.wcpt-cw-footer,
.wcpt-cw-view-label {
  color: var(--wp--preset--color--tertiary) !important;          /* #E9AEC6 rose */
}

.wcpt-cart-widget .wcpt-cw-separator {
  border-color: rgba(233, 174, 198, 0.40) !important;
}

/* Icons draw with stroke="currentColor", so they follow the rose text. */
.wcpt-cart-widget .wcpt-icon svg {
  stroke: currentColor !important;
}
