﻿/*
  Decorative shape tokens export.
  Source: artifacts/pracownia/src/index.css and artifacts/pracownia/src/components/Motifs.tsx.
  This file is documentation/portability output only; it is not imported by the app.
*/

:root {
  --shape-color-bg: #FFFFFF;
  --shape-color-surface: #F7F8F4;
  --shape-color-surface-muted: #EEF2EF;
  --shape-color-sand: #C9D5CF;
  --shape-color-rust: #ff0000;
  --shape-color-ochre: #8A7A4E;
  --shape-color-ochre-text: #75683F;
  --shape-color-navy: #0E2A47;
  --shape-color-navy-dark: #071F38;
  --shape-color-blue-gray: #A9B8C8;
  --shape-color-accent-yellow: #f1dd04;
  --shape-color-block-gold: #c9be15;
  --shape-color-border-light: rgba(16, 42, 71, 0.12);
  --shape-color-border-dark: rgba(255, 255, 255, 0.16);

  --shape-logo-olive: #8A7A4E;
  --shape-logo-olive-soft: rgba(138, 122, 78, 0.18);
  --shape-wave-navy: rgba(14, 42, 71, 0.26);
  --shape-wave-light: rgba(247, 248, 244, 0.22);
  --shape-wave-rust: rgb(255, 0, 0, w0.20);

  --shape-radius-sm: 12px;
  --shape-radius-md: 22px;
  --shape-radius-lg: 34px;
  --shape-radius-xl: 48px;
  --shape-radius-pill: 999px;
  --shape-radius-sharp: 0;
  --shape-radius-photo-arch: var(--shape-radius-xl) var(--shape-radius-xl) var(--shape-radius-md) var(--shape-radius-md);

  --shape-stroke-thin: 1.5px;
  --shape-stroke-md: 2px;
  --shape-frame-stroke: 1.5px;
  --shape-cta-frame-stroke: 2px;
  --shape-dot-size-nav: 6px;
  --shape-list-bullet-size: 7px;

  --shape-opacity-line-light: 0.5;
  --shape-opacity-line-dark: 0.7;
  --shape-opacity-line-secondary-light: 0.9;
  --shape-opacity-line-secondary-dark: 0.55;
  --shape-opacity-soft-light: 0.5;
  --shape-opacity-soft-dark: 0.42;
  --shape-opacity-rust: 0.85;
  --shape-opacity-gold: 0.85;
  --shape-opacity-block: 0.9;
  --shape-opacity-square: 0.9;
  --shape-opacity-dot: 0.85;
  --shape-opacity-photo-frame: 0.7;
  --shape-opacity-photo-frame-arch: 0.8;
  --shape-opacity-watermark-light: 0.05;
  --shape-opacity-watermark-dark: 0.06;
  --shape-opacity-footer-watermark: 0.04;
  --shape-opacity-cta-frame: 0.32;
  --shape-opacity-cta-arch: 0.8;
  --shape-opacity-overlay-strong: 0.88;
  --shape-opacity-overlay-home: 0.9;

  --shape-z-background: 0;
  --shape-z-decoration: 10;
  --shape-z-content: 20;

  --shape-shadow-photo-soft: 0 4px 12px rgba(14, 42, 71, 0.07);
  --shape-shadow-photo-medium: 0 6px 16px rgba(14, 42, 71, 0.10);
}

.shape-tone-light {
  --shape-line: var(--shape-color-navy);
  --shape-line-opacity: var(--shape-opacity-line-light);
  --shape-line-secondary: var(--shape-color-blue-gray);
  --shape-line-secondary-opacity: var(--shape-opacity-line-secondary-light);
  --shape-soft: var(--shape-color-blue-gray);
  --shape-soft-opacity: var(--shape-opacity-soft-light);
  --shape-rust: var(--shape-color-rust);
  --shape-rust-opacity: 0.85;
  --shape-gold: var(--shape-color-ochre);
  --shape-gold-opacity: 0.85;
  --shape-gold-bright: var(--shape-color-block-gold);
  --shape-gold-bright-opacity: 0.9;
  --shape-navy-fill: var(--shape-color-navy);
  --shape-navy-fill-opacity: 0.9;
  --shape-sand-fill: var(--shape-color-surface-muted);
  --shape-sand-fill-opacity: 0.92;
  --shape-square: var(--shape-color-ochre);
  --shape-square-opacity: 0.9;
  --shape-square-2: var(--shape-color-accent-yellow);
  --shape-square-2-opacity: 0.8;
  --shape-dot: var(--shape-color-ochre);
  --shape-dot-opacity: 0.85;
}

.shape-tone-dark {
  --shape-line: var(--shape-color-sand);
  --shape-line-opacity: var(--shape-opacity-line-dark);
  --shape-line-secondary: var(--shape-color-blue-gray);
  --shape-line-secondary-opacity: var(--shape-opacity-line-secondary-dark);
  --shape-soft: var(--shape-color-blue-gray);
  --shape-soft-opacity: var(--shape-opacity-soft-dark);
  --shape-rust: var(--shape-color-rust);
  --shape-rust-opacity: 0.82;
  --shape-gold: var(--shape-color-ochre);
  --shape-gold-opacity: 0.85;
  --shape-gold-bright: var(--shape-color-block-gold);
  --shape-gold-bright-opacity: 0.9;
  --shape-navy-fill: var(--shape-color-blue-gray);
  --shape-navy-fill-opacity: 0.5;
  --shape-sand-fill: var(--shape-color-sand);
  --shape-sand-fill-opacity: 0.45;
  --shape-square: var(--shape-color-ochre);
  --shape-square-opacity: 0.88;
  --shape-square-2: var(--shape-color-accent-yellow);
  --shape-square-2-opacity: 0.75;
  --shape-dot: var(--shape-color-sand);
  --shape-dot-opacity: 0.8;
}
