/* Theme Definitions */

[data-theme="varia"]{
    /* Backgrounds */
    --color-bg:rgb(25, 25, 29);
    --color-bg-secondary: #222222;
    --color-bg-tertiary: #333333;

    /* Foregrounds */
    --color-fg: #eeeeee;
    --color-fg-secondary: #aaaaaa;
    --color-fg-tertiary: #888888;
  
    /* Accents */
    --color-primary:rgb(203, 110, 240);
    --color-primary-dim: #c28379;
    --color-accent: #f0ad0a;
    --color-accent-dim: #d08d08;

    /* Status Colors */
    --color-error: #f44336;
    --color-warning: #ff9800;
    --color-success: #4caf50;
    --color-info: #2196f3;

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.5);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="wine"] {
    /* Backgrounds */
    --color-bg: #23181E;
    --color-bg-secondary: #2C1C25;
    --color-bg-tertiary: #422A37;

    /* Foregrounds */
    --color-fg: #FCE0B3;
    --color-fg-secondary:#C7AC81;
    --color-fg-tertiary:#A78E64;

    /* Accents */
    --color-primary: #EA8A64;
    --color-primary-dim: #BD7255;
    --color-accent: #FAE99B;
    --color-accent-dim: #C6B464;

    /* Status Colors */
    --color-error: #fca5a5;
    --color-warning: #fde68a;
    --color-success: #bbf7d0;
    --color-info: #bae6fd;

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.05);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="asuka"] {
    /* Backgrounds */
    --color-bg: #3B1212;
    --color-bg-secondary: #471B1B;
    --color-bg-tertiary: #020202;

    /* Foregrounds */
    --color-fg: #F1E9E6;
    --color-fg-secondary: #CCB6AE;
    --color-fg-tertiary: #9F8176;

    /* Accents */
    --color-primary: #F1E9E6;
    --color-primary-dim: #CCB6AE;
    --color-accent: #41CE41;
    --color-accent-dim: #3BA03B;

    /* Status Colors */
    --color-error: #EB97A8;
    --color-warning: #FFD700;
    --color-success: #32CD32;
    --color-info: #1E90FF;

    /* Borders and Shadows (derived from existing colors for consistency) */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.1); /* Slightly more prominent shadow for contrast */

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="midnight"] {
    /* Backgrounds */
    --color-bg:rgb(8, 15, 24);
    --color-bg-secondary:rgb(15, 27, 46);
    --color-bg-tertiary:rgb(15, 41, 70);
    
    /* Foregrounds */
    --color-fg: #dbdfe7;
    --color-fg-secondary: #9ea3a8;
    --color-fg-tertiary: #74787c;

    /* Accents */
    --color-primary: #1a97eb;
    --color-primary-dim: #2680aa;
    --color-accent: #f0ad0a;
    --color-accent-dim: #d08d08;

    /* Status Colors */
    --color-error: #f44336;
    --color-warning: #ff9800;
    --color-success: #4caf50;
    --color-info: #2196f3;

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.5);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

