/* || site-specific */

:root {
  color-scheme: light;
  --pm-dark-green: #3E6A09;
  --pm-light-green: #ECFCD8;
  --pm-purple-50: #f6f4fb;
  --pm-purple-100: #eee7fd;
  --pm-purple-200: #ccbbf7;
  --pm-purple-300: #9b7bea;
  --pm-purple-400: #7a52e0;
  --pm-purple-500: #551a8b;
  --pm-purple-600: #471fad;
  --pm-purple-700: #351782;
  --pm-purple-800: #220d59;
  --pm-purple-900: #16083a;

  --bg-color: #ffffff;
  --text-color: #1c1e21;
  --nav-bg: #f8f9fa;
  --border-color: #dee2e6;
  --link-color: #007bff;
  --error-color: #dc3545;
  --warning-color: #ffc107;
  --success-color: #28a745;

  --slate-50: #f8fafc;
  --slate-100: #f1f5f9;
  --slate-200: #e2e8f0;
  --slate-300: #cbd5e1;
  --slate-400: #94a3b8;
  --slate-500: #64748b;
  --slate-600: #475569;
  --slate-700: #334155;
  --slate-800: #1e293b;
  --slate-900: #0f172a;
  --slate-950: #020617;
}

[data-theme='dark'] {
  color-scheme: dark;
  --bg-color: #181a1b;
  --text-color: #e8e6e3;
  --nav-bg: #1c1e1f;
  --border-color: #3c4143;
  --link-color: #3391ff;
  --error-color: #ff6b6b;
  --warning-color: #ffd43b;
  --success-color: #51cf66;

  --pm-purple-50: #121212;
  --pm-purple-100: #2a2d2f;
  --pm-purple-200: #3c4143;
  --pm-purple-400: #9f7aea;
  --pm-purple-500: #b794f4;

  --slate-500: #cbd5e1;
  --slate-900: #e8e6e3;
}

.pm-dark-green {
  color: var(--pm-dark-green);
}

.slate-50 {color: var(--slate-50);}
.slate-100 {color: var(--slate-100);}
.slate-200 {color: var(--slate-200);}
.slate-300 {color: var(--slate-300);}
.slate-400 {color: var(--slate-400);}
.slate-500 {color: var(--slate-500);}
.slate-600 {color: var(--slate-600);}
.slate-700 {color: var(--slate-700);}
.slate-800 {color: var(--slate-800);}
.slate-900 {color: var(--slate-900);}
.slate-950 {color: var(--slate-950);}

.pm-purple-50 {color: var(--pm-purple-50);}
.pm-purple-100 {color: var(--pm-purple-100);}
.pm-purple-200 {color: var(--pm-purple-200);}
.pm-purple-300 {color: var(--pm-purple-300);}
.pm-purple-400 {color: var(--pm-purple-400);}
.pm-purple-500 {color: var(--pm-purple-500);}
.pm-purple-600 {color: var(--pm-purple-600);}
.pm-purple-700 {color: var(--pm-purple-700);}
.pm-purple-800 {color: var(--pm-purple-800);}

.b--pm-purple-50 {border-color: var(--pm-purple-50)}
.b--pm-purple-100 {border-color: var(--pm-purple-100)}
.b--pm-purple-200 {border-color: var(--pm-purple-200)}
.b--pm-purple-300 {border-color: var(--pm-purple-300)}
.b--pm-purple-400 {border-color: var(--pm-purple-400)}
.b--pm-purple-500 {border-color: var(--pm-purple-500)}
.b--pm-purple-600 {border-color: var(--pm-purple-600)}
.b--pm-purple-700 {border-color: var(--pm-purple-700)}
.b--pm-purple-800 {border-color: var(--pm-purple-800)}
.b--pm-purple-900 {border-color: var(--pm-purple-900)}

.b--slate-50 {border-color: var(--slate-50);}
.b--slate-100 {border-color: var(--slate-100);}
.b--slate-200 {border-color: var(--slate-200);}
.b--slate-300 {border-color: var(--slate-300);}
.b--slate-400 {border-color: var(--slate-400);}
.b--slate-500 {border-color: var(--slate-500);}
.b--slate-600 {border-color: var(--slate-600);}
.b--slate-700 {border-color: var(--slate-700);}
.b--slate-800 {border-color: var(--slate-800);}
.b--slate-900 {border-color: var(--slate-900);}
.b--slate-950 {border-color: var(--slate-950);}

