/*
 * Payslashes Enterprise Design System (PEDS) v1.0
 * Sprint 36 — additive visual foundation.
 * Loaded last so existing templates inherit a unified brand without structural rewrites.
 */
:root {
  /* Brand */
  --ps-brand-50: #eefaf3;
  --ps-brand-100: #d9f3e4;
  --ps-brand-200: #b5e6ca;
  --ps-brand-300: #84d2a7;
  --ps-brand-400: #49b87d;
  --ps-brand-500: #159857;
  --ps-brand-600: #087f46;
  --ps-brand-700: #066638;
  --ps-brand-800: #07512f;
  --ps-brand-900: #064327;
  --ps-brand: var(--ps-brand-600);
  --ps-brand-dark: var(--ps-brand-700);
  --ps-brand-light: var(--ps-brand-50);

  /* Commerce and semantic */
  --ps-commerce: #d96500;
  --ps-commerce-dark: #b94f00;
  --ps-success: #14804a;
  --ps-success-soft: #eaf8f0;
  --ps-warning: #b66a00;
  --ps-warning-soft: #fff6df;
  --ps-danger: #c73737;
  --ps-danger-soft: #fff0f0;
  --ps-info: #2166c1;
  --ps-info-soft: #edf5ff;
  --ps-featured: #087f46;
  --ps-bestseller: #9a6500;
  --ps-new: #2166c1;
  --ps-toprated: #7451b8;

  /* Neutral */
  --ps-ink-950: #0b172a;
  --ps-ink-900: #10233f;
  --ps-ink-700: #33445e;
  --ps-ink-600: #506079;
  --ps-ink-500: #6b7890;
  --ps-border: #dfe5ec;
  --ps-border-strong: #cbd4df;
  --ps-surface: #ffffff;
  --ps-surface-muted: #f7f9fb;
  --ps-page: #f3f6f8;

  /* Type */
  --ps-font-sans: "Open Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ps-text-xs: .75rem;
  --ps-text-sm: .875rem;
  --ps-text-md: 1rem;
  --ps-text-lg: 1.125rem;
  --ps-text-xl: 1.375rem;
  --ps-text-2xl: clamp(1.6rem, 2.5vw, 2.15rem);

  /* Radius */
  --ps-radius-xs: 6px;
  --ps-radius-sm: 9px;
  --ps-radius-md: 12px;
  --ps-radius-lg: 16px;
  --ps-radius-xl: 22px;
  --ps-radius-pill: 999px;

  /* Shadows */
  --ps-shadow-xs: 0 1px 2px rgba(16, 35, 63, .05);
  --ps-shadow-sm: 0 5px 16px rgba(16, 35, 63, .07);
  --ps-shadow-md: 0 12px 30px rgba(16, 35, 63, .10);
  --ps-shadow-lg: 0 22px 52px rgba(16, 35, 63, .14);
  --ps-focus: 0 0 0 3px rgba(8, 127, 70, .22);

  /* Motion */
  --ps-motion-fast: 140ms;
  --ps-motion: 220ms;
  --ps-ease: cubic-bezier(.2, .8, .2, 1);
}

html { color-scheme: light; }
body {
  color: var(--ps-ink-700);
  background: var(--ps-page);
  font-family: var(--ps-font-sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  color: var(--ps-ink-900);
  letter-spacing: -.015em;
}

a { transition: color var(--ps-motion-fast) var(--ps-ease); }
a:hover { color: var(--ps-brand-dark); }

/* Accessible global focus treatment */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--ps-brand) !important;
  outline-offset: 2px;
  box-shadow: var(--ps-focus);
}

/* Unified controls without rewriting Bootstrap/template structure */
.btn,
button,
input[type="button"],
input[type="submit"] {
  border-radius: var(--ps-radius-sm);
  transition: transform var(--ps-motion-fast) var(--ps-ease),
              box-shadow var(--ps-motion) var(--ps-ease),
              background-color var(--ps-motion-fast) var(--ps-ease),
              border-color var(--ps-motion-fast) var(--ps-ease);
}
.btn-primary,
.btn-success,
.pcv2-buy,
.ps-btn-primary {
  background: var(--ps-brand) !important;
  border-color: var(--ps-brand) !important;
  color: #fff !important;
  box-shadow: 0 7px 16px rgba(8, 127, 70, .18);
}
.btn-primary:hover,
.btn-success:hover,
.pcv2-buy:hover,
.ps-btn-primary:hover {
  background: var(--ps-brand-dark) !important;
  border-color: var(--ps-brand-dark) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(8, 127, 70, .24);
  transform: translateY(-1px);
}
.btn-outline-primary,
.pcv2-cart,
.ps-btn-secondary {
  color: var(--ps-brand-dark) !important;
  background: #fff !important;
  border-color: rgba(8, 127, 70, .42) !important;
}
.btn-outline-primary:hover,
.pcv2-cart:hover,
.ps-btn-secondary:hover {
  color: #fff !important;
  background: var(--ps-brand) !important;
  border-color: var(--ps-brand) !important;
}

.form-control,
.custom-select,
select.form-control,
textarea.form-control,
input.form-control {
  color: var(--ps-ink-900);
  background-color: var(--ps-surface);
  border-color: var(--ps-border);
  border-radius: var(--ps-radius-sm);
  min-height: 42px;
}
.form-control:focus,
.custom-select:focus {
  border-color: var(--ps-brand-400);
  box-shadow: var(--ps-focus);
}

