/* @ds-bundle: {"format":4,"namespace":"WearAtWorkDesignSystem_a7f0e8","components":[{"name":"Button","sourcePath":"components/forms/Button.jsx"},{"name":"IconButton","sourcePath":"components/forms/IconButton.jsx"},{"name":"Input","sourcePath":"components/forms/Input.jsx"},{"name":"QuantityStepper","sourcePath":"components/forms/QuantityStepper.jsx"},{"name":"Select","sourcePath":"components/forms/Select.jsx"},{"name":"SectionHeader","sourcePath":"components/layout/SectionHeader.jsx"},{"name":"Breadcrumb","sourcePath":"components/navigation/Breadcrumb.jsx"},{"name":"Badge","sourcePath":"components/product/Badge.jsx"},{"name":"ColorSwatch","sourcePath":"components/product/ColorSwatch.jsx"},{"name":"PriceTag","sourcePath":"components/product/PriceTag.jsx"},{"name":"ProductCard","sourcePath":"components/product/ProductCard.jsx"}],"sourceHashes":{"components/forms/Button.jsx":"7265253c1a18","components/forms/IconButton.jsx":"fff05a19c767","components/forms/Input.jsx":"b89ed31b792d","components/forms/QuantityStepper.jsx":"74ba73bbfabd","components/forms/Select.jsx":"75dbd0eb33a8","components/layout/SectionHeader.jsx":"e47b0036f812","components/navigation/Breadcrumb.jsx":"c94b7c939502","components/product/Badge.jsx":"9bb3737f4d61","components/product/ColorSwatch.jsx":"2b604870a499","components/product/PriceTag.jsx":"580ce1cfa7d4","components/product/ProductCard.jsx":"259805008d70","ui_kits/storefront/App.jsx":"9ff8f880a45c","ui_kits/storefront/Cart.jsx":"a97c758ce725","ui_kits/storefront/Footer.jsx":"95403a015657","ui_kits/storefront/Header.jsx":"ca4d0510de79","ui_kits/storefront/Home.jsx":"644ff19e2c16","ui_kits/storefront/Icons.jsx":"1caf7b49552c","ui_kits/storefront/Listing.jsx":"9870a07c141a","ui_kits/storefront/Product.jsx":"dc964d081404","ui_kits/storefront/data.js":"1d8b1dcfbeed"},"inlinedExternals":[],"unexposedExports":[]} */

(() => {

const __ds_ns = (window.WearAtWorkDesignSystem_a7f0e8 = window.WearAtWorkDesignSystem_a7f0e8 || {});

const __ds_scope = {};

(__ds_ns.__errors = __ds_ns.__errors || []);

// components/forms/Button.jsx
try { (() => {
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
const sizes = {
  sm: {
    height: 'var(--control-sm)',
    padding: '0 16px',
    fontSize: '13px'
  },
  md: {
    height: 'var(--control-md)',
    padding: '0 22px',
    fontSize: '14px'
  },
  lg: {
    height: 'var(--control-lg)',
    padding: '0 30px',
    fontSize: '16px'
  }
};
const variants = {
  primary: {
    background: 'var(--brand-primary)',
    color: 'var(--text-inverse)',
    border: '2px solid var(--brand-primary)'
  },
  accent: {
    background: 'var(--brand-accent)',
    color: 'var(--text-on-accent)',
    border: '2px solid var(--brand-accent)'
  },
  secondary: {
    background: 'transparent',
    color: 'var(--brand-primary)',
    border: '2px solid var(--brand-primary)'
  },
  ghost: {
    background: 'transparent',
    color: 'var(--brand-primary)',
    border: '2px solid transparent'
  }
};
function Button({
  children,
  variant = 'primary',
  size = 'md',
  fullWidth = false,
  iconLeft,
  iconRight,
  disabled = false,
  type = 'button',
  onClick,
  style,
  ...rest
}) {
  const [hover, setHover] = React.useState(false);
  const base = {
    display: 'inline-flex',
    alignItems: 'center',
    justifyContent: 'center',
    gap: '10px',
    fontFamily: 'var(--font-display)',
    fontWeight: 700,
    textTransform: 'uppercase',
    letterSpacing: '0.08em',
    borderRadius: 'var(--radius-sm)',
    cursor: disabled ? 'not-allowed' : 'pointer',
    width: fullWidth ? '100%' : 'auto',
    whiteSpace: 'nowrap',
    transition: 'background var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard)',
    opacity: disabled ? 0.45 : 1,
    ...sizes[size],
    ...variants[variant]
  };
  const hoverStyle = !disabled && hover ? {
    primary: {
      background: 'var(--brand-primary-hover)',
      borderColor: 'var(--brand-primary-hover)'
    },
    accent: {
      background: 'var(--brand-accent-hover)',
      borderColor: 'var(--brand-accent-hover)'
    },
    secondary: {
      background: 'var(--brand-primary)',
      color: 'var(--text-inverse)'
    },
    ghost: {
      background: 'var(--navy-50)'
    }
  }[variant] : {};
  return /*#__PURE__*/React.createElement("button", _extends({
    type: type,
    disabled: disabled,
    onClick: onClick,
    onMouseEnter: () => setHover(true),
    onMouseLeave: () => setHover(false),
    style: {
      ...base,
      ...hoverStyle,
      ...style
    }
  }, rest), iconLeft, children, iconRight);
}
Object.assign(__ds_scope, { Button });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/forms/Button.jsx", error: String((e && e.message) || e) }); }

// components/forms/IconButton.jsx
try { (() => {
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
const sizes = {
  sm: 36,
  md: 44,
  lg: 52
};
function IconButton({
  children,
  label,
  variant = 'outline',
  size = 'md',
  active = false,
  disabled = false,
  onClick,
  style,
  ...rest
}) {
  const [hover, setHover] = React.useState(false);
  const dim = sizes[size];
  const variants = {
    outline: {
      background: active ? 'var(--brand-primary)' : 'var(--white)',
      color: active ? 'var(--white)' : 'var(--brand-primary)',
      border: '1px solid var(--border-default)'
    },
    solid: {
      background: 'var(--brand-primary)',
      color: 'var(--white)',
      border: '1px solid var(--brand-primary)'
    },
    ghost: {
      background: 'transparent',
      color: 'var(--text-body)',
      border: '1px solid transparent'
    }
  };
  return /*#__PURE__*/React.createElement("button", _extends({
    type: "button",
    "aria-label": label,
    title: label,
    disabled: disabled,
    onClick: onClick,
    onMouseEnter: () => setHover(true),
    onMouseLeave: () => setHover(false),
    style: {
      width: dim,
      height: dim,
      display: 'inline-flex',
      alignItems: 'center',
      justifyContent: 'center',
      borderRadius: 'var(--radius-sm)',
      cursor: disabled ? 'not-allowed' : 'pointer',
      opacity: disabled ? 0.45 : 1,
      transition: 'all var(--dur-fast) var(--ease-standard)',
      ...variants[variant],
      ...(hover && !disabled && !active ? {
        borderColor: 'var(--brand-primary)',
        color: 'var(--brand-primary)'
      } : {}),
      ...style
    }
  }, rest), children);
}
Object.assign(__ds_scope, { IconButton });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/forms/IconButton.jsx", error: String((e && e.message) || e) }); }

// components/forms/Input.jsx
try { (() => {
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function Input({
  label,
  id,
  type = 'text',
  placeholder,
  value,
  onChange,
  hint,
  error,
  required = false,
  disabled = false,
  iconLeft,
  style,
  ...rest
}) {
  const [focus, setFocus] = React.useState(false);
  const inputId = id || (label ? label.toLowerCase().replace(/\s+/g, '-') : undefined);
  return /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      flexDirection: 'column',
      gap: '6px',
      ...style
    }
  }, label && /*#__PURE__*/React.createElement("label", {
    htmlFor: inputId,
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: '12px',
      letterSpacing: '0.06em',
      textTransform: 'uppercase',
      color: 'var(--text-strong)'
    }
  }, label, required && /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'var(--danger-500)'
    }
  }, " *")), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'center',
      gap: '8px',
      height: 'var(--control-md)',
      padding: '0 14px',
      background: disabled ? 'var(--gray-50)' : 'var(--white)',
      border: '1px solid ' + (error ? 'var(--danger-500)' : focus ? 'var(--border-focus)' : 'var(--border-default)'),
      borderRadius: 'var(--radius-sm)',
      boxShadow: focus ? 'var(--shadow-focus)' : 'none',
      transition: 'border-color var(--dur-fast), box-shadow var(--dur-fast)'
    }
  }, iconLeft && /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'var(--text-muted)',
      display: 'inline-flex'
    }
  }, iconLeft), /*#__PURE__*/React.createElement("input", _extends({
    id: inputId,
    type: type,
    placeholder: placeholder,
    value: value,
    onChange: onChange,
    required: required,
    disabled: disabled,
    onFocus: () => setFocus(true),
    onBlur: () => setFocus(false),
    style: {
      flex: 1,
      border: 'none',
      outline: 'none',
      background: 'transparent',
      fontFamily: 'var(--font-body)',
      fontSize: '15px',
      color: 'var(--text-strong)',
      minWidth: 0
    }
  }, rest))), (hint || error) && /*#__PURE__*/React.createElement("span", {
    style: {
      fontSize: '12px',
      color: error ? 'var(--danger-500)' : 'var(--text-muted)'
    }
  }, error || hint));
}
Object.assign(__ds_scope, { Input });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/forms/Input.jsx", error: String((e && e.message) || e) }); }

// components/forms/QuantityStepper.jsx
try { (() => {
function QuantityStepper({
  value = 1,
  min = 1,
  max = 99,
  onChange,
  size = 'md',
  style
}) {
  const h = size === 'sm' ? 36 : 44;
  const set = v => {
    const n = Math.max(min, Math.min(max, v));
    onChange && onChange(n);
  };
  const btn = {
    width: h,
    height: h,
    border: 'none',
    background: 'transparent',
    fontFamily: 'var(--font-display)',
    fontSize: '18px',
    fontWeight: 700,
    color: 'var(--brand-primary)',
    cursor: 'pointer',
    lineHeight: 1
  };
  return /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'inline-flex',
      alignItems: 'center',
      border: '1px solid var(--border-default)',
      borderRadius: 'var(--radius-sm)',
      overflow: 'hidden',
      height: h,
      ...style
    }
  }, /*#__PURE__*/React.createElement("button", {
    type: "button",
    "aria-label": "\u039C\u03B5\u03AF\u03C9\u03C3\u03B7",
    style: btn,
    onClick: () => set(value - 1)
  }, "\u2212"), /*#__PURE__*/React.createElement("span", {
    style: {
      minWidth: 40,
      textAlign: 'center',
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: '15px',
      color: 'var(--text-strong)',
      borderLeft: '1px solid var(--border-subtle)',
      borderRight: '1px solid var(--border-subtle)',
      height: '100%',
      display: 'inline-flex',
      alignItems: 'center',
      justifyContent: 'center',
      padding: '0 6px'
    }
  }, value), /*#__PURE__*/React.createElement("button", {
    type: "button",
    "aria-label": "\u0391\u03CD\u03BE\u03B7\u03C3\u03B7",
    style: btn,
    onClick: () => set(value + 1)
  }, "+"));
}
Object.assign(__ds_scope, { QuantityStepper });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/forms/QuantityStepper.jsx", error: String((e && e.message) || e) }); }

