/**
 * FindMe24 Store Pro — design tokens. Premium dark UI + gold accent (FindMe24 brand).
 */
:root {
  color-scheme: normal;

  --gpfp-font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --gpfp-font-display: "Poppins", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --gpfp-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", monospace;

  /* Surfaces follow GeneratePress global colors when set — child does not replace Customizer palette. */
  --gpfp-page-bg: transparent;
  --gpfp-surface: color-mix(in srgb, var(--base-2, Canvas) 93%, var(--contrast, CanvasText));
  --gpfp-surface-raised: color-mix(in srgb, var(--base-2, Canvas) 86%, var(--contrast, CanvasText));
  --gpfp-code-bg: color-mix(in srgb, var(--base-3, var(--base-2, Canvas)) 95%, var(--contrast, CanvasText));
  --gpfp-ui-dark: color-mix(in srgb, var(--base-2, Canvas) 88%, var(--contrast, CanvasText));
  --gpfp-border-hairline: color-mix(in srgb, var(--contrast, CanvasText) 8%, transparent);
  --gpfp-border-muted: color-mix(in srgb, var(--contrast, CanvasText) 12%, transparent);

  /* Neutrals (dark UI — numeric scale kept for existing selectors) */
  --gpfp-slate-50: #0d0d0d;
  --gpfp-slate-100: #161616;
  --gpfp-slate-200: rgb(255 255 255 / 0.1);
  --gpfp-slate-300: #3f3f46;
  --gpfp-slate-400: #71717a;
  --gpfp-slate-500: #a1a1aa;
  --gpfp-slate-600: #a1a1aa;
  --gpfp-slate-700: #d4d4d8;
  --gpfp-slate-800: #e4e4e7;
  --gpfp-slate-900: #ffffff;

  /* Accent — GeneratePress `--accent` / `--accent-hover` override defaults below */
  --gpfp-accent-50: color-mix(in srgb, var(--accent, rgb(212 175 55)) 10%, transparent);
  --gpfp-accent-100: color-mix(in srgb, var(--accent, rgb(212 175 55)) 16%, transparent);
  --gpfp-accent-200: color-mix(in srgb, var(--accent, rgb(212 175 55)) 24%, transparent);
  --gpfp-accent-300: color-mix(in srgb, var(--accent, #e8c547) 100%, transparent);
  --gpfp-accent-400: color-mix(in srgb, var(--accent, #e0bc3d) 100%, transparent);
  --gpfp-accent-500: var(--accent, #d4af37);
  --gpfp-accent-600: var(--accent, #d4af37);
  --gpfp-accent-700: color-mix(in srgb, var(--accent, #c9a227) 94%, black);
  --gpfp-accent-800: var(--accent-alt, #0d0d0d);

  --gpfp-indigo-500: var(--gpfp-accent-500);
  --gpfp-indigo-600: var(--gpfp-accent-600);
  --gpfp-indigo-700: var(--gpfp-accent-700);

  --gpfp-emerald-600: var(--accent, #d4af37);
  --gpfp-emerald-50: color-mix(in srgb, var(--accent, rgb(212 175 55)) 12%, transparent);

  --gpfp-on-gold: var(--accent-alt, #0d0d0d);
  --gpfp-gold-hover: var(--accent-hover, #f5d76e);

  /* Do not set --accent or --background-color on :root — reserved for GeneratePress Global Colors */

  --headline-color: var(--contrast, CanvasText);
  --paragraph-color: var(--contrast-2, color-mix(in srgb, CanvasText 68%, Canvas));
  --border-color: var(--gpfp-slate-200);
  --primary-color: var(--contrast, CanvasText);
  --secondary-color: var(--gpfp-accent-600);
  --gpfp-link: var(--accent, var(--gpfp-accent-500));
  --gpfp-link-hover: var(--accent-hover, var(--gpfp-gold-hover));
  --product-price: var(--contrast-2, var(--contrast-3, var(--gpfp-slate-500)));
  --product-discount-price: var(--headline-color);

  /* 6–10px radius system (premium, consistent) */
  --gpfp-radius-sm: 0.375rem;
  --gpfp-radius-md: 0.5rem;
  --gpfp-radius-lg: 0.625rem;
  --gpfp-radius-xl: 0.875rem;
  --gpfp-radius-2xl: 1rem;

  --gpfp-transition: 0.3s ease;
  --gpfp-transition-fast: 0.2s ease;
  --gpfp-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.5);
  --gpfp-shadow-md:
    0 0 0 1px var(--gpfp-border-hairline),
    0 4px 16px -2px rgb(0 0 0 / 0.55),
    0 2px 6px -2px rgb(0 0 0 / 0.35);
  --gpfp-shadow-lg:
    0 0 0 1px var(--gpfp-border-hairline),
    0 16px 40px -12px rgb(0 0 0 / 0.65),
    0 6px 14px -6px rgb(0 0 0 / 0.45);
  --gpfp-shadow-xl: 0 28px 56px -16px rgb(0 0 0 / 0.6);
  --gpfp-ring: 0 0 0 1px color-mix(in srgb, var(--contrast, CanvasText) 16%, transparent);
  /* Follows Customizer / Global Colors --accent */
  --gpfp-ring-accent: 0 0 0 3px color-mix(in srgb, var(--accent, #d4af37) 32%, transparent);

  --gpfp-accent-glow: 0 2px 16px color-mix(in srgb, var(--accent, rgb(212 175 55)) 28%, transparent);
  --gpfp-accent-glow-strong: 0 4px 22px color-mix(in srgb, var(--accent, rgb(212 175 55)) 38%, transparent);

  --gpfp-content-pad: clamp(1.125rem, 4.5vw, 2rem);
  --gpfp-prose-max: 65rem;
  --gpfp-touch-min: 2.75rem;
}

html {
  font-family: var(--gpfp-font-sans);
}

body {
  font-family: inherit;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* GeneratePress controls base background-color and text color. */
  line-height: 1.65;
}

h1,
h2,
h3,
h4,
h5,
h6,
.site-title,
.entry-title,
.page-title,
.archive .page-header .page-title,
.widget-title,
.main-navigation,
.woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce div.product .product_title,
.related.products > h2,
.upsells.products > h2,
.cart-collaterals .cross-sells > h2,
.ftd-atc-title,
.gpfp-qv-title {
  font-family: var(--gpfp-font-display);
}

button,
input,
select,
textarea,
.site,
.site-header,
.site-footer,
.inside-header,
.entry-meta,
.widget,
.woocommerce,
.ftd-atc-modal,
.gpfp-landing,
.gpfp-btn,
.gpfp-quick-view-btn {
  font-family: var(--gpfp-font-sans);
}

code,
kbd,
pre,
samp,
.entry-content code,
.entry-content pre {
  font-family: var(--gpfp-font-mono);
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  border-radius: var(--gpfp-radius-lg) !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  transition:
    background-color var(--gpfp-transition),
    color var(--gpfp-transition),
    border-color var(--gpfp-transition),
    box-shadow var(--gpfp-transition),
    transform var(--gpfp-transition) !important;
  box-shadow: var(--gpfp-shadow-sm) !important;
}

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.checkout,
.woocommerce button.button.alt.disabled {
  background-color: var(--accent, var(--gpfp-accent-600)) !important;
  color: var(--accent-alt, var(--gpfp-on-gold)) !important;
  border-color: transparent !important;
  box-shadow: var(--gpfp-accent-glow) !important;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  background-color: var(--accent-hover, var(--gpfp-gold-hover)) !important;
  color: var(--accent-alt, var(--gpfp-on-gold)) !important;
  filter: none;
  box-shadow: var(--gpfp-accent-glow-strong) !important;
  transform: translateY(-2px) scale(1.02);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  box-shadow: var(--gpfp-accent-glow) !important;
  transform: translateY(-2px) scale(1.02);
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .quantity .qty {
  border-radius: var(--gpfp-radius-md);
  border: 1px solid color-mix(in srgb, var(--contrast, CanvasText) 18%, transparent);
  background: var(--gpfp-surface);
  color: var(--headline-color);
  padding: 0.5rem 0.75rem;
  transition: border-color var(--gpfp-transition), box-shadow var(--gpfp-transition);
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce .quantity .qty:focus {
  outline: none;
  border-color: var(--accent, var(--gpfp-accent-500));
  box-shadow: var(--gpfp-ring-accent);
}

/* Store notices — consistent with premium dark UI */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-radius: var(--gpfp-radius-lg) !important;
  border: 1px solid var(--gpfp-border-muted) !important;
  background: var(--gpfp-surface-raised) !important;
  color: var(--headline-color) !important;
  padding: 0.875rem 1rem !important;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.5;
  box-shadow: var(--gpfp-shadow-sm);
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  display: none !important;
}

/* Semantic tints mixed with theme base so text stays readable in light & dark */
.woocommerce-error {
  border-color: color-mix(in srgb, #ef4444 45%, var(--gpfp-border-muted)) !important;
  background: color-mix(in srgb, var(--gpfp-surface-raised) 78%, #ef4444 22%) !important;
}

.woocommerce-message {
  border-color: color-mix(in srgb, #22c55e 45%, var(--gpfp-border-muted)) !important;
  background: color-mix(in srgb, var(--gpfp-surface-raised) 78%, #22c55e 22%) !important;
}

.woocommerce-info {
  border-color: color-mix(in srgb, #3b82f6 45%, var(--gpfp-border-muted)) !important;
  background: color-mix(in srgb, var(--gpfp-surface-raised) 78%, #3b82f6 22%) !important;
}

/* Native selects — user picked a value (GP --accent); no background-image so dropdown arrows stay intact */
.woocommerce select.gpfp-select-used {
  border-color: var(--accent, var(--gpfp-accent-500)) !important;
  background-color: color-mix(
    in srgb,
    var(--accent, var(--gpfp-accent-500)) 11%,
    var(--gpfp-surface)
  ) !important;
  color: var(--headline-color);
  box-shadow: var(--gpfp-ring-accent), 0 1px 2px color-mix(in srgb, var(--contrast, CanvasText) 10%, transparent);
}

.woocommerce form .form-row select:focus-visible {
  border-color: var(--accent, var(--gpfp-accent-500));
  box-shadow: var(--gpfp-ring-accent);
}