/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
/**
 * domiyoga — globals.css
 * Design tokens
 */

@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500&family=DM+Sans:opsz,wght@9..40,300;9..40,400&display=swap');

:root {

  /* Kolory */
  --color-bg:           #FAF8F5;
  --color-surface:      #FFFFFF;
  --color-text:         #2A2725;
  --color-text-muted:   #7A756E;
  --color-text-invert:  #FFFFFF;
  --color-accent:       #6B4F7A;
  --color-accent-hover: #543D61;
  --color-accent-light: #EDE6F2;
  --color-sage:         #8FA89A;
  --color-sage-light:   #E8EFEC;
  --color-border:       #E2DDD8;
  --color-error:        #C0392B;
  --color-success:      #2E7D5E;

  /* Typografia */
  --font-display: 'Jost', system-ui, sans-serif;
  --font-body:    'DM Sans', system-ui, sans-serif;

  /* Skala — fluid clamp(), 320px → 1280px */
  --text-xs:   clamp(0.6875rem, 0.65rem  + 0.19vw, 0.75rem);
  --text-sm:   clamp(0.8125rem, 0.77rem  + 0.22vw, 0.875rem);
  --text-base: clamp(0.9375rem, 0.89rem  + 0.24vw, 1rem);
  --text-lg:   clamp(1.0625rem, 0.98rem  + 0.42vw, 1.125rem);
  --text-xl:   clamp(1.125rem,  1.01rem  + 0.58vw, 1.25rem);
  --text-2xl:  clamp(1.25rem,   1.07rem  + 0.9vw,  1.5rem);
  --text-3xl:  clamp(1.5rem,    1.14rem  + 1.8vw,  2rem);
  --text-4xl:  clamp(1.75rem,   1.1rem   + 3.25vw, 2.75rem);
  --text-5xl:  clamp(2.25rem,   1.06rem  + 5.97vw, 4rem);

  /* Wagi */
  --weight-light:   300;
  --weight-regular: 400;
  --weight-medium:  500;

  /* Line-heights */
  --leading-tight:  1.15;
  --leading-normal: 1.6;
  --leading-loose:  1.85;

  /* Letter-spacing */
  --tracking-tight:  -0.02em;
  --tracking-wide:    0.08em;
  --tracking-wider:   0.14em;

  /* Spacing */
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  /* Layout */
  --max-width: 1280px;
  --gutter:    1.5rem;

  /* Misc */
  --radius-md:   8px;
  --radius-full: 9999px;
  --shadow-sm:   0 1px 3px rgba(42,39,37,.06);
  --transition:  250ms ease;
  --z-header:    100;
}

@media (max-width: 768px) {
  :root {
    --gutter:   1.25rem;
    --space-16: 3rem;
    --space-20: 4rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  * { transition-duration: 0ms !important; animation-duration: 0ms !important; }
}

/* Ukryj spinner CF7 */
.wpcf7-spinner { display: none !important; }

/* Wrapper formularza */
.wpcf7-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5);
  align-items: start;
}

/* Ukryte pola CF7 — poza flow */
.wpcf7-form .hidden-fields-container {
  display: none;
}

/* Każde <p> to komórka gridu */
.wpcf7-form > p {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin: 0;
}

/* Ostatni <p> (submit) — pełna szerokość */
.wpcf7-form > p:last-of-type {
  grid-column: 1 / -1;
}

/* Response output — pełna szerokość */
.wpcf7-response-output {
  grid-column: 1 / -1;
}

/* Mobile — jedna kolumna */
@media (max-width: 600px) {
  .wpcf7-form {
    grid-template-columns: 1fr;
  }
}

/* ─── LABEL ───────────────────────────────────────── */
.wpcf7-form label {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
  color: var(--color-text-muted);
  width: 100%;
}

/* CF7 wstawia <br> między label-text a inputem — ukryj */
.wpcf7-form label br { display: none; }

/* ─── INPUTY & SELECT ─────────────────────────────── */
.wpcf7-form .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form select {
  display: block;
  width: 100%;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-4) var(--space-5);
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: var(--weight-light);
  color: var(--color-text);
  line-height: var(--leading-normal);
  transition: border-color var(--transition), box-shadow var(--transition);
  -webkit-appearance: none;
  appearance: none;
}

.wpcf7-form input::placeholder {
  color: var(--color-text-muted);
  opacity: 0.6;
}

.wpcf7-form input:focus,
.wpcf7-form select:focus {
  outline: none;
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px var(--color-accent-light);
}

/* Select — custom arrow */
.wpcf7-form select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237A756E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--space-4) center;
  padding-right: var(--space-10);
  cursor: pointer;
}

/* ─── WALIDACJA ───────────────────────────────────── */
.wpcf7-form input.wpcf7-not-valid,
.wpcf7-form select.wpcf7-not-valid {
  border-color: var(--color-error);
  box-shadow: none;
}

.wpcf7-not-valid-tip {
  display: block;
  margin-top: var(--space-2);
  font-size: var(--text-xs);
  font-weight: var(--weight-regular);
  letter-spacing: 0;
  text-transform: none;
  color: var(--color-error);
}

/* ─── SUBMIT ──────────────────────────────────────── */
.wpcf7-form input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4) var(--space-8);
  background: var(--color-accent);
  color: var(--color-text-invert);
  font-family: var(--font-display);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
  border: none;
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: background var(--transition);
  min-width: 200px;
  -webkit-appearance: none;
  appearance: none;
}

.wpcf7-form input[type="submit"]:hover {
  background: var(--color-accent-hover);
}

.wpcf7-form input[type="submit"]:active {
  transform: translateY(1px);
}

/* ─── RESPONSE OUTPUT ─────────────────────────────── */
.wpcf7-response-output {
  padding: var(--space-4) var(--space-5);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: var(--weight-regular);
  border: 1px solid transparent;
  margin: 0;
}

/* Ukryty domyślnie (CF7 ustawia aria-hidden) */
.wpcf7-response-output:empty { display: none; }

.wpcf7-mail-sent-ok {
  background: #EBF5F0;
  border-color: var(--color-success);
  color: var(--color-success);
}

.wpcf7-validation-errors,
.wpcf7-mail-sent-ng,
.wpcf7-aborted {
  background: #FBF0EF;
  border-color: var(--color-error);
  color: var(--color-error);
}