// components/forms/Select.jsx
try { (() => {
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function Select({
  label,
  id,
  value,
  onChange,
  options = [],
  required = false,
  disabled = false,
  style,
  ...rest
}) {
  const [focus, setFocus] = React.useState(false);
  const selId = id || (label ? label.toLowerCase().replace(/\s+/g, '-') : undefined);
  return /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      flexDirection: 'column',
      gap: '6px',
      ...style
    }
  }, label && /*#__PURE__*/React.createElement("label", {
    htmlFor: selId,
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: '12px',
      letterSpacing: '0.06em',
      textTransform: 'uppercase',
      color: 'var(--text-strong)'
    }
  }, label, required && /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'var(--danger-500)'
    }
  }, " *")), /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'relative'
    }
  }, /*#__PURE__*/React.createElement("select", _extends({
    id: selId,
    value: value,
    onChange: onChange,
    disabled: disabled,
    required: required,
    onFocus: () => setFocus(true),
    onBlur: () => setFocus(false),
    style: {
      appearance: 'none',
      WebkitAppearance: 'none',
      width: '100%',
      height: 'var(--control-md)',
      padding: '0 40px 0 14px',
      background: disabled ? 'var(--gray-50)' : 'var(--white)',
      border: '1px solid ' + (focus ? 'var(--border-focus)' : 'var(--border-default)'),
      borderRadius: 'var(--radius-sm)',
      boxShadow: focus ? 'var(--shadow-focus)' : 'none',
      fontFamily: 'var(--font-body)',
      fontSize: '15px',
      color: 'var(--text-strong)',
      cursor: disabled ? 'not-allowed' : 'pointer',
      outline: 'none'
    }
  }, rest), options.map(o => {
    const val = typeof o === 'string' ? o : o.value;
    const lbl = typeof o === 'string' ? o : o.label;
    return /*#__PURE__*/React.createElement("option", {
      key: val,
      value: val
    }, lbl);
  })), /*#__PURE__*/React.createElement("span", {
    style: {
      position: 'absolute',
      right: '14px',
      top: '50%',
      transform: 'translateY(-50%)',
      pointerEvents: 'none',
      color: 'var(--text-muted)',
      fontSize: '12px'
    }
  }, "\u25BE")));
}
Object.assign(__ds_scope, { Select });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/forms/Select.jsx", error: String((e && e.message) || e) }); }

// components/layout/SectionHeader.jsx
try { (() => {
function SectionHeader({
  eyebrow,
  title,
  action,
  align = 'left',
  style
}) {
  return /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'flex-end',
      justifyContent: 'space-between',
      gap: '16px',
      flexWrap: 'wrap',
      textAlign: align,
      ...style
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      flexDirection: 'column',
      gap: '6px'
    }
  }, eyebrow && /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: '13px',
      letterSpacing: '0.12em',
      textTransform: 'uppercase',
      color: 'var(--brand-secondary)'
    }
  }, eyebrow), /*#__PURE__*/React.createElement("h2", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 'clamp(24px, 3vw, 34px)',
      lineHeight: 1.1,
      textTransform: 'uppercase',
      letterSpacing: '-0.02em',
      color: 'var(--text-strong)'
    }
  }, title)), action);
}
Object.assign(__ds_scope, { SectionHeader });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/layout/SectionHeader.jsx", error: String((e && e.message) || e) }); }

// components/navigation/Breadcrumb.jsx
try { (() => {
function Breadcrumb({
  items = [],
  style
}) {
  return /*#__PURE__*/React.createElement("nav", {
    "aria-label": "breadcrumb",
    style: {
      ...style
    }
  }, /*#__PURE__*/React.createElement("ol", {
    style: {
      display: 'flex',
      flexWrap: 'wrap',
      alignItems: 'center',
      gap: '8px',
      listStyle: 'none',
      margin: 0,
      padding: 0
    }
  }, items.map((it, i) => {
    const last = i === items.length - 1;
    return /*#__PURE__*/React.createElement("li", {
      key: i,
      style: {
        display: 'inline-flex',
        alignItems: 'center',
        gap: '8px'
      }
    }, last || !it.href ? /*#__PURE__*/React.createElement("span", {
      style: {
        fontFamily: 'var(--font-display)',
        fontWeight: 700,
        fontSize: '12px',
        letterSpacing: '0.06em',
        textTransform: 'uppercase',
        color: last ? 'var(--text-strong)' : 'var(--text-muted)'
      }
    }, it.label) : /*#__PURE__*/React.createElement("a", {
      href: it.href,
      style: {
        fontFamily: 'var(--font-display)',
        fontWeight: 700,
        fontSize: '12px',
        letterSpacing: '0.06em',
        textTransform: 'uppercase',
        color: 'var(--text-muted)'
      }
    }, it.label), !last && /*#__PURE__*/React.createElement("span", {
      style: {
        color: 'var(--gray-300)',
        fontSize: '11px'
      }
    }, "/"));
  })));
}
Object.assign(__ds_scope, { Breadcrumb });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/navigation/Breadcrumb.jsx", error: String((e && e.message) || e) }); }

// components/product/Badge.jsx
try { (() => {
const tones = {
  hivis: {
    background: 'var(--yellow-500)',
    color: 'var(--navy-900)'
  },
  new: {
    background: 'var(--navy-700)',
    color: 'var(--white)'
  },
  sale: {
    background: 'var(--sale-500)',
    color: 'var(--white)'
  },
  neutral: {
    background: 'var(--gray-100)',
    color: 'var(--gray-700)'
  },
  outline: {
    background: 'transparent',
    color: 'var(--navy-700)',
    border: '1px solid var(--navy-700)'
  }
};
function Badge({
  children,
  tone = 'neutral',
  size = 'md',
  style
}) {
  const pad = size === 'sm' ? '3px 8px' : '5px 11px';
  const fs = size === 'sm' ? '10px' : '11px';
  return /*#__PURE__*/React.createElement("span", {
    style: {
      display: 'inline-flex',
      alignItems: 'center',
      gap: '5px',
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: fs,
      letterSpacing: '0.1em',
      textTransform: 'uppercase',
      padding: pad,
      borderRadius: 'var(--radius-sm)',
      lineHeight: 1,
      whiteSpace: 'nowrap',
      ...tones[tone],
      ...style
    }
  }, children);
}
Object.assign(__ds_scope, { Badge });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/product/Badge.jsx", error: String((e && e.message) || e) }); }

// components/product/ColorSwatch.jsx
try { (() => {
function ColorSwatch({
  colors = [],
  selected,
  onSelect,
  size = 'md',
  style
}) {
  const dim = size === 'sm' ? 20 : 26;
  return /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: '8px',
      flexWrap: 'wrap',
      ...style
    }
  }, colors.map(c => {
    const val = typeof c === 'string' ? c : c.value;
    const label = typeof c === 'string' ? c : c.label || c.value;
    const isSel = selected === val;
    return /*#__PURE__*/React.createElement("button", {
      key: val,
      type: "button",
      title: label,
      "aria-label": label,
      onClick: () => onSelect && onSelect(val),
      style: {
        width: dim,
        height: dim,
        borderRadius: '50%',
        padding: 0,
        cursor: 'pointer',
        background: typeof c === 'string' ? c : c.hex || c.value,
        border: isSel ? '2px solid var(--navy-700)' : '1px solid var(--border-default)',
        outline: isSel ? '2px solid var(--white)' : 'none',
        outlineOffset: '-4px',
        boxShadow: isSel ? '0 0 0 1px var(--navy-700)' : 'none',
        transition: 'transform var(--dur-fast) var(--ease-standard)'
      }
    });
  }));
}
Object.assign(__ds_scope, { ColorSwatch });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/product/ColorSwatch.jsx", error: String((e && e.message) || e) }); }

// components/product/PriceTag.jsx
try { (() => {
function fmt(n) {
  return n.toLocaleString('el-GR', {
    minimumFractionDigits: 2,
    maximumFractionDigits: 2
  }) + ' €';
}
function PriceTag({
  price,
  compareAt,
  vatNote = 'χωρίς ΦΠΑ',
  size = 'md',
  style
}) {
  const onSale = compareAt && compareAt > price;
  const big = size === 'lg' ? '28px' : size === 'sm' ? '16px' : '20px';
  return /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      flexDirection: 'column',
      gap: '2px',
      ...style
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'baseline',
      gap: '10px',
      flexWrap: 'wrap'
    }
  }, onSale && /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-body)',
      fontSize: size === 'lg' ? '18px' : '14px',
      color: 'var(--text-muted)',
      textDecoration: 'line-through'
    }
  }, fmt(compareAt)), /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: big,
      color: onSale ? 'var(--sale-500)' : 'var(--text-strong)',
      lineHeight: 1
    }
  }, fmt(price))), vatNote && /*#__PURE__*/React.createElement("span", {
    style: {
      fontSize: '12px',
      color: 'var(--text-muted)'
    }
  }, vatNote));
}
Object.assign(__ds_scope, { PriceTag });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/product/PriceTag.jsx", error: String((e && e.message) || e) }); }

// components/product/ProductCard.jsx
try { (() => {
function ProductCard({
  image,
  title,
  brand,
  price,
  compareAt,
  badge,
  colors = [],
  sku,
  onSelect,
  ctaLabel = 'Επιλογή',
  style
}) {
  const [hover, setHover] = React.useState(false);
  return /*#__PURE__*/React.createElement("div", {
    onMouseEnter: () => setHover(true),
    onMouseLeave: () => setHover(false),
    style: {
      display: 'flex',
      flexDirection: 'column',
      background: 'var(--surface-card)',
      border: '1px solid var(--border-subtle)',
      borderRadius: 'var(--radius-md)',
      overflow: 'hidden',
      transition: 'box-shadow var(--dur-base), border-color var(--dur-base)',
      boxShadow: hover ? 'var(--shadow-md)' : 'none',
      borderColor: hover ? 'var(--border-default)' : 'var(--border-subtle)',
      ...style
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'relative',
      aspectRatio: '3/4',
      background: 'var(--gray-50)',
      overflow: 'hidden'
    }
  }, badge && /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'absolute',
      top: '10px',
      left: '10px',
      zIndex: 2
    }
  }, /*#__PURE__*/React.createElement(__ds_scope.Badge, {
    tone: badge.tone
  }, badge.label)), sku && /*#__PURE__*/React.createElement("span", {
    style: {
      position: 'absolute',
      top: '12px',
      right: '12px',
      zIndex: 2,
      fontFamily: 'var(--font-display)',
      fontSize: '11px',
      fontWeight: 700,
      color: 'var(--gray-400)'
    }
  }, sku), image ? /*#__PURE__*/React.createElement("img", {
    src: image,
    alt: title,
    style: {
      width: '100%',
      height: '100%',
      objectFit: 'cover',
      transition: 'transform var(--dur-slow) var(--ease-out)',
      transform: hover ? 'scale(1.04)' : 'scale(1)'
    }
  }) : /*#__PURE__*/React.createElement("div", {
    style: {
      width: '100%',
      height: '100%',
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'center',
      color: 'var(--gray-300)',
      fontFamily: 'var(--font-display)',
      fontWeight: 700
    }
  }, "WAW")), /*#__PURE__*/React.createElement("div", {
    style: {
      padding: '16px',
      display: 'flex',
      flexDirection: 'column',
      gap: '10px',
      flex: 1
    }
  }, brand && /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: '11px',
      letterSpacing: '0.1em',
      textTransform: 'uppercase',
      color: 'var(--brand-secondary)'
    }
  }, brand), /*#__PURE__*/React.createElement("h3", {
    style: {
      fontSize: '15px',
      fontWeight: 700,
      lineHeight: 1.25,
      color: 'var(--text-strong)',
      textTransform: 'uppercase',
      letterSpacing: '-0.01em'
    }
  }, title), colors.length > 0 && /*#__PURE__*/React.createElement(__ds_scope.ColorSwatch, {
    colors: colors,
    size: "sm"
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      marginTop: 'auto',
      display: 'flex',
      alignItems: 'flex-end',
      justifyContent: 'space-between',
      gap: '12px',
      paddingTop: '4px'
    }
  }, /*#__PURE__*/React.createElement(__ds_scope.PriceTag, {
    price: price,
    compareAt: compareAt,
    size: "md"
  }), /*#__PURE__*/React.createElement("button", {
    type: "button",
    onClick: onSelect,
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: '12px',
      letterSpacing: '0.08em',
      textTransform: 'uppercase',
      cursor: 'pointer',
      padding: '9px 14px',
      borderRadius: 'var(--radius-sm)',
      whiteSpace: 'nowrap',
      background: hover ? 'var(--brand-accent)' : 'var(--navy-700)',
      color: hover ? 'var(--navy-900)' : 'var(--white)',
      border: 'none',
      transition: 'all var(--dur-fast) var(--ease-standard)'
    }
  }, ctaLabel))));
}
Object.assign(__ds_scope, { ProductCard });
})(); } catch (e) { __ds_ns.__errors.push({ path: "components/product/ProductCard.jsx", error: String((e && e.message) || e) }); }