/* Shared surface language */
.card,
.dropdown-menu,
.modal-content,
.ps-surface {
  border-color: var(--ps-border);
  border-radius: var(--ps-radius-md);
  box-shadow: var(--ps-shadow-sm);
}
.dropdown-menu,
.modal-content { background: var(--ps-surface); }

/* Product cards: preserve layout, unify brand and elevation */
article.pcv2-card {
  background: var(--ps-surface) !important;
  border-color: var(--ps-border) !important;
  border-radius: var(--ps-radius-lg) !important;
  box-shadow: var(--ps-shadow-sm) !important;
  transition: transform var(--ps-motion) var(--ps-ease),
              box-shadow var(--ps-motion) var(--ps-ease),
              border-color var(--ps-motion) var(--ps-ease) !important;
}
article.pcv2-card:hover,
article.pcv2-card:focus-within {
  border-color: rgba(8, 127, 70, .34) !important;
  box-shadow: var(--ps-shadow-md) !important;
  transform: translateY(-3px);
}
article.pcv2-card .pcv2-media {
  background: linear-gradient(180deg, #fbfcfd 0%, var(--ps-surface-muted) 100%) !important;
  border-radius: calc(var(--ps-radius-lg) - 2px) calc(var(--ps-radius-lg) - 2px) var(--ps-radius-sm) var(--ps-radius-sm) !important;
}
article.pcv2-card .pcv2-title,
article.pcv2-card .pcv2-title a { color: var(--ps-ink-900) !important; }
article.pcv2-card .pcv2-price,
article.pcv2-card .price,
.ps-price { color: var(--ps-commerce) !important; }

/* Semantic product badges */
article.pcv2-card .pcv2-badge {
  border-radius: var(--ps-radius-pill) !important;
  border: 1px solid transparent;
  font-weight: 700 !important;
  letter-spacing: .01em;
  box-shadow: var(--ps-shadow-xs);
}
article.pcv2-card .pcv2-badge[data-badge-kind="featured"],
article.pcv2-card .pcv2-badge--featured { background: var(--ps-brand-light) !important; color: var(--ps-featured) !important; border-color: var(--ps-brand-200) !important; }
article.pcv2-card .pcv2-badge[data-badge-kind="best-seller"],
article.pcv2-card .pcv2-badge--best-seller { background: #fff8df !important; color: var(--ps-bestseller) !important; border-color: #edd995 !important; }
article.pcv2-card .pcv2-badge[data-badge-kind="new"],
article.pcv2-card .pcv2-badge--new { background: var(--ps-info-soft) !important; color: var(--ps-new) !important; border-color: #bed9f8 !important; }
article.pcv2-card .pcv2-badge[data-badge-kind="top-rated"],
article.pcv2-card .pcv2-badge--top-rated { background: #f3efff !important; color: var(--ps-toprated) !important; border-color: #d9ccf8 !important; }

article.pcv2-card .pcv2-discount,
article.pcv2-card .pcv2-sale,
.ps-discount-badge {
  background: #fff2e7 !important;
  color: var(--ps-commerce-dark) !important;
  border-color: #ffd0aa !important;
  border-radius: var(--ps-radius-pill) !important;
}

article.pcv2-card .pcv2-stock,
article.pcv2-card .pcv2-shipping,
article.pcv2-card .pcv2-delivery {
  min-height: 30px;
  border-radius: var(--ps-radius-sm) !important;
  font-weight: 700;
}
article.pcv2-card .pcv2-stock {
  color: var(--ps-info) !important;
  background: var(--ps-info-soft) !important;
  border-color: #c8ddf8 !important;
}
article.pcv2-card .pcv2-shipping,
article.pcv2-card .pcv2-delivery {
  color: var(--ps-success) !important;
  background: var(--ps-success-soft) !important;
  border-color: #bfe7cf !important;
}

article.pcv2-card .pcv2-wishlist,
article.pcv2-card .pcv2-quick-view,
article.pcv2-card .pcv2-compare {
  color: var(--ps-ink-700) !important;
  background: rgba(255,255,255,.96) !important;
  border-color: var(--ps-border) !important;
  box-shadow: var(--ps-shadow-xs) !important;
}
article.pcv2-card .pcv2-wishlist:hover,
article.pcv2-card .pcv2-quick-view:hover,
article.pcv2-card .pcv2-compare:hover {
  color: var(--ps-brand-dark) !important;
  border-color: var(--ps-brand-300) !important;
  box-shadow: var(--ps-shadow-sm) !important;
}

/* Header/nav coherence */
header .btn-primary,
.navbar .btn-primary,
.header .btn-primary { background: var(--ps-brand) !important; }
.badge-success,
.bg-success { background-color: var(--ps-success) !important; }
.text-success { color: var(--ps-success) !important; }
.text-warning { color: var(--ps-warning) !important; }
.text-danger { color: var(--ps-danger) !important; }

/* Toasts and alerts */
.alert-success { color: #0a5f34; background: var(--ps-success-soft); border-color: #b7e5ca; }
.alert-warning { color: #7b4900; background: var(--ps-warning-soft); border-color: #f0d99b; }
.alert-danger { color: #8d2323; background: var(--ps-danger-soft); border-color: #f2c2c2; }

/* Small-screen discipline */
@media (max-width: 767px) {
  :root { --ps-radius-lg: 14px; }
  article.pcv2-card:hover,
  article.pcv2-card:focus-within { transform: none; }
  .btn, button { min-height: 42px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (prefers-contrast: more) {
  :root {
    --ps-border: #8693a4;
    --ps-ink-700: #17283f;
  }
  article.pcv2-card { border-width: 2px !important; }
}