.pm-light-green {color: var(--pm-light-green)}

.bg-pm-light-green {background-color: var(--pm-light-green)}

.bg-pm-purple-50 {background-color: var(--pm-purple-50)}
.bg-pm-purple-100 {background-color: var(--pm-purple-100)}
.bg-pm-purple-200 {background-color: var(--pm-purple-200)}
.bg-pm-purple-300 {background-color: var(--pm-purple-300)}
.bg-pm-purple-400 {background-color: var(--pm-purple-400)}
.bg-pm-purple-500 {background-color: var(--pm-purple-500)}
.bg-pm-purple-600 {background-color: var(--pm-purple-600)}
.bg-pm-purple-700 {background-color: var(--pm-purple-700)}
.bg-pm-purple-800 {background-color: var(--pm-purple-800)}
.bg-pm-purple-900 {background-color: var(--pm-purple-900)}

.bg-slate-50 {background-color: var(--slate-50);}
.bg-slate-100 {background-color: var(--slate-100);}
.bg-slate-200 {background-color: var(--slate-200);}
.bg-slate-300 {background-color: var(--slate-300);}
.bg-slate-400 {background-color: var(--slate-400);}
.bg-slate-500 {background-color: var(--slate-500);}
.bg-slate-600 {background-color: var(--slate-600);}
.bg-slate-700 {background-color: var(--slate-700);}
.bg-slate-800 {background-color: var(--slate-800);}
.bg-slate-900 {background-color: var(--slate-900);}
.bg-slate-950 {background-color: var(--slate-950);}

html {
  font-weight: 300;
}

body {
  font-family: "Archivo",-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow-wrap: break-word;
  background-color: var(--bg-color);
  color: var(--text-color);
}

/* Logo text: brand purple in light mode, accessible lavender in dark mode */
.pm-logo-text {
  color: var(--pm-purple-500);
}

/* Transition logic for manual toggling */
html.theme-toggling,
html.theme-toggling body {
    transition: background-color 0.2s ease, color 0.2s ease;
}