// ui_kits/storefront/App.jsx
try { (() => {
// App shell: routes home / listing / product, cart state, toast.
const {
  useState: useStateA
} = React;
function App() {
  const [screen, setScreen] = useStateA('home');
  const [current, setCurrent] = useStateA(null);
  const [cart, setCart] = useStateA([]);
  const [cartOpen, setCartOpen] = useStateA(false);
  const [toast, setToast] = useStateA(null);
  const go = s => {
    setScreen(s);
    window.scrollTo(0, 0);
  };
  const openProduct = p => {
    setCurrent(p);
    setScreen('product');
    window.scrollTo(0, 0);
  };
  const addToCart = (p, qty = 1, opts = {
    color: p.colors[0].value,
    size: 'M'
  }) => {
    setCart(c => {
      const key = p.id + opts.color + opts.size;
      const ex = c.find(i => i.key === key);
      if (ex) return c.map(i => i.key === key ? {
        ...i,
        qty: i.qty + qty
      } : i);
      return [...c, {
        ...p,
        key,
        qty,
        opts
      }];
    });
    setToast(p.title);
    setCartOpen(true);
    clearTimeout(window.__t);
    window.__t = setTimeout(() => setToast(null), 2600);
  };
  const setQty = (idx, v) => setCart(c => c.map((i, x) => x === idx ? {
    ...i,
    qty: v
  } : i));
  const removeItem = idx => setCart(c => c.filter((_, x) => x !== idx));
  const count = cart.reduce((s, i) => s + i.qty, 0);
  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(window.Header, {
    onNav: go,
    active: screen,
    cartCount: count,
    onCartClick: () => setCartOpen(true)
  }), screen === 'home' && /*#__PURE__*/React.createElement(window.Home, {
    onOpenProduct: openProduct,
    onAddToCart: addToCart,
    onNav: go
  }), screen === 'listing' && /*#__PURE__*/React.createElement(window.Listing, {
    onOpenProduct: openProduct,
    onNav: go
  }), screen === 'product' && current && /*#__PURE__*/React.createElement(window.Product, {
    product: current,
    onOpenProduct: openProduct,
    onAddToCart: addToCart,
    onNav: go
  }), /*#__PURE__*/React.createElement(window.Footer, null), /*#__PURE__*/React.createElement(window.Cart, {
    open: cartOpen,
    items: cart,
    onClose: () => setCartOpen(false),
    onQty: setQty,
    onRemove: removeItem,
    onNav: go
  }), toast && /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'fixed',
      bottom: 24,
      left: '50%',
      transform: 'translateX(-50%)',
      zIndex: 200,
      background: 'var(--navy-900)',
      color: '#fff',
      padding: '14px 20px',
      borderRadius: 6,
      boxShadow: 'var(--shadow-lg)',
      display: 'flex',
      alignItems: 'center',
      gap: 12,
      fontFamily: 'var(--font-body)',
      fontSize: 14,
      borderLeft: '3px solid var(--yellow-500)'
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'var(--yellow-400)',
      display: 'inline-flex'
    }
  }, /*#__PURE__*/React.createElement(window.Icon.Cart, {
    size: 18
  })), "\u03A0\u03C1\u03BF\u03C3\u03C4\u03AD\u03B8\u03B7\u03BA\u03B5 \u03C3\u03C4\u03BF \u03BA\u03B1\u03BB\u03AC\u03B8\u03B9: ", /*#__PURE__*/React.createElement("strong", null, toast)));
}
ReactDOM.createRoot(document.getElementById('root')).render(/*#__PURE__*/React.createElement(App, null));
})(); } catch (e) { __ds_ns.__errors.push({ path: "ui_kits/storefront/App.jsx", error: String((e && e.message) || e) }); }

// ui_kits/storefront/Cart.jsx
try { (() => {
// Slide-in mini-cart drawer.
const cartNS = window.WearAtWorkDesignSystem_a7f0e8;
function Cart({
  open,
  items,
  onClose,
  onQty,
  onRemove,
  onNav
}) {
  const {
    Button,
    QuantityStepper,
    PriceTag
  } = cartNS;
  const {
    Icon,
    eur
  } = window;
  const subtotal = items.reduce((s, i) => s + i.price * i.qty, 0);
  const freeAt = 80;
  const remaining = Math.max(0, freeAt - subtotal);
  return /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'fixed',
      inset: 0,
      zIndex: 100,
      pointerEvents: open ? 'auto' : 'none'
    }
  }, /*#__PURE__*/React.createElement("div", {
    onClick: onClose,
    style: {
      position: 'absolute',
      inset: 0,
      background: 'rgba(15,28,46,.5)',
      opacity: open ? 1 : 0,
      transition: 'opacity .25s'
    }
  }), /*#__PURE__*/React.createElement("aside", {
    style: {
      position: 'absolute',
      top: 0,
      right: 0,
      height: '100%',
      width: 420,
      maxWidth: '92vw',
      background: '#fff',
      display: 'flex',
      flexDirection: 'column',
      boxShadow: 'var(--shadow-lg)',
      transform: open ? 'translateX(0)' : 'translateX(100%)',
      transition: 'transform .28s cubic-bezier(0.2,0,0.1,1)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'space-between',
      padding: '20px 22px',
      borderBottom: '1px solid var(--border-subtle)'
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 16,
      textTransform: 'uppercase',
      letterSpacing: '.04em',
      color: 'var(--text-strong)'
    }
  }, "\u039A\u03B1\u03BB\u03AC\u03B8\u03B9 (", items.reduce((s, i) => s + i.qty, 0), ")"), /*#__PURE__*/React.createElement("button", {
    onClick: onClose,
    style: {
      border: 'none',
      background: 'none',
      cursor: 'pointer',
      color: 'var(--text-muted)',
      display: 'inline-flex'
    }
  }, /*#__PURE__*/React.createElement(Icon.X, {
    size: 22
  }))), subtotal > 0 && /*#__PURE__*/React.createElement("div", {
    style: {
      padding: '12px 22px',
      background: 'var(--navy-50)',
      borderBottom: '1px solid var(--border-subtle)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      fontSize: 13,
      color: 'var(--text-body)',
      marginBottom: 6
    }
  }, remaining > 0 ? /*#__PURE__*/React.createElement(React.Fragment, null, "\u03A0\u03C1\u03BF\u03C3\u03B8\u03AD\u03C3\u03C4\u03B5 ", /*#__PURE__*/React.createElement("strong", null, eur(remaining)), " \u03B3\u03B9\u03B1 \u03B4\u03C9\u03C1\u03B5\u03AC\u03BD \u03B1\u03C0\u03BF\u03C3\u03C4\u03BF\u03BB\u03AE") : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("strong", null, "\u039A\u03B5\u03C1\u03B4\u03AF\u03C3\u03B1\u03C4\u03B5 \u03B4\u03C9\u03C1\u03B5\u03AC\u03BD \u03B1\u03C0\u03BF\u03C3\u03C4\u03BF\u03BB\u03AE! \uD83C\uDF89"))), /*#__PURE__*/React.createElement("div", {
    style: {
      height: 6,
      borderRadius: 999,
      background: 'var(--gray-200)',
      overflow: 'hidden'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      height: '100%',
      width: Math.min(100, subtotal / freeAt * 100) + '%',
      background: 'var(--yellow-500)'
    }
  }))), /*#__PURE__*/React.createElement("div", {
    style: {
      flex: 1,
      overflowY: 'auto',
      padding: '8px 0'
    }
  }, items.length === 0 && /*#__PURE__*/React.createElement("div", {
    style: {
      padding: '60px 22px',
      textAlign: 'center',
      color: 'var(--text-muted)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'inline-flex',
      color: 'var(--gray-300)',
      marginBottom: 12
    }
  }, /*#__PURE__*/React.createElement(Icon.Cart, {
    size: 40
  })), /*#__PURE__*/React.createElement("p", {
    style: {
      margin: 0,
      fontSize: 15
    }
  }, "\u03A4\u03BF \u03BA\u03B1\u03BB\u03AC\u03B8\u03B9 \u03C3\u03B1\u03C2 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03AC\u03B4\u03B5\u03B9\u03BF.")), items.map((it, idx) => /*#__PURE__*/React.createElement("div", {
    key: idx,
    style: {
      display: 'flex',
      gap: 14,
      padding: '16px 22px',
      borderBottom: '1px solid var(--border-subtle)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      width: 66,
      height: 82,
      borderRadius: 4,
      overflow: 'hidden',
      background: 'var(--gray-50)',
      flexShrink: 0,
      border: '1px solid var(--border-subtle)'
    }
  }, /*#__PURE__*/React.createElement("img", {
    src: it.image,
    alt: "",
    style: {
      width: '100%',
      height: '100%',
      objectFit: 'cover'
    }
  })), /*#__PURE__*/React.createElement("div", {
    style: {
      flex: 1,
      minWidth: 0
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 13,
      textTransform: 'uppercase',
      lineHeight: 1.25,
      color: 'var(--text-strong)'
    }
  }, it.title), /*#__PURE__*/React.createElement("div", {
    style: {
      fontSize: 12,
      color: 'var(--text-muted)',
      margin: '3px 0 8px'
    }
  }, it.opts.size, " \xB7 ", (it.colors.find(c => c.value === it.opts.color) || {}).label), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'space-between',
      gap: 8
    }
  }, /*#__PURE__*/React.createElement(QuantityStepper, {
    value: it.qty,
    size: "sm",
    onChange: v => onQty(idx, v)
  }), /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 15,
      color: 'var(--text-strong)'
    }
  }, eur(it.price * it.qty)))), /*#__PURE__*/React.createElement("button", {
    onClick: () => onRemove(idx),
    style: {
      border: 'none',
      background: 'none',
      cursor: 'pointer',
      color: 'var(--gray-400)',
      alignSelf: 'flex-start',
      display: 'inline-flex'
    }
  }, /*#__PURE__*/React.createElement(Icon.X, {
    size: 16
  }))))), items.length > 0 && /*#__PURE__*/React.createElement("div", {
    style: {
      padding: '20px 22px',
      borderTop: '1px solid var(--border-subtle)',
      display: 'flex',
      flexDirection: 'column',
      gap: 14
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'baseline',
      justifyContent: 'space-between'
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 13,
      letterSpacing: '.06em',
      textTransform: 'uppercase',
      color: 'var(--text-body)'
    }
  }, "\u03A3\u03CD\u03BD\u03BF\u03BB\u03BF"), /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 24,
      color: 'var(--text-strong)'
    }
  }, eur(subtotal))), /*#__PURE__*/React.createElement("span", {
    style: {
      fontSize: 12,
      color: 'var(--text-muted)',
      marginTop: -8
    }
  }, "\u039F\u03B9 \u03C4\u03B9\u03BC\u03AD\u03C2 \u03C0\u03B5\u03C1\u03B9\u03BB\u03B1\u03BC\u03B2\u03AC\u03BD\u03BF\u03C5\u03BD \u03A6\u03A0\u0391 24%"), /*#__PURE__*/React.createElement(Button, {
    variant: "accent",
    size: "lg",
    fullWidth: true,
    iconRight: /*#__PURE__*/React.createElement(Icon.ArrowR, {
      size: 18
    })
  }, "\u039F\u03BB\u03BF\u03BA\u03BB\u03AE\u03C1\u03C9\u03C3\u03B7 \u03C0\u03B1\u03C1\u03B1\u03B3\u03B3\u03B5\u03BB\u03AF\u03B1\u03C2"), /*#__PURE__*/React.createElement(Button, {
    variant: "ghost",
    onClick: onClose
  }, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1 \u03B1\u03B3\u03BF\u03C1\u03CE\u03BD"))));
}
window.Cart = Cart;
})(); } catch (e) { __ds_ns.__errors.push({ path: "ui_kits/storefront/Cart.jsx", error: String((e && e.message) || e) }); }

