/*
 Theme Name:   GeneratePress Child Opencode
 Theme URI:    https://opencode.ai
 Description:  A Light-Theme GeneratePress child theme for Opencode.ai based on the OpenCode design system.
 Author:       Designer
 Template:     generatepress
 Version:      1.1.0
*/

/* --------------------------------------------------------------------------
   1. Fonts
   -------------------------------------------------------------------------- */

/* ibm-plex-mono-cyrillic-ext-400-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-ext-400-normal.woff2') format('woff2');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* ibm-plex-mono-cyrillic-400-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-400-normal.woff2') format('woff2');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* ibm-plex-mono-vietnamese-400-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-vietnamese-400-normal.woff2') format('woff2');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* ibm-plex-mono-latin-ext-400-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-ext-400-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ibm-plex-mono-latin-400-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-400-normal.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;
}/* ibm-plex-mono-cyrillic-ext-400-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-ext-400-italic.woff2') format('woff2');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* ibm-plex-mono-cyrillic-400-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-400-italic.woff2') format('woff2');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* ibm-plex-mono-vietnamese-400-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-vietnamese-400-italic.woff2') format('woff2');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* ibm-plex-mono-latin-ext-400-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-ext-400-italic.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ibm-plex-mono-latin-400-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 400;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-400-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;
}/* ibm-plex-mono-cyrillic-ext-500-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-ext-500-normal.woff2') format('woff2');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* ibm-plex-mono-cyrillic-500-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-500-normal.woff2') format('woff2');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* ibm-plex-mono-vietnamese-500-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-vietnamese-500-normal.woff2') format('woff2');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* ibm-plex-mono-latin-ext-500-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-ext-500-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ibm-plex-mono-latin-500-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-500-normal.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;
}/* ibm-plex-mono-cyrillic-ext-500-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-ext-500-italic.woff2') format('woff2');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* ibm-plex-mono-cyrillic-500-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-500-italic.woff2') format('woff2');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* ibm-plex-mono-vietnamese-500-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-vietnamese-500-italic.woff2') format('woff2');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* ibm-plex-mono-latin-ext-500-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-ext-500-italic.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ibm-plex-mono-latin-500-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 500;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-500-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;
}/* ibm-plex-mono-cyrillic-ext-700-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-ext-700-normal.woff2') format('woff2');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* ibm-plex-mono-cyrillic-700-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-700-normal.woff2') format('woff2');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* ibm-plex-mono-vietnamese-700-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-vietnamese-700-normal.woff2') format('woff2');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* ibm-plex-mono-latin-ext-700-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-ext-700-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ibm-plex-mono-latin-700-normal */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-700-normal.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;
}/* ibm-plex-mono-cyrillic-ext-700-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-ext-700-italic.woff2') format('woff2');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* ibm-plex-mono-cyrillic-700-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-cyrillic-700-italic.woff2') format('woff2');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* ibm-plex-mono-vietnamese-700-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-vietnamese-700-italic.woff2') format('woff2');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* ibm-plex-mono-latin-ext-700-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-ext-700-italic.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ibm-plex-mono-latin-700-italic */
@font-face {
  font-family: 'Berkeley Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 700;
  src: url('fonts/ibm-plex-mono/ibm-plex-mono-latin-700-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;
}
/* --------------------------------------------------------------------------
   2. Variables
   -------------------------------------------------------------------------- */

:root {
    /* Primary Colors (Inverted for Light Theme) */
    --opencode-bg: #fdfcfc;      /* Warm off-white */
    --opencode-text: #201d1d;    /* Near-black with red tint */
    
    /* Keep original color definitions for reference/components */
    --opencode-dark: #201d1d;
    --opencode-light: #fdfcfc;
    
    --mid-gray: #9a9898;
    --dark-surface: #302c2c;
    --border-gray: #646262;
    --light-surface: #f1eeee;
    
    /* Semantic Colors (Apple HIG) */
    --accent-blue: #007aff;
    --accent-blue-hover: #0056b3;
    --accent-blue-active: #004085;
    
    --danger-red: #ff3b30;
    --danger-hover: #d70015;
    --danger-active: #a50011;
    
    --success-green: #30d158;
    
    --warning-orange: #ff9f0a;
    --warning-hover: #cc7f08;
    --warning-active: #995f06;
    
    /* Text Colors */
    --text-muted: #6e6e73;
    --text-secondary: #424245;
    
    /* Borders */
    --border-warm: rgba(15, 0, 0, 0.12); /* Warm transparent dark */
    --border-tab: #9a9898;
    --border-outline: #646262;
    
    /* Typography */
    --font-family: 'Berkeley Mono', 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
    
    /* Spacing & Radius */
    --spacing-base: 8px;
    --radius-default: 4px;
    --radius-input: 6px;
}

/* --------------------------------------------------------------------------
   3. Global Styles
   -------------------------------------------------------------------------- */

body {
    background-color: var(--opencode-bg);
    color: var(--opencode-text);
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Selection */
::selection {
    background-color: var(--accent-blue);
    color: #fff;
}

/* --------------------------------------------------------------------------
   4. Typography
   -------------------------------------------------------------------------- */

h1, .h1, h1.entry-title {
    font-size: 38px;
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 24px;
    color: var(--opencode-text);
}

h2, .h2 {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 16px;
    color: var(--opencode-text);
}

p {
    margin-bottom: 24px;
}

.text-muted {
    color: var(--text-muted);
}

.text-secondary {
    color: var(--text-secondary);
}

/* Links */
a, a:visited {
    color: var(--opencode-text);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    font-weight: 500;
    transition: color 0.1s ease-in-out;
}

a:hover, a:focus {
    color: var(--accent-blue);
    text-decoration: underline;
}

/* Muted Link */
.muted-link {
    color: var(--mid-gray) !important;
    text-decoration: none;
}

.muted-link:hover {
    color: var(--opencode-text) !important;
}

/* --------------------------------------------------------------------------
   5. Buttons
   -------------------------------------------------------------------------- */

/* Buttons remain dark for impact on light background */
.button, 
button, 
input[type="submit"], 
input[type="button"], 
input[type="reset"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--opencode-dark);
    color: var(--opencode-light) !important;
    padding: 6px 16px;
    border-radius: var(--radius-default);
    font-family: var(--font-family);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5; /* Adjusted height */
    border: 1px solid var(--opencode-dark);
    cursor: pointer;
    transition: background-color 0.1s ease, border-color 0.1s ease;
    text-decoration: none;
}

.button:hover, 
button:hover, 
input[type="submit"]:hover {
    background-color: var(--dark-surface);
    border-color: var(--dark-surface);
}

.button:active, 
button:active {
    background-color: var(--opencode-dark);
}

/* Ghost / Secondary Button */
.button-secondary {
    background-color: transparent;
    color: var(--opencode-text) !important;
    border: 1px solid var(--border-outline);
}

.button-secondary:hover {
    background-color: var(--light-surface);
    border-color: var(--opencode-text);
}

/* --------------------------------------------------------------------------
   6. Forms & Inputs
   -------------------------------------------------------------------------- */

input[type="text"], 
input[type="email"], 
input[type="url"], 
input[type="password"], 
input[type="search"], 
input[type="tel"], 
input[type="number"], 
textarea, 
select {
    background-color: var(--light-surface);
    color: var(--opencode-text);
    border: 1px solid var(--border-warm);
    padding: 10px 16px;
    border-radius: var(--radius-input);
    font-family: var(--font-family);
    font-size: 16px;
    width: 100%;
    box-sizing: border-box;
}

input:focus, 
textarea:focus {
    outline: none;
    border-color: var(--accent-blue);
    background-color: #fff;
}

/* --------------------------------------------------------------------------
   7. Layout & Navigation
   -------------------------------------------------------------------------- */

.site-header {
    background-color: var(--opencode-bg);
    border-bottom: 1px solid var(--border-warm);
}

.main-navigation {
    background-color: var(--opencode-bg);
}

.main-navigation .main-nav ul li a {
    color: var(--opencode-text);
    font-weight: 500;
    text-decoration: underline;
    padding: 0 20px;
}

.main-navigation .main-nav ul li a:hover {
    color: var(--accent-blue);
    background: transparent;
}

/* Tabs */
.tabs-nav {
    border-bottom: 2px solid var(--border-warm);
    display: flex;
    gap: 24px;
}

.tab-item {
    font-weight: 500;
    line-height: 1.0;
    padding-bottom: 8px;
    color: var(--text-muted);
    cursor: pointer;
    border-bottom: 2px solid transparent;
}

.tab-item:hover {
    color: var(--opencode-text);
}

.tab-item.active {
    color: var(--opencode-text);
    border-bottom: 2px solid var(--border-tab);
    margin-bottom: -2px;
}

/* Footer */
.site-footer {
    background-color: var(--light-surface);
    color: var(--text-secondary);
    border-top: 1px solid var(--border-warm);
    padding: 48px 0;
}

.site-footer a {
    color: var(--text-secondary);
    text-decoration: none;
    font-weight: 400;
}

.site-footer a:hover {
    color: var(--opencode-text);
}

/* --------------------------------------------------------------------------
   8. Specific UI Treatments
   -------------------------------------------------------------------------- */

/* Terminal Hero - Keeps a dark aesthetic for the "terminal" feel even in light theme */
.terminal-hero {
    background-color: var(--opencode-dark);
    color: var(--opencode-light);
    border: 1px solid var(--border-outline);
    border-radius: var(--radius-default);
    padding: 32px;
    margin: 48px 0;
    overflow-x: auto;
}

.terminal-hero code {
    color: var(--opencode-light);
    background: transparent;
}

/* Feature List */
.feature-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 32px 0;
}

.feature-item-name {
    font-weight: 700;
    color: var(--opencode-text);
}

.feature-item-desc {
    font-weight: 400;
    color: var(--text-secondary);
}

/* --------------------------------------------------------------------------
   9. GeneratePress Specific Overrides
   -------------------------------------------------------------------------- */

.inside-header, .inside-footer, .inside-article {
    padding: 40px 0;
}

@media (max-width: 768px) {
    h1, .h1 {
        font-size: 28px;
    }
    .inside-header, .inside-footer, .inside-article {
        padding: 20px;
    }
}