html.theme-toggling input, html.theme-toggling button, html.theme-toggling textarea {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* Theme-aware utility overrides */
.slate-900 { color: var(--slate-900); }
.slate-500 { color: var(--slate-500); }

html[data-theme] .bg-pm-purple-50 { background-color: var(--pm-purple-50); }
.bg-pm-purple-500 {
    background-color: var(--pm-purple-500);
    color: #ffffff;
}

/* Dark mode accessibility: use dark backgrounds for active states to support white text */
html[data-theme='dark'] .bg-pm-purple-500, 
html[data-theme='dark'] .bg-pm-purple-400 { 
    background-color: #553c9a;
    color: #ffffff; 
}

/* Ensure "washed" text colors used in active states become white in dark mode */
html[data-theme='dark'] .pm-purple-50 { color: #ffffff; }

/* Match Dark Reader's depth handling */
[data-theme='dark'] .bg-white { background-color: #222426; }
[data-theme='dark'] .bg-near-white { background-color: #1c1e1f; }

.b--pm-purple-200 { border-color: var(--border-color); }
.b--pm-purple-500, .b--purple { border-color: var(--pm-purple-500); }
.pm-purple-500, .purple { color: var(--pm-purple-500); }
.pm-purple-400 { color: var(--pm-purple-400); }
.pm-purple-50 { color: var(--pm-purple-50); }

.ba, .bt, .bb, .bl, .br, 
.b--black-80, .b--black-20, .b--black-10, 
.b--mid-gray, .b--pm-purple-200 { border-color: var(--border-color); }

.bg-black-10, .bg-light-gray { background-color: var(--nav-bg); color: var(--text-color); }
.b--white { border-color: var(--border-color); }

/* Fix for sticky bars and modals */
.sticky-bar, 
[style*="position: sticky"], 
[style*="position: fixed"] {
    background-color: var(--bg-color);
}

/* Generic Table KT Fix for dark light mode*/
[data-theme='dark'] .striped--near-white:nth-child(even) { background-color: var(--bg-color); }
[data-theme='dark'] .striped--near-white:nth-child(odd) { background-color: var(--nav-bg); }

.dark-red { color: var(--error-color); }
.dark-blue { color: var(--link-color); }
.near-black, .dark-gray, .black-90, .black { color: var(--text-color); }
.mid-gray, .black-80, .black-70 { color: var(--text-color); opacity: 0.85; }
.gray, .black-60, .black-50 { color: var(--text-color); opacity: 0.75; }
.silver, .black-40, .black-30 { color: var(--text-color); opacity: 0.55; }
.hover-bg-pm-purple-400:hover { background-color: var(--pm-purple-400); }
.hover-pm-purple-50:hover { color: var(--pm-purple-50); }
.hover-b--pm-purple-400:hover { border-color: var(--pm-purple-400); }

input, select, textarea {
    background-color: var(--bg-color);
    color: var(--text-color);
    border-color: var(--border-color);
}
input::placeholder { color: var(--text-color); opacity: 0.5; }

.full-width {
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
}

.hover-bg-purple-100:hover {
  background-color: var(--pm-purple-100);
  color: var(--pm-purple-800);
  font-weight: 400;
}

.theme-toggle-btn {
    cursor: pointer;
    padding: 4px;
    border: none;
    background: transparent;
    color: var(--text-color);
    display: inline-flex;
    align-items: center;
    height: fit-content;
    align-self: center;
    z-index: 1000;
    transition: opacity 0.2s, transform 0.2s;
}
.theme-toggle-btn:hover { opacity: 0.7; transform: scale(1.1); }
.theme-toggle-btn span { font-size: 20px; }

.theme-toggle-btn .theme-icon-dark { display: none; }
.theme-toggle-btn .theme-icon-light { display: inline-block; }
[data-theme='dark'] .theme-toggle-btn .theme-icon-dark { display: inline-block; }
[data-theme='dark'] .theme-toggle-btn .theme-icon-light { display: none; }

/* || fonts */
/* headers - subset: Latin1 */
@font-face {
  font-family: 'IBM Plex Sans Var';
  font-style: italic;
  font-weight: 100 700;
  font-stretch: 85% 100%;
  src: local("IBM Plex Sans Var Italic"), local("IBMPlexSansVar-Italic"), url("fonts/IBM Plex Sans Var-Italic-Latin1.woff2") format("woff2");
  unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02;
}

@font-face {
  font-family: 'IBM Plex Sans Var';
  font-style: normal;
  font-weight: 100 700;
  font-stretch: 85% 100%;
  src: local("IBM Plex Sans Var Regular"), local("IBMPlexSansVar-Regular"), url("fonts/IBM Plex Sans Var-Roman-Latin1.woff2") format("woff2");
  unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02;
}

@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: url("fonts/IBM-Plex-Mono-Latin-100.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 200;
    font-display: swap;
    src: url("fonts/IBM-Plex-Mono-Latin-200.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url("fonts/IBM-Plex-Mono-Latin-300.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/IBM-Plex-Mono-Latin-400.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("fonts/IBM-Plex-Mono-Latin-500.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("fonts/IBM-Plex-Mono-Latin-600.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("fonts/IBM-Plex-Mono-Latin-700.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 100 900;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/Archivo-Italic.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/Archivo.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Funnel Sans';
    font-style: italic;
    font-weight: 300 800;
    font-display: swap;
    src: url(fonts/Funnel-Sans-Latin-Italic.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Funnel Sans';
    font-style: normal;
    font-weight: 300 800;
    font-display: swap;
    src: url(fonts/Funnel-Sans-Latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Funnel Sans";
}

.bg-black-70 a,
.bg-black-80 a,
.bg-black-90 a
{
  color: white;
}

pre {
  white-space: pre-wrap;
}

.marker-pm-purple-500 li::marker {
  color: var(--pm-purple-500);
}
html[data-theme='dark'] .anchor-icon {
  filter: invert(1);
}