// ui_kits/storefront/Footer.jsx
try { (() => {
// Storefront footer: newsletter, nav columns, brand strip.
function Footer() {
  const {
    Icon
  } = window;
  const col = (title, links) => React.createElement('div', {
    style: {
      display: 'flex',
      flexDirection: 'column',
      gap: 12
    }
  }, React.createElement('h4', {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 13,
      letterSpacing: '.1em',
      textTransform: 'uppercase',
      color: '#fff'
    }
  }, title), ...links.map(l => React.createElement('a', {
    key: l,
    href: '#',
    style: {
      color: 'rgba(255,255,255,.68)',
      fontSize: 14
    }
  }, l)));
  return /*#__PURE__*/React.createElement("footer", {
    style: {
      background: 'var(--navy-900)',
      color: '#fff',
      fontFamily: 'var(--font-body)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      borderBottom: '1px solid rgba(255,255,255,.1)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      maxWidth: 1280,
      margin: '0 auto',
      padding: '32px 24px',
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'space-between',
      gap: 24,
      flexWrap: 'wrap'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      maxWidth: 520
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 22,
      textTransform: 'uppercase',
      letterSpacing: '-.01em'
    }
  }, "\u039A\u03B5\u03C1\u03B4\u03AF\u03C3\u03C4\u03B5 \u03AD\u03BA\u03C0\u03C4\u03C9\u03C3\u03B7 10%"), /*#__PURE__*/React.createElement("div", {
    style: {
      color: 'rgba(255,255,255,.7)',
      fontSize: 14,
      marginTop: 4
    }
  }, "\u0395\u03BD\u03B7\u03BC\u03B5\u03C1\u03C9\u03B8\u03B5\u03AF\u03C4\u03B5 \u03C0\u03C1\u03CE\u03C4\u03BF\u03B9 \u03B3\u03B9\u03B1 \u03B1\u03C0\u03BF\u03BA\u03BB\u03B5\u03B9\u03C3\u03C4\u03B9\u03BA\u03AD\u03C2 \u03C0\u03C1\u03BF\u03C3\u03C6\u03BF\u03C1\u03AD\u03C2 \u03C3\u03C4\u03B7\u03BD \u03C0\u03C1\u03CE\u03C4\u03B7 \u03C3\u03B1\u03C2 \u03C0\u03B1\u03C1\u03B1\u03B3\u03B3\u03B5\u03BB\u03AF\u03B1.")), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 10,
      minWidth: 320,
      flex: 1,
      maxWidth: 440
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      flex: 1,
      display: 'flex',
      alignItems: 'center',
      height: 48,
      background: '#fff',
      borderRadius: 3,
      padding: '0 14px'
    }
  }, /*#__PURE__*/React.createElement("input", {
    placeholder: "Email",
    style: {
      flex: 1,
      border: 'none',
      outline: 'none',
      fontSize: 14,
      fontFamily: 'var(--font-body)',
      color: 'var(--text-strong)'
    }
  })), /*#__PURE__*/React.createElement("button", {
    style: {
      height: 48,
      padding: '0 24px',
      background: 'var(--yellow-500)',
      color: 'var(--navy-900)',
      border: 'none',
      cursor: 'pointer',
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 13,
      letterSpacing: '.08em',
      textTransform: 'uppercase',
      borderRadius: 3
    }
  }, "\u0395\u03B3\u03B3\u03C1\u03B1\u03C6\u03AE")))), /*#__PURE__*/React.createElement("div", {
    style: {
      maxWidth: 1280,
      margin: '0 auto',
      padding: '40px 24px',
      display: 'grid',
      gridTemplateColumns: '1.6fr 1fr 1fr 1fr',
      gap: 32
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      flexDirection: 'column',
      gap: 14
    }
  }, /*#__PURE__*/React.createElement("img", {
    src: "../../assets/logo-white.png",
    alt: "Wear At Work",
    style: {
      height: 30,
      alignSelf: 'flex-start'
    }
  }), /*#__PURE__*/React.createElement("p", {
    style: {
      color: 'rgba(255,255,255,.68)',
      fontSize: 14,
      lineHeight: 1.6,
      margin: 0,
      maxWidth: 280
    }
  }, "\u03A6\u03C4\u03B9\u03B1\u03B3\u03BC\u03AD\u03BD\u03B1 \u03B3\u03B9\u03B1 \u03B4\u03BF\u03C5\u03BB\u03B5\u03B9\u03AC. \u03A4\u03B1\u03B9\u03C1\u03B9\u03B1\u03C3\u03C4\u03AC \u03C3\u03C4\u03B7\u03BD \u03BA\u03B1\u03B8\u03B7\u03BC\u03B5\u03C1\u03B9\u03BD\u03CC\u03C4\u03B7\u03C4\u03B1."), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 10,
      color: 'rgba(255,255,255,.6)',
      fontSize: 13,
      alignItems: 'center'
    }
  }, /*#__PURE__*/React.createElement(Icon.Shield, {
    size: 16
  }), " \u039A\u03CD\u03C0\u03C1\u03BF\u03C5 3 & \u0395\u03B8\u03BD\u03B9\u03BA\u03AE\u03C2 \u0391\u03BD\u03C4\u03B9\u03C3\u03C4\u03AC\u03C3\u03B5\u03C9\u03C2, \u0386\u03B3\u03B9\u03BF\u03C2 \u0394\u03B7\u03BC\u03AE\u03C4\u03C1\u03B9\u03BF\u03C2 172 36")), col('Πλοήγηση', ['Αρχική', 'Σχετικά με μας', 'Οδηγός προϊόντων', 'Βιωσιμότητα', 'Επικοινωνία']), col('Κατάστημα', ['Ανδρικά', 'Γυναικεία', 'Αξεσουάρ', 'Υπόδηση', 'Outlet']), col('Χρήσιμα', ['Πληροφορίες αποστολών', 'Πληροφορίες πληρωμών', 'Πολιτική επιστροφών', 'Όροι χρήσης', 'Δήλωση απορρήτου'])), /*#__PURE__*/React.createElement("div", {
    style: {
      borderTop: '1px solid rgba(255,255,255,.1)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      maxWidth: 1280,
      margin: '0 auto',
      padding: '18px 24px',
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'space-between',
      gap: 16,
      flexWrap: 'wrap'
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'rgba(255,255,255,.5)',
      fontSize: 13
    }
  }, "\xA9 2025 Wear at Work. All rights reserved."), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 8
    }
  }, ['VISA', 'MASTERCARD', 'AMEX', 'PAYPAL', 'IRIS'].map(p => /*#__PURE__*/React.createElement("span", {
    key: p,
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 10,
      letterSpacing: '.05em',
      color: 'var(--navy-900)',
      background: '#fff',
      padding: '5px 9px',
      borderRadius: 3
    }
  }, p))))));
}
window.Footer = Footer;
})(); } catch (e) { __ds_ns.__errors.push({ path: "ui_kits/storefront/Footer.jsx", error: String((e && e.message) || e) }); }

// ui_kits/storefront/Header.jsx
try { (() => {
// Storefront header: utility bar + logo + primary nav + actions.
const {
  useState
} = React;
const NS = window.WearAtWorkDesignSystem_a7f0e8;
function Header({
  onNav,
  cartCount,
  onCartClick,
  active
}) {
  const {
    Icon
  } = window;
  const [q, setQ] = useState('');
  const util = {
    display: 'flex',
    alignItems: 'center',
    justifyContent: 'center',
    gap: 24,
    height: 36,
    background: 'var(--navy-900)',
    color: 'rgba(255,255,255,.82)',
    fontSize: 12.5,
    letterSpacing: '.02em'
  };
  const utilItem = {
    display: 'inline-flex',
    alignItems: 'center',
    gap: 7
  };
  const iconBtn = {
    display: 'inline-flex',
    alignItems: 'center',
    justifyContent: 'center',
    width: 40,
    height: 40,
    color: '#fff',
    background: 'transparent',
    border: 'none',
    cursor: 'pointer',
    position: 'relative'
  };
  return /*#__PURE__*/React.createElement("header", {
    style: {
      position: 'sticky',
      top: 0,
      zIndex: 50,
      fontFamily: 'var(--font-body)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: util
  }, /*#__PURE__*/React.createElement("span", {
    style: utilItem
  }, /*#__PURE__*/React.createElement(Icon.Truck, {
    size: 15
  }), " \u0386\u03BC\u03B5\u03C3\u03B7 \u03B1\u03C0\u03BF\u03C3\u03C4\u03BF\u03BB\u03AE \u03C3\u03B5 24-48\u03C9"), /*#__PURE__*/React.createElement("span", {
    style: utilItem
  }, /*#__PURE__*/React.createElement(Icon.Rotate, {
    size: 14
  }), " \u0394\u03C9\u03C1\u03B5\u03AC\u03BD \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03BF\u03C6\u03AE 30 \u03B7\u03BC\u03B5\u03C1\u03CE\u03BD"), /*#__PURE__*/React.createElement("span", {
    style: utilItem
  }, "+30 210 9704488")), /*#__PURE__*/React.createElement("div", {
    style: {
      background: 'var(--navy-700)',
      borderBottom: '3px solid var(--yellow-500)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      maxWidth: 1280,
      margin: '0 auto',
      padding: '0 24px',
      height: 76,
      display: 'flex',
      alignItems: 'center',
      gap: 28
    }
  }, /*#__PURE__*/React.createElement("a", {
    href: "#",
    onClick: e => {
      e.preventDefault();
      onNav('home');
    },
    style: {
      display: 'flex',
      alignItems: 'center'
    }
  }, /*#__PURE__*/React.createElement("img", {
    src: "../../assets/logo-white.png",
    alt: "Wear At Work",
    style: {
      height: 34
    }
  })), /*#__PURE__*/React.createElement("div", {
    style: {
      flex: 1,
      display: 'flex',
      alignItems: 'center',
      height: 44,
      background: '#fff',
      borderRadius: 3,
      padding: '0 14px',
      gap: 10,
      maxWidth: 520
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'var(--gray-400)'
    }
  }, /*#__PURE__*/React.createElement(Icon.Search, {
    size: 18
  })), /*#__PURE__*/React.createElement("input", {
    value: q,
    onChange: e => setQ(e.target.value),
    placeholder: "\u0391\u03BD\u03B1\u03B6\u03AE\u03C4\u03B7\u03C3\u03B7 \u03C0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03C9\u03BD, brands, \u03BA\u03C9\u03B4\u03B9\u03BA\u03CE\u03BD\u2026",
    style: {
      flex: 1,
      border: 'none',
      outline: 'none',
      fontFamily: 'var(--font-body)',
      fontSize: 14,
      color: 'var(--text-strong)'
    }
  })), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'center',
      gap: 4,
      marginLeft: 'auto'
    }
  }, /*#__PURE__*/React.createElement("button", {
    style: iconBtn,
    title: "\u039B\u03BF\u03B3\u03B1\u03C1\u03B9\u03B1\u03C3\u03BC\u03CC\u03C2"
  }, /*#__PURE__*/React.createElement(Icon.User, {
    size: 21
  })), /*#__PURE__*/React.createElement("button", {
    style: iconBtn,
    title: "\u0391\u03B3\u03B1\u03C0\u03B7\u03BC\u03AD\u03BD\u03B1"
  }, /*#__PURE__*/React.createElement(Icon.Heart, {
    size: 21
  })), /*#__PURE__*/React.createElement("button", {
    style: iconBtn,
    title: "\u039A\u03B1\u03BB\u03AC\u03B8\u03B9",
    onClick: onCartClick
  }, /*#__PURE__*/React.createElement(Icon.Cart, {
    size: 21
  }), cartCount > 0 && /*#__PURE__*/React.createElement("span", {
    style: {
      position: 'absolute',
      top: 4,
      right: 2,
      minWidth: 18,
      height: 18,
      padding: '0 4px',
      background: 'var(--yellow-500)',
      color: 'var(--navy-900)',
      borderRadius: 999,
      fontSize: 11,
      fontWeight: 800,
      fontFamily: 'var(--font-display)',
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'center'
    }
  }, cartCount))))), /*#__PURE__*/React.createElement("nav", {
    style: {
      background: 'var(--navy-800)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      maxWidth: 1280,
      margin: '0 auto',
      padding: '0 24px',
      display: 'flex',
      alignItems: 'center',
      gap: 2,
      height: 48
    }
  }, /*#__PURE__*/React.createElement("button", {
    onClick: () => onNav('listing'),
    style: {
      display: 'inline-flex',
      alignItems: 'center',
      gap: 8,
      height: '100%',
      padding: '0 16px',
      background: 'var(--yellow-500)',
      color: 'var(--navy-900)',
      border: 'none',
      cursor: 'pointer',
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 13,
      letterSpacing: '.08em',
      textTransform: 'uppercase'
    }
  }, /*#__PURE__*/React.createElement(window.Icon.Menu, {
    size: 17
  }), " \u03A0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03B1"), window.NAV.map(n => /*#__PURE__*/React.createElement("button", {
    key: n,
    onClick: () => onNav('listing'),
    style: {
      height: '100%',
      padding: '0 15px',
      background: 'transparent',
      border: 'none',
      cursor: 'pointer',
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 12.5,
      letterSpacing: '.06em',
      textTransform: 'uppercase',
      color: active === 'listing' && n === 'Hi-Vis' ? 'var(--yellow-400)' : 'rgba(255,255,255,.9)'
    }
  }, n)))));
}
window.Header = Header;
})(); } catch (e) { __ds_ns.__errors.push({ path: "ui_kits/storefront/Header.jsx", error: String((e && e.message) || e) }); }