/* TODO: Adjust */
[data-theme="catppuccin"] {
    /* Backgrounds */
    --color-bg: #1e1e2e;        
    --color-bg-secondary: #181825;
    --color-bg-tertiary: #11111b;
    
    /* Foregrounds */
    --color-fg: #cdd6f4;        
    --color-fg-secondary: #a6adc8;  
    --color-fg-tertiary: #9399b2;   

    /* Accents */
    --color-primary: #cba6f7;   
    --color-primary-dim: #739df0;
    --color-accent: #f38ba8;
    --color-accent-dim: #d67b94;

    /* Status Colors */
    --color-error: #f38ba8;    
    --color-warning: #f9e2af;     
    --color-success: #a6e3a1;    
    --color-info: #89dceb;     

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.5);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="pearl"] {
    /* Backgrounds */
    --color-bg: #FFFFFF;
    --color-bg-secondary: #EEEEEE;
    --color-bg-tertiary: #E0E0E0;

    /* Foregrounds */
    --color-fg: #333333;
    --color-fg-secondary: #555555;
    --color-fg-tertiary: #777777;

    /* Accents */
    --color-primary: #007BFF;
    --color-primary-dim: #0056B3;
    --color-accent: #28A745;
    --color-accent-dim: #1E7E34;

    /* Status Colors */
    --color-error: #DC3545;
    --color-warning: #CE9B00;
    --color-success: #099B2B;
    --color-info: #02B3CE;

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.1);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="urim"] {
    /* Backgrounds */
    --color-bg: #101713;
    --color-bg-secondary: #1B2921;
    --color-bg-tertiary: #273B30;

    /* Foregrounds */
    --color-fg: #D2E79E;
    --color-fg-secondary: #B4DA55;
    --color-fg-tertiary: #7E9F2A;

    /* Accents */
    --color-primary: #ead500;
    --color-primary-dim: #C1B210;
    --color-accent: #28A745;
    --color-accent-dim: #1E7E34;

    /* Status Colors */
    --color-error: #EE5237;
    --color-warning: #FFC107;
    --color-success: #28A745;
    --color-info: #17A2B8;

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.1);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="yuu"] {
    /* Backgrounds */
    --color-bg: #161312;
    --color-bg-secondary: #272120;
    --color-bg-tertiary: #382F2E;

    /* Foregrounds */
    --color-fg: #faf5f4;
    --color-fg-secondary: #CCC7C6;
    --color-fg-tertiary: #B0A3A1;

    /* Accents */
    --color-primary: #ff826d;
    --color-primary-dim: #CE6654;
    --color-accent: #464DAE;
    --color-accent-dim: #393D74;

    /* Status Colors */
    --color-error: #FF6247;
    --color-warning: #FFC107;
    --color-success: #3ECE5F;
    --color-info: #41C4D8;

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.1);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="match"] {
    /* Backgrounds */
    --color-bg: #071014;
    --color-bg-secondary: #0A181E;
    --color-bg-tertiary: #112A34;

    /* Foregrounds */
    --color-fg: #ebeaeb;
    --color-fg-secondary: #BDBDBD;
    --color-fg-tertiary: #A2A2A2;

    /* Accents */
    --color-primary: #fda827;
    --color-primary-dim: #C78420;
    --color-accent: #277CFD;
    --color-accent-dim: #1F60C1;

    /* Status Colors */
    --color-error: #F14426;
    --color-warning: #FFC107;
    --color-success: #28A745;
    --color-info: #17A2B8;

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.1);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="lemon"] {
    /* Backgrounds */
    --color-bg: #1a171a;
    --color-bg-secondary: #2E272E;
    --color-bg-tertiary: #443844;

    /* Foregrounds */
    --color-fg: #E6E2DC;
    --color-fg-secondary: #B2ACA1;
    --color-fg-tertiary: #968F82;

    /* Accents */
    --color-primary: #f5c737;
    --color-primary-dim: #C29D2F;
    --color-accent: #277CFD;
    --color-accent-dim: #1F60C1;

    /* Status Colors */
    --color-error: #F14426;
    --color-warning: #FFC107;
    --color-success: #28A745;
    --color-info: #17A2B8;

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.1);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="autumn"] {
    /* Backgrounds */
    --color-bg:rgb(44, 25, 18); 
    --color-bg-secondary:rgb(70, 40, 18); 
    --color-bg-tertiary: #4b2f1c;  

    /* Foregrounds */
    --color-fg: #fef9f3;           
    --color-fg-secondary: #dbc6b0; 
    --color-fg-tertiary: #a3917a;   

    /* Accents */
    --color-primary: #d97706;     
    --color-primary-dim: #b45309;  
    --color-accent: #8c4c28;    
    --color-accent-dim: #6b3b1f; 

    /* Status Colors */
    --color-error: #d1433f;        
    --color-warning: #e38b29;      
    --color-success: #6b8e23;      
    --color-info: #c084fc;         

    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);        
    --color-shadow: rgba(0, 0, 0, 0.4);

    /* Interactive Elements */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-dim);
}

[data-theme="black"] {
    /* Backgrounds */
    --color-bg: #000000;
    --color-bg-secondary: #1a1a1a;
    --color-bg-tertiary: #2a2a2a;
  
    /* Foregrounds */
    --color-fg: #dddddd;
    --color-fg-secondary: #aaaaaa;
    --color-fg-tertiary: #888888;
  
    /* Accents */
    --color-primary: #08c08c;
    --color-primary-dim: #08c08c;
    --color-accent: #f0ad0a;
    --color-accent-dim: #d08d08;
  
    /* Status Colors */
    --color-error: #f44336;
    --color-warning: #ff9800;
    --color-success: #4caf50;
    --color-info: #2196f3;
  
    /* Borders and Shadows */
    --color-border: var(--color-bg-tertiary);
    --color-shadow: rgba(0, 0, 0, 0.5);
  
    /* Interactive Elements */
    --color-link: #0af0af;
    --color-link-hover: #08c08c;
}
  

/* Theme Helper Classes */

/* Foreground Text */
.color-fg { color: var(--color-fg); }
.color-fg-secondary { color: var(--color-fg-secondary); }
.color-fg-tertiary { color: var(--color-fg-tertiary); }
.hover-color-fg:hover { color: var(--color-fg); }
.hover-color-fg-secondary:hover { color: var(--color-fg-secondary); }
.hover-color-fg-tertiary:hover { color: var(--color-fg-tertiary); }

/* Backgrounds */
.bg { background-color: var(--color-bg); }
.bg-secondary { background-color: var(--color-bg-secondary); }
.bg-tertiary { background-color: var(--color-bg-tertiary); }
.hover-bg:hover { background-color: var(--color-bg); }
.hover-bg-secondary:hover { background-color: var(--color-bg-secondary); }
.hover-bg-tertiary:hover { background-color: var(--color-bg-tertiary); }

/* Borders */
.border { border: 1px solid var(--color-border); }

/* Accent Colors */
.color-primary { color: var(--color-primary); }
.bg-primary { background-color: var(--color-primary); }
.color-accent { color: var(--color-accent); }
.bg-secondary-accent { background-color: var(--color-accent); }

/* Status Colors */
.error { color: var(--color-error); }
.bg-error { background-color: var(--color-error); }

.warning { color: var(--color-warning); }
.bg-warning { background-color: var(--color-warning); }

.success { color: var(--color-success); }
.bg-success { background-color: var(--color-success); }


.info { color: var(--color-info); }
.bg-info { background-color: var(--color-info); }

/* Links */
.link { color: var(--color-link); transition: color var(--transition-speed); }
.link:hover { color: var(--color-link-hover); }