// ui_kits/storefront/Home.jsx
try { (() => {
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
// Homepage: hero, hi-vis grid, editorial band, brand strip.
const homeNS = window.WearAtWorkDesignSystem_a7f0e8;
function Home({
  onOpenProduct,
  onAddToCart,
  onNav
}) {
  const {
    ProductCard,
    Button,
    SectionHeader,
    Badge
  } = homeNS;
  const {
    Icon
  } = window;
  const wrap = {
    maxWidth: 1280,
    margin: '0 auto',
    padding: '0 24px'
  };
  const featured = window.PRODUCTS.slice(0, 4);
  return /*#__PURE__*/React.createElement("main", {
    style: {
      fontFamily: 'var(--font-body)',
      background: 'var(--surface-page)'
    }
  }, /*#__PURE__*/React.createElement("section", {
    style: {
      background: 'var(--navy-700)',
      color: '#fff',
      position: 'relative',
      overflow: 'hidden'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'absolute',
      inset: 0,
      background: 'linear-gradient(115deg, var(--navy-800) 0%, var(--navy-700) 55%, var(--navy-600) 100%)'
    }
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'absolute',
      top: -80,
      right: -40,
      width: 520,
      height: '140%',
      background: 'var(--yellow-500)',
      opacity: .12,
      transform: 'skewX(-12deg)'
    }
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'absolute',
      top: -80,
      right: 120,
      width: 120,
      height: '140%',
      background: 'var(--yellow-500)',
      opacity: .12,
      transform: 'skewX(-12deg)'
    }
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      ...wrap,
      position: 'relative',
      padding: '72px 24px 80px'
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 14,
      letterSpacing: '.16em',
      textTransform: 'uppercase',
      color: 'var(--yellow-400)'
    }
  }, "Inspiring Workwear"), /*#__PURE__*/React.createElement("h1", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 900,
      fontSize: 'clamp(40px,6vw,76px)',
      lineHeight: 1,
      textTransform: 'uppercase',
      letterSpacing: '-.02em',
      margin: '16px 0 0',
      maxWidth: 820
    }
  }, "\u0391\u03BD\u03B1\u03B4\u03B5\u03AF\u03BE\u03C4\u03B5", /*#__PURE__*/React.createElement("br", null), "\u03C4\u03B7\u03BD \u03B1\u03BE\u03AF\u03B1 \u03C3\u03B1\u03C2"), /*#__PURE__*/React.createElement("p", {
    style: {
      fontSize: 20,
      lineHeight: 1.5,
      margin: '20px 0 32px',
      maxWidth: 540,
      color: 'rgba(255,255,255,.85)'
    }
  }, "\u039C\u03B5\u03AF\u03BD\u03B5\u03C4\u03B5 ", /*#__PURE__*/React.createElement("strong", {
    style: {
      color: '#fff'
    }
  }, "\u03B1\u03C3\u03C6\u03B1\u03BB\u03AE\u03C2"), " \u03BA\u03B1\u03B9 \u03BA\u03B5\u03C1\u03B4\u03AF\u03C3\u03C4\u03B5 \u03C4\u03B9\u03C2 ", /*#__PURE__*/React.createElement("strong", {
    style: {
      color: '#fff'
    }
  }, "\u03B5\u03BD\u03C4\u03C5\u03C0\u03CE\u03C3\u03B5\u03B9\u03C2"), ". \u03A1\u03BF\u03CD\u03C7\u03B1 \u03B5\u03C1\u03B3\u03B1\u03C3\u03AF\u03B1\u03C2 \u03B3\u03B9\u03B1 \u03B5\u03C0\u03B1\u03B3\u03B3\u03B5\u03BB\u03BC\u03B1\u03C4\u03AF\u03B5\u03C2 \u03C0\u03BF\u03C5 \u03B8\u03AD\u03BB\u03BF\u03C5\u03BD \u03BD\u03B1 \u03BE\u03B5\u03C7\u03C9\u03C1\u03AF\u03B6\u03BF\u03C5\u03BD."), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 12,
      flexWrap: 'wrap'
    }
  }, /*#__PURE__*/React.createElement(Button, {
    variant: "accent",
    size: "lg",
    onClick: () => onNav('listing'),
    iconRight: /*#__PURE__*/React.createElement(Icon.ArrowR, {
      size: 18
    })
  }, "\u0388\u03BD\u03B4\u03C5\u03C3\u03B7"), /*#__PURE__*/React.createElement(Button, {
    variant: "secondary",
    size: "lg",
    onClick: () => onNav('listing'),
    style: {
      color: '#fff',
      borderColor: 'rgba(255,255,255,.5)'
    }
  }, "\u03A5\u03C0\u03CC\u03B4\u03B7\u03C3\u03B7"), /*#__PURE__*/React.createElement(Button, {
    variant: "ghost",
    size: "lg",
    onClick: () => onNav('listing'),
    style: {
      color: '#fff'
    }
  }, "\u0391\u03BE\u03B5\u03C3\u03BF\u03C5\u03AC\u03C1")))), /*#__PURE__*/React.createElement("section", {
    style: {
      ...wrap,
      padding: '64px 24px'
    }
  }, /*#__PURE__*/React.createElement(SectionHeader, {
    eyebrow: "Hi-Vis \xB7 \u03A5\u03C8\u03B7\u03BB\u03AE \u03B4\u03B9\u03B1\u03BA\u03C1\u03B9\u03C4\u03CC\u03C4\u03B7\u03C4\u03B1",
    title: "\u039D\u03AD\u03B1 \u03C0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03B1",
    action: /*#__PURE__*/React.createElement(Button, {
      variant: "ghost",
      onClick: () => onNav('listing'),
      iconRight: /*#__PURE__*/React.createElement(Icon.ChevronR, {
        size: 16
      })
    }, "\u0394\u03B5\u03AF\u03C4\u03B5 \u03CC\u03BB\u03B1")
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'grid',
      gridTemplateColumns: 'repeat(4,1fr)',
      gap: 20,
      marginTop: 28
    }
  }, featured.map(p => /*#__PURE__*/React.createElement(ProductCard, _extends({
    key: p.id
  }, p, {
    onSelect: () => onOpenProduct(p)
  }))))), /*#__PURE__*/React.createElement("section", {
    style: {
      background: 'var(--navy-900)',
      color: '#fff'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      ...wrap,
      padding: '56px 24px',
      display: 'grid',
      gridTemplateColumns: '1fr 1fr',
      gap: 48,
      alignItems: 'center'
    }
  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 13,
      letterSpacing: '.14em',
      textTransform: 'uppercase',
      color: 'var(--yellow-400)'
    }
  }, "\u03A0\u03B1\u03AF\u03B6\u03B5\u03B9 \u03C1\u03CC\u03BB\u03BF"), /*#__PURE__*/React.createElement("h2", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 34,
      lineHeight: 1.1,
      textTransform: 'uppercase',
      letterSpacing: '-.02em',
      margin: '12px 0 14px'
    }
  }, "\u0394\u03CE\u03C3\u03C4\u03B5 \u03C4\u03B7\u03BD \u03BA\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03B7 \u03C0\u03C1\u03CE\u03C4\u03B7 \u03B5\u03BD\u03C4\u03CD\u03C0\u03C9\u03C3\u03B7"), /*#__PURE__*/React.createElement("p", {
    style: {
      fontSize: 16,
      lineHeight: 1.65,
      color: 'rgba(255,255,255,.78)',
      margin: '0 0 24px',
      maxWidth: 460
    }
  }, "\u0395\u03BD\u03B9\u03C3\u03C7\u03CD\u03C3\u03C4\u03B5 \u03C4\u03B7\u03BD \u03B1\u03C5\u03C4\u03BF\u03C0\u03B5\u03C0\u03BF\u03AF\u03B8\u03B7\u03C3\u03AE \u03C3\u03B1\u03C2 \u03BC\u03B5 \u03C1\u03BF\u03CD\u03C7\u03B1 \u03B5\u03C1\u03B3\u03B1\u03C3\u03AF\u03B1\u03C2 \u03C0\u03BF\u03C5 \u03B1\u03BD\u03B1\u03B4\u03B5\u03B9\u03BA\u03BD\u03CD\u03BF\u03C5\u03BD \u03C4\u03BF\u03BD \u03B5\u03C0\u03B1\u03B3\u03B3\u03B5\u03BB\u03BC\u03B1\u03C4\u03B9\u03C3\u03BC\u03CC \u03C3\u03B1\u03C2 \u03BC\u03B5 \u03C4\u03B7\u03BD \u03C0\u03C1\u03CE\u03C4\u03B7 \u03BC\u03B1\u03C4\u03B9\u03AC."), /*#__PURE__*/React.createElement(Button, {
    variant: "accent",
    onClick: () => onNav('listing')
  }, "\u0391\u03BD\u03B1\u03BA\u03B1\u03BB\u03CD\u03C8\u03C4\u03B5")), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'grid',
      gridTemplateColumns: '1fr 1fr',
      gap: 16
    }
  }, [['Άμεση αποστολή', '24-48 ώρες σε όλη την Ελλάδα', /*#__PURE__*/React.createElement(Icon.Truck, {
    size: 24
  })], ['Δωρεάν επιστροφή', '30 ημέρες, χωρίς ερωτήσεις', /*#__PURE__*/React.createElement(Icon.Rotate, {
    size: 22
  })], ['Πιστοποιημένα', 'EN ISO πρότυπα ασφαλείας', /*#__PURE__*/React.createElement(Icon.Shield, {
    size: 22
  })], ['12+ Brands', 'Helly Hansen, Projob, Puma…', /*#__PURE__*/React.createElement(Icon.Star, {
    size: 20
  })]].map(([t, d, ic], i) => /*#__PURE__*/React.createElement("div", {
    key: i,
    style: {
      background: 'rgba(255,255,255,.04)',
      border: '1px solid rgba(255,255,255,.1)',
      borderRadius: 6,
      padding: '20px'
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'var(--yellow-400)',
      display: 'inline-flex'
    }
  }, ic), /*#__PURE__*/React.createElement("div", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 15,
      textTransform: 'uppercase',
      letterSpacing: '.02em',
      margin: '10px 0 4px'
    }
  }, t), /*#__PURE__*/React.createElement("div", {
    style: {
      fontSize: 13,
      color: 'rgba(255,255,255,.6)'
    }
  }, d)))))), /*#__PURE__*/React.createElement("section", {
    style: {
      ...wrap,
      padding: '64px 24px'
    }
  }, /*#__PURE__*/React.createElement(SectionHeader, {
    eyebrow: "\u03A5\u03C0\u03CC\u03B4\u03B7\u03C3\u03B7",
    title: "\u0391\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1 \u03B1\u03C0\u03CC \u03C4\u03BF \u03C0\u03C1\u03CE\u03C4\u03BF \u03B2\u03AE\u03BC\u03B1",
    action: /*#__PURE__*/React.createElement(Button, {
      variant: "ghost",
      onClick: () => onNav('listing'),
      iconRight: /*#__PURE__*/React.createElement(Icon.ChevronR, {
        size: 16
      })
    }, "\u0394\u03B5\u03AF\u03C4\u03B5 \u03C4\u03B1 \u03CC\u03BB\u03B1")
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'grid',
      gridTemplateColumns: 'repeat(4,1fr)',
      gap: 20,
      marginTop: 28
    }
  }, window.PRODUCTS.slice(4, 8).map(p => /*#__PURE__*/React.createElement(ProductCard, _extends({
    key: p.id
  }, p, {
    onSelect: () => onOpenProduct(p)
  }))))), /*#__PURE__*/React.createElement("section", {
    style: {
      borderTop: '1px solid var(--border-subtle)',
      background: 'var(--surface-subtle)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      ...wrap,
      padding: '40px 24px'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      textAlign: 'center',
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 13,
      letterSpacing: '.14em',
      textTransform: 'uppercase',
      color: 'var(--brand-secondary)',
      marginBottom: 24
    }
  }, "Brands \u03C0\u03BF\u03C5 \u03B5\u03BC\u03C0\u03B9\u03C3\u03C4\u03B5\u03CD\u03B5\u03C3\u03C4\u03B5"), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 14,
      justifyContent: 'center',
      flexWrap: 'wrap'
    }
  }, ['Helly Hansen', 'Projob', 'Shoes For Crews', 'Reebok', 'Puma', 'Guardio', 'Petzl', 'Salomon', 'Skylotec', 'Tegera', 'Monitor', 'Mozo'].map(b => /*#__PURE__*/React.createElement("span", {
    key: b,
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 14,
      letterSpacing: '.04em',
      color: 'var(--navy-600)',
      background: '#fff',
      border: '1px solid var(--border-subtle)',
      padding: '10px 16px',
      borderRadius: 4
    }
  }, b))))));
}
window.Home = Home;
})(); } catch (e) { __ds_ns.__errors.push({ path: "ui_kits/storefront/Home.jsx", error: String((e && e.message) || e) }); }

// ui_kits/storefront/Icons.jsx
try { (() => {
// Line icons (Lucide, ISC-licensed path data) — matches the site's thin-stroke SVG style.
const React = window.React;
function Svg({
  size = 20,
  children,
  ...p
}) {
  return React.createElement('svg', {
    width: size,
    height: size,
    viewBox: '0 0 24 24',
    fill: 'none',
    stroke: 'currentColor',
    strokeWidth: 1.75,
    strokeLinecap: 'round',
    strokeLinejoin: 'round',
    ...p
  }, children);
}
const P = d => React.createElement('path', {
  d,
  key: d
});
const El = (t, a) => React.createElement(t, {
  ...a,
  key: t + JSON.stringify(a)
});
const Icon = {
  Search: p => React.createElement(Svg, p, [El('circle', {
    cx: 11,
    cy: 11,
    r: 8
  }), P('m21 21-4.3-4.3')]),
  User: p => React.createElement(Svg, p, [P('M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2'), El('circle', {
    cx: 12,
    cy: 7,
    r: 4
  })]),
  Heart: p => React.createElement(Svg, p, [P('M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.29 1.51 4.04 3 5.5l7 7Z')]),
  Cart: p => React.createElement(Svg, p, [El('circle', {
    cx: 8,
    cy: 21,
    r: 1
  }), El('circle', {
    cx: 19,
    cy: 21,
    r: 1
  }), P('M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12')]),
  Menu: p => React.createElement(Svg, p, [P('M4 6h16'), P('M4 12h16'), P('M4 18h16')]),
  Chevron: p => React.createElement(Svg, p, [P('m6 9 6 6 6-6')]),
  ChevronR: p => React.createElement(Svg, p, [P('m9 18 6-6-6-6')]),
  ArrowR: p => React.createElement(Svg, p, [P('M5 12h14'), P('m12 5 7 7-7 7')]),
  X: p => React.createElement(Svg, p, [P('M18 6 6 18'), P('M6 6l12 12')]),
  Truck: p => React.createElement(Svg, p, [P('M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2'), P('M14 9h4l4 4v4a1 1 0 0 1-1 1h-1'), El('circle', {
    cx: 7,
    cy: 18,
    r: 2
  }), El('circle', {
    cx: 17,
    cy: 18,
    r: 2
  })]),
  Shield: p => React.createElement(Svg, p, [P('M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1Z')]),
  Rotate: p => React.createElement(Svg, p, [P('M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'), P('M3 3v5h5')]),
  Star: p => React.createElement(Svg, {
    ...p,
    fill: 'currentColor',
    stroke: 'none'
  }, [P('m12 2 3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14l-5-4.87 6.91-1.01L12 2Z')])
};
window.Icon = Icon;
})(); } catch (e) { __ds_ns.__errors.push({ path: "ui_kits/storefront/Icons.jsx", error: String((e && e.message) || e) }); }

// ui_kits/storefront/Listing.jsx
try { (() => {
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
// Product listing page: breadcrumb, filter sidebar, sortable grid.
const listNS = window.WearAtWorkDesignSystem_a7f0e8;
const {
  useState: useStateL
} = React;
function FilterGroup({
  title,
  children,
  open = true
}) {
  const [o, setO] = useStateL(open);
  const {
    Icon
  } = window;
  return /*#__PURE__*/React.createElement("div", {
    style: {
      borderBottom: '1px solid var(--border-subtle)',
      padding: '16px 0'
    }
  }, /*#__PURE__*/React.createElement("button", {
    onClick: () => setO(!o),
    style: {
      width: '100%',
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'space-between',
      background: 'none',
      border: 'none',
      cursor: 'pointer',
      padding: 0
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 13,
      letterSpacing: '.06em',
      textTransform: 'uppercase',
      color: 'var(--text-strong)'
    }
  }, title), /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'var(--text-muted)',
      transform: o ? 'rotate(180deg)' : 'none',
      transition: 'transform .15s'
    }
  }, /*#__PURE__*/React.createElement(Icon.Chevron, {
    size: 16
  }))), o && /*#__PURE__*/React.createElement("div", {
    style: {
      marginTop: 14,
      display: 'flex',
      flexDirection: 'column',
      gap: 10
    }
  }, children));
}
function Check({
  label,
  count,
  checked,
  onChange
}) {
  return /*#__PURE__*/React.createElement("label", {
    style: {
      display: 'flex',
      alignItems: 'center',
      gap: 10,
      cursor: 'pointer',
      fontSize: 14,
      color: 'var(--text-body)'
    }
  }, /*#__PURE__*/React.createElement("span", {
    onClick: onChange,
    style: {
      width: 18,
      height: 18,
      borderRadius: 3,
      border: '1px solid ' + (checked ? 'var(--navy-700)' : 'var(--border-default)'),
      background: checked ? 'var(--navy-700)' : '#fff',
      display: 'inline-flex',
      alignItems: 'center',
      justifyContent: 'center',
      flexShrink: 0
    }
  }, checked && /*#__PURE__*/React.createElement("span", {
    style: {
      color: '#fff',
      fontSize: 12,
      lineHeight: 1
    }
  }, "\u2713")), /*#__PURE__*/React.createElement("span", {
    style: {
      flex: 1
    }
  }, label), count != null && /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'var(--text-muted)',
      fontSize: 12
    }
  }, count));
}
function Listing({
  onOpenProduct,
  onNav
}) {
  const {
    ProductCard,
    Breadcrumb,
    Select,
    Badge
  } = listNS;
  const [sort, setSort] = useStateL('featured');
  const [feat, setFeat] = useStateL({
    'Hi-Vis': true
  });
  const products = window.PRODUCTS.concat(window.PRODUCTS.slice(0, 4).map(p => ({
    ...p,
    id: p.id + '-2'
  })));
  const wrap = {
    maxWidth: 1280,
    margin: '0 auto',
    padding: '0 24px'
  };
  return /*#__PURE__*/React.createElement("main", {
    style: {
      fontFamily: 'var(--font-body)',
      background: 'var(--surface-page)',
      minHeight: '60vh'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      background: 'var(--surface-subtle)',
      borderBottom: '1px solid var(--border-subtle)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      ...wrap,
      padding: '20px 24px'
    }
  }, /*#__PURE__*/React.createElement(Breadcrumb, {
    items: [{
      label: 'Αρχική',
      href: '#'
    }, {
      label: 'Ανδρικά',
      href: '#'
    }, {
      label: 'Hi-Vis'
    }]
  }), /*#__PURE__*/React.createElement("h1", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 34,
      textTransform: 'uppercase',
      letterSpacing: '-.02em',
      color: 'var(--text-strong)',
      margin: '12px 0 4px'
    }
  }, "Hi-Vis \xB7 \u03A5\u03C8\u03B7\u03BB\u03AE \u03B4\u03B9\u03B1\u03BA\u03C1\u03B9\u03C4\u03CC\u03C4\u03B7\u03C4\u03B1"), /*#__PURE__*/React.createElement("p", {
    style: {
      color: 'var(--text-muted)',
      fontSize: 14,
      margin: 0
    }
  }, products.length, " \u03C0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03B1 \u2014 \u03C1\u03BF\u03CD\u03C7\u03B1 \u03C5\u03C8\u03B7\u03BB\u03AE\u03C2 \u03B4\u03B9\u03B1\u03BA\u03C1\u03B9\u03C4\u03CC\u03C4\u03B7\u03C4\u03B1\u03C2 \u03BA\u03B1\u03C4\u03AC EN ISO 20471."))), /*#__PURE__*/React.createElement("div", {
    style: {
      ...wrap,
      padding: '28px 24px',
      display: 'grid',
      gridTemplateColumns: '256px 1fr',
      gap: 32,
      alignItems: 'start'
    }
  }, /*#__PURE__*/React.createElement("aside", null, /*#__PURE__*/React.createElement("div", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 14,
      letterSpacing: '.06em',
      textTransform: 'uppercase',
      color: 'var(--text-strong)',
      marginBottom: 4
    }
  }, "\u03A6\u03AF\u03BB\u03C4\u03C1\u03B1"), /*#__PURE__*/React.createElement(FilterGroup, {
    title: "\u039A\u03B1\u03C4\u03B7\u03B3\u03BF\u03C1\u03AF\u03B1"
  }, ['Τζάκετ', 'Γιλέκα', 'Παντελόνια', 'T-Shirt / Polo', 'Φούτερ'].map((c, i) => /*#__PURE__*/React.createElement(Check, {
    key: c,
    label: c,
    count: [6, 4, 7, 5, 3][i]
  }))), /*#__PURE__*/React.createElement(FilterGroup, {
    title: "\u03A7\u03B1\u03C1\u03B1\u03BA\u03C4\u03B7\u03C1\u03B9\u03C3\u03C4\u03B9\u03BA\u03AC"
  }, /*#__PURE__*/React.createElement(Check, {
    label: "Hi-Vis",
    count: 12,
    checked: feat['Hi-Vis'],
    onChange: () => setFeat(f => ({
      ...f,
      'Hi-Vis': !f['Hi-Vis']
    }))
  }), /*#__PURE__*/React.createElement(Check, {
    label: "\u0391\u03B4\u03B9\u03AC\u03B2\u03C1\u03BF\u03C7\u03BF",
    count: 8,
    checked: feat['w'],
    onChange: () => setFeat(f => ({
      ...f,
      w: !f.w
    }))
  }), /*#__PURE__*/React.createElement(Check, {
    label: "Stretch",
    count: 5,
    checked: feat['s'],
    onChange: () => setFeat(f => ({
      ...f,
      s: !f.s
    }))
  })), /*#__PURE__*/React.createElement(FilterGroup, {
    title: "Brand"
  }, ['Helly Hansen', 'Projob', 'Puma', 'Guardio'].map((c, i) => /*#__PURE__*/React.createElement(Check, {
    key: c,
    label: c,
    count: [14, 9, 6, 4][i]
  }))), /*#__PURE__*/React.createElement(FilterGroup, {
    title: "\u03A7\u03C1\u03CE\u03BC\u03B1",
    open: false
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 8,
      flexWrap: 'wrap'
    }
  }, ['#ffd300', '#ff6a13', '#1e3049', '#20242b', '#6b7280'].map(c => /*#__PURE__*/React.createElement("span", {
    key: c,
    style: {
      width: 26,
      height: 26,
      borderRadius: '50%',
      background: c,
      border: '1px solid var(--border-default)',
      cursor: 'pointer'
    }
  }))))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'space-between',
      marginBottom: 20,
      gap: 16,
      flexWrap: 'wrap'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 8,
      flexWrap: 'wrap'
    }
  }, feat['Hi-Vis'] && /*#__PURE__*/React.createElement("span", {
    style: {
      display: 'inline-flex',
      alignItems: 'center',
      gap: 6,
      background: 'var(--navy-50)',
      border: '1px solid var(--border-subtle)',
      borderRadius: 3,
      padding: '6px 10px',
      fontSize: 12.5,
      fontWeight: 600
    }
  }, "Hi-Vis ", /*#__PURE__*/React.createElement("button", {
    onClick: () => setFeat(f => ({
      ...f,
      'Hi-Vis': false
    })),
    style: {
      border: 'none',
      background: 'none',
      cursor: 'pointer',
      color: 'var(--text-muted)',
      padding: 0
    }
  }, "\u2715"))), /*#__PURE__*/React.createElement("div", {
    style: {
      width: 220
    }
  }, /*#__PURE__*/React.createElement(Select, {
    value: sort,
    onChange: e => setSort(e.target.value),
    options: [{
      value: 'featured',
      label: 'Ταξινόμηση: Προτεινόμενα'
    }, {
      value: 'price-asc',
      label: 'Τιμή: Αύξουσα'
    }, {
      value: 'price-desc',
      label: 'Τιμή: Φθίνουσα'
    }, {
      value: 'new',
      label: 'Νεότερα'
    }]
  }))), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'grid',
      gridTemplateColumns: 'repeat(3,1fr)',
      gap: 20
    }
  }, products.map(p => /*#__PURE__*/React.createElement(ProductCard, _extends({
    key: p.id
  }, p, {
    onSelect: () => onOpenProduct(p)
  })))))));
}
window.Listing = Listing;
})(); } catch (e) { __ds_ns.__errors.push({ path: "ui_kits/storefront/Listing.jsx", error: String((e && e.message) || e) }); }

// ui_kits/storefront/Product.jsx
try { (() => {
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
// Product detail page: gallery, variant selectors, add-to-cart, specs.
const pdpNS = window.WearAtWorkDesignSystem_a7f0e8;
const {
  useState: useStateP
} = React;
function Product({
  product,
  onOpenProduct,
  onAddToCart,
  onNav
}) {
  const {
    Button,
    Badge,
    PriceTag,
    ColorSwatch,
    QuantityStepper,
    Breadcrumb,
    SectionHeader,
    ProductCard
  } = pdpNS;
  const {
    Icon
  } = window;
  const p = product;
  const [color, setColor] = useStateP(p.colors[0].value);
  const [size, setSize] = useStateP('M');
  const [qty, setQty] = useStateP(1);
  const wrap = {
    maxWidth: 1280,
    margin: '0 auto',
    padding: '0 24px'
  };
  const sizes = ['S', 'M', 'L', 'XL', 'XXL'];
  const related = window.PRODUCTS.filter(x => x.id !== p.id).slice(0, 4);
  return /*#__PURE__*/React.createElement("main", {
    style: {
      fontFamily: 'var(--font-body)',
      background: 'var(--surface-page)'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      ...wrap,
      padding: '20px 24px'
    }
  }, /*#__PURE__*/React.createElement(Breadcrumb, {
    items: [{
      label: 'Αρχική',
      href: '#'
    }, {
      label: 'Ανδρικά',
      href: '#'
    }, {
      label: p.cat,
      href: '#'
    }, {
      label: p.title
    }]
  })), /*#__PURE__*/React.createElement("div", {
    style: {
      ...wrap,
      padding: '8px 24px 56px',
      display: 'grid',
      gridTemplateColumns: '1.1fr 1fr',
      gap: 48,
      alignItems: 'start'
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 16,
      position: 'sticky',
      top: 172
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      flexDirection: 'column',
      gap: 12
    }
  }, [p.image, ...window.PRODUCTS.slice(0, 3).map(x => x.image)].map((im, i) => /*#__PURE__*/React.createElement("div", {
    key: i,
    style: {
      width: 72,
      height: 90,
      borderRadius: 4,
      overflow: 'hidden',
      border: '1px solid ' + (i === 0 ? 'var(--navy-700)' : 'var(--border-subtle)'),
      background: 'var(--gray-50)',
      cursor: 'pointer'
    }
  }, /*#__PURE__*/React.createElement("img", {
    src: im,
    alt: "",
    style: {
      width: '100%',
      height: '100%',
      objectFit: 'cover'
    }
  })))), /*#__PURE__*/React.createElement("div", {
    style: {
      flex: 1,
      position: 'relative',
      aspectRatio: '3/4',
      background: 'var(--gray-50)',
      borderRadius: 8,
      overflow: 'hidden',
      border: '1px solid var(--border-subtle)'
    }
  }, p.badge && /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'absolute',
      top: 16,
      left: 16,
      zIndex: 2
    }
  }, /*#__PURE__*/React.createElement(Badge, {
    tone: p.badge.tone
  }, p.badge.label)), /*#__PURE__*/React.createElement("img", {
    src: p.image,
    alt: p.title,
    style: {
      width: '100%',
      height: '100%',
      objectFit: 'cover'
    }
  }))), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      flexDirection: 'column',
      gap: 20
    }
  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'space-between'
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 13,
      letterSpacing: '.1em',
      textTransform: 'uppercase',
      color: 'var(--brand-secondary)'
    }
  }, p.brand), /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontSize: 12,
      color: 'var(--gray-400)'
    }
  }, "\u039A\u03C9\u03B4. ", p.sku)), /*#__PURE__*/React.createElement("h1", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 800,
      fontSize: 30,
      lineHeight: 1.1,
      textTransform: 'uppercase',
      letterSpacing: '-.01em',
      color: 'var(--text-strong)',
      margin: '8px 0 12px'
    }
  }, p.title), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'center',
      gap: 8
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      display: 'flex',
      color: 'var(--yellow-500)'
    }
  }, [0, 1, 2, 3, 4].map(i => /*#__PURE__*/React.createElement(Icon.Star, {
    key: i,
    size: 16
  }))), /*#__PURE__*/React.createElement("span", {
    style: {
      fontSize: 13,
      color: 'var(--text-muted)'
    }
  }, "4.8 \xB7 26 \u03B1\u03BE\u03B9\u03BF\u03BB\u03BF\u03B3\u03AE\u03C3\u03B5\u03B9\u03C2"))), /*#__PURE__*/React.createElement(PriceTag, {
    price: p.price,
    compareAt: p.compareAt,
    size: "lg"
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      height: 1,
      background: 'var(--border-subtle)'
    }
  }), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'space-between',
      marginBottom: 10
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 12,
      letterSpacing: '.06em',
      textTransform: 'uppercase',
      color: 'var(--text-strong)'
    }
  }, "\u03A7\u03C1\u03CE\u03BC\u03B1"), /*#__PURE__*/React.createElement("span", {
    style: {
      fontSize: 13,
      color: 'var(--text-muted)'
    }
  }, (p.colors.find(c => c.value === color) || {}).label)), /*#__PURE__*/React.createElement(ColorSwatch, {
    colors: p.colors,
    selected: color,
    onSelect: setColor
  })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'space-between',
      marginBottom: 10
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 12,
      letterSpacing: '.06em',
      textTransform: 'uppercase',
      color: 'var(--text-strong)'
    }
  }, "\u039C\u03AD\u03B3\u03B5\u03B8\u03BF\u03C2"), /*#__PURE__*/React.createElement("a", {
    href: "#",
    onClick: e => e.preventDefault(),
    style: {
      fontSize: 13
    }
  }, "\u039F\u03B4\u03B7\u03B3\u03CC\u03C2 \u03BC\u03B5\u03B3\u03B5\u03B8\u03CE\u03BD")), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 8,
      flexWrap: 'wrap'
    }
  }, sizes.map(s => /*#__PURE__*/React.createElement("button", {
    key: s,
    onClick: () => setSize(s),
    style: {
      minWidth: 52,
      height: 44,
      padding: '0 12px',
      borderRadius: 3,
      cursor: 'pointer',
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 14,
      background: size === s ? 'var(--navy-700)' : '#fff',
      color: size === s ? '#fff' : 'var(--text-strong)',
      border: '1px solid ' + (size === s ? 'var(--navy-700)' : 'var(--border-default)')
    }
  }, s)))), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      gap: 12,
      alignItems: 'stretch',
      marginTop: 4
    }
  }, /*#__PURE__*/React.createElement(QuantityStepper, {
    value: qty,
    onChange: setQty,
    size: "md",
    style: {
      height: 54
    }
  }), /*#__PURE__*/React.createElement(Button, {
    variant: "accent",
    size: "lg",
    fullWidth: true,
    onClick: () => onAddToCart(p, qty, {
      color,
      size
    }),
    iconRight: /*#__PURE__*/React.createElement(Icon.Cart, {
      size: 18
    })
  }, "\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7 \u03C3\u03C4\u03BF \u03BA\u03B1\u03BB\u03AC\u03B8\u03B9")), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'grid',
      gridTemplateColumns: '1fr 1fr',
      gap: 12,
      marginTop: 4
    }
  }, [[/*#__PURE__*/React.createElement(Icon.Truck, {
    size: 18
  }), 'Άμεση αποστολή 24-48ω'], [/*#__PURE__*/React.createElement(Icon.Rotate, {
    size: 17
  }), 'Δωρεάν επιστροφή 30 ημ.'], [/*#__PURE__*/React.createElement(Icon.Shield, {
    size: 17
  }), 'EN ISO 20471 Class 2'], [/*#__PURE__*/React.createElement(Icon.Star, {
    size: 15
  }), 'Εγγύηση κατασκευαστή']].map(([ic, t], i) => /*#__PURE__*/React.createElement("div", {
    key: i,
    style: {
      display: 'flex',
      alignItems: 'center',
      gap: 10,
      fontSize: 13,
      color: 'var(--text-body)'
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      color: 'var(--brand-secondary)',
      display: 'inline-flex'
    }
  }, ic), t))), /*#__PURE__*/React.createElement("div", {
    style: {
      background: 'var(--surface-subtle)',
      border: '1px solid var(--border-subtle)',
      borderRadius: 6,
      padding: '18px 20px',
      marginTop: 4
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      fontFamily: 'var(--font-display)',
      fontWeight: 700,
      fontSize: 13,
      letterSpacing: '.05em',
      textTransform: 'uppercase',
      color: 'var(--text-strong)',
      marginBottom: 8
    }
  }, "\u03A0\u03B5\u03C1\u03B9\u03B3\u03C1\u03B1\u03C6\u03AE"), /*#__PURE__*/React.createElement("p", {
    style: {
      margin: 0,
      fontSize: 14,
      lineHeight: 1.65,
      color: 'var(--text-body)'
    }
  }, "\u03A1\u03BF\u03CD\u03C7\u03BF \u03B5\u03C1\u03B3\u03B1\u03C3\u03AF\u03B1\u03C2 \u03C5\u03C8\u03B7\u03BB\u03AE\u03C2 \u03B4\u03B9\u03B1\u03BA\u03C1\u03B9\u03C4\u03CC\u03C4\u03B7\u03C4\u03B1\u03C2 \u03C3\u03C7\u03B5\u03B4\u03B9\u03B1\u03C3\u03BC\u03AD\u03BD\u03BF \u03B3\u03B9\u03B1 \u03B1\u03C0\u03B1\u03B9\u03C4\u03B7\u03C4\u03B9\u03BA\u03AD\u03C2 \u03C3\u03C5\u03BD\u03B8\u03AE\u03BA\u03B5\u03C2. \u0391\u03BD\u03B8\u03B5\u03BA\u03C4\u03B9\u03BA\u03CC \u03CD\u03C6\u03B1\u03C3\u03BC\u03B1 \u03BC\u03B5 \u03B5\u03BB\u03B1\u03C3\u03C4\u03B9\u03BA\u03CC\u03C4\u03B7\u03C4\u03B1 4 \u03BA\u03B1\u03C4\u03B5\u03C5\u03B8\u03CD\u03BD\u03C3\u03B5\u03C9\u03BD, \u03B5\u03BD\u03B9\u03C3\u03C7\u03C5\u03BC\u03AD\u03BD\u03B1 \u03C3\u03B7\u03BC\u03B5\u03AF\u03B1 \u03C6\u03B8\u03BF\u03C1\u03AC\u03C2 \u03BA\u03B1\u03B9 \u03B5\u03C1\u03B3\u03BF\u03BD\u03BF\u03BC\u03B9\u03BA\u03AE \u03B5\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE \u03C0\u03BF\u03C5 \u03C3\u03B1\u03C2 \u03BA\u03C1\u03B1\u03C4\u03AC \u03B1\u03C3\u03C6\u03B1\u03BB\u03B5\u03AF\u03C2 \u03C7\u03C9\u03C1\u03AF\u03C2 \u03BD\u03B1 \u03B8\u03C5\u03C3\u03B9\u03AC\u03B6\u03B5\u03B9 \u03C4\u03BF \u03C3\u03C4\u03C5\u03BB.")))), /*#__PURE__*/React.createElement("section", {
    style: {
      ...wrap,
      padding: '0 24px 64px'
    }
  }, /*#__PURE__*/React.createElement(SectionHeader, {
    eyebrow: "\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03CE\u03C3\u03C4\u03B5 \u03C4\u03BF look",
    title: "\u03A3\u03C7\u03B5\u03C4\u03B9\u03BA\u03AC \u03C0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03B1"
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'grid',
      gridTemplateColumns: 'repeat(4,1fr)',
      gap: 20,
      marginTop: 24
    }
  }, related.map(rp => /*#__PURE__*/React.createElement(ProductCard, _extends({
    key: rp.id
  }, rp, {
    onSelect: () => onOpenProduct(rp)
  }))))));
}
window.Product = Product;
})(); } catch (e) { __ds_ns.__errors.push({ path: "ui_kits/storefront/Product.jsx", error: String((e && e.message) || e) }); }

// ui_kits/storefront/data.js
try { (() => {
// Shared storefront data + brand constants.
const PRODUCTS = [{
  id: 'alna-vest',
  brand: 'Helly Hansen',
  title: 'Alna 4X CNCT Vest',
  sku: '77130',
  price: 160,
  compareAt: 198.40,
  badge: {
    tone: 'hivis',
    label: 'Hi-Vis'
  },
  image: 'img/p-vest-yellow.png',
  cat: 'Γιλέκα',
  colors: [{
    value: 'y',
    hex: '#ffd300',
    label: 'Yellow/Ebony'
  }, {
    value: 'o',
    hex: '#ff6a13',
    label: 'Orange/Ebony'
  }]
}, {
  id: 'icu-tshirt',
  brand: 'Helly Hansen',
  title: 'ICU T-Shirt',
  sku: '79271',
  price: 60,
  compareAt: 74.40,
  badge: {
    tone: 'hivis',
    label: 'Hi-Vis'
  },
  image: 'img/p-tshirt-orange.png',
  cat: 'T-Shirt / Polo',
  colors: [{
    value: 'o',
    hex: '#ff6a13',
    label: 'Orange/Ebony'
  }, {
    value: 'y',
    hex: '#ffd300',
    label: 'Yellow/Ebony'
  }]
}, {
  id: 'progression-softshell',
  brand: 'Helly Hansen',
  title: 'Progression Softshell Jacket',
  sku: '7400',
  price: 83.80,
  compareAt: 103.91,
  image: 'img/p-softshell-navy.png',
  cat: 'Soft-shell Jackets',
  colors: [{
    value: 'n',
    hex: '#1e3049',
    label: 'Navy/Black'
  }, {
    value: 'b',
    hex: '#20242b',
    label: 'Black'
  }, {
    value: 'g',
    hex: '#6b7280',
    label: 'Grey/Black'
  }]
}, {
  id: 'stretch-construction',
  brand: 'Projob',
  title: 'Παντελόνι Stretch Construction EN ISO 20471 Class 1',
  sku: '6540',
  price: 166.20,
  compareAt: 206.09,
  badge: {
    tone: 'hivis',
    label: 'Hi-Vis'
  },
  image: 'img/p-pant-yellow.png',
  cat: 'Construction Pants',
  colors: [{
    value: 'yn',
    hex: '#ffd300',
    label: 'Yellow/Navy'
  }, {
    value: 'yb',
    hex: '#ffdd33',
    label: 'Yellow/Black'
  }, {
    value: 'ob',
    hex: '#ff6a13',
    label: 'Orange/Black'
  }]
}, {
  id: 'icu-winter',
  brand: 'Helly Hansen',
  title: 'Μπουφάν ICU Hi Vis Insulated Winter',
  sku: '71372',
  price: 300,
  compareAt: 372,
  badge: {
    tone: 'new',
    label: 'Νέο'
  },
  image: 'img/p-jacket-black.png',
  cat: 'Winter Jackets',
  colors: [{
    value: 'o',
    hex: '#ff6a13',
    label: 'Orange'
  }, {
    value: 'y',
    hex: '#ffd300',
    label: 'Yellow'
  }]
}, {
  id: 'kensington-boa',
  brand: 'Puma',
  title: 'Kensington Low BOA S3S',
  sku: '78350',
  price: 180,
  compareAt: 223.20,
  image: 'img/p-boot-black.png',
  cat: 'Μποτάκια',
  colors: [{
    value: 'b',
    hex: '#20242b',
    label: 'Black'
  }]
}, {
  id: 'oxford-pant',
  brand: 'Helly Hansen',
  title: 'Oxford 4X Work Pant',
  sku: '77407',
  price: 94,
  compareAt: 116.56,
  image: 'img/p-hoodie-navy.png',
  cat: 'Work Pants',
  colors: [{
    value: 'b',
    hex: '#20242b',
    label: 'Black'
  }, {
    value: 'n',
    hex: '#1e3049',
    label: 'Navy/Ebony'
  }]
}, {
  id: 'uc-me-softshell',
  brand: 'Helly Hansen',
  title: 'Τζάκετ Softshell UC-ME Hi Vis',
  sku: '74055',
  price: 105,
  compareAt: 130.20,
  badge: {
    tone: 'hivis',
    label: 'Hi-Vis'
  },
  image: 'img/p-glove-orange.png',
  cat: 'Soft-shell Jackets',
  colors: [{
    value: 'o',
    hex: '#ff6a13',
    label: 'Orange/Ebony'
  }, {
    value: 'y',
    hex: '#ffd300',
    label: 'Yellow/Ebony'
  }]
}];
const NAV = ['Ανδρικά', 'Γυναικεία', 'Παντελόνια', 'Τζάκετ', 'Hi-Vis', 'Υπόδηση', 'Αξεσουάρ'];
const eur = n => n.toLocaleString('el-GR', {
  minimumFractionDigits: 2,
  maximumFractionDigits: 2
}) + ' €';
Object.assign(window, {
  PRODUCTS,
  NAV,
  eur
});
})(); } catch (e) { __ds_ns.__errors.push({ path: "ui_kits/storefront/data.js", error: String((e && e.message) || e) }); }

__ds_ns.Button = __ds_scope.Button;

__ds_ns.IconButton = __ds_scope.IconButton;

__ds_ns.Input = __ds_scope.Input;

__ds_ns.QuantityStepper = __ds_scope.QuantityStepper;

__ds_ns.Select = __ds_scope.Select;

__ds_ns.SectionHeader = __ds_scope.SectionHeader;

__ds_ns.Breadcrumb = __ds_scope.Breadcrumb;

__ds_ns.Badge = __ds_scope.Badge;

__ds_ns.ColorSwatch = __ds_scope.ColorSwatch;

__ds_ns.PriceTag = __ds_scope.PriceTag;

__ds_ns.ProductCard = __ds_scope.ProductCard;

})();
