@charset "utf-8";
/*	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 * 	Theme:  chili-oil           Base colour: #8E6836
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 *  For:   OWS websites         version: 3.1
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 *  Author:     DNC THomas
 *  Last edit:  2025-08-25 18:24:59
 *  As a rule you should ONLY need to change the variables below
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/*  Theme colour variables */
:root {
    --baseR: 133;
    --baseG: 104;
    --baseB: 54;

    --color1: #240F0E;
    --color2: #491F1C;
    --color3: #6E2E2A;
    --color4: #933E38;
    --color5: #b84E46;
    --color6: #C6716B;
    --color7: #D49490;
    --color8: #E2B8B5;
    --color9: #F0DBDa;
    --modal: rgba(var(--baseR),var(--baseG),var(--baseB),0.3);
    --shadow1: 0 0.3em 0.3em -1px var(--color5);
    --shadow2: 0.2em 0.2em rgb(var(--baseR), var(--baseG), var(--baseB), 80%), 0.6em 0.6em 0.6em rgb(var(--baseR), var(--baseG), var(--baseB), 50%);

    --gradient-down: linear-gradient( 0deg, var(--color7), var(--color5));
    --gradient-up: linear-gradient( 0deg,  var(--color5), var(--color7));
    --gradient-ltr: linear-gradient( 90deg,  var(--color7), var(--color5));
    --gradient-rtl: linear-gradient( 90deg,  var(--color5), var(--color7));
}

/*	Combinations colours (Foreground / Background)	
    You may wish to tweek these to improve contrast; you should start by changing color1 to color9 and vica-versa */
.ows-theme4, .ows-theme4-hvr:hover { color: var(--color9);}
.ows-theme5, .ows-theme5-hvr:hover { color: var(--color9);}
.ows-theme6, .ows-theme6-hvr:hover { color: var(--color1);}

/* Gradients ~ You may wish to adjust the foreground colours used */
.ows-theme-grad-down            { color: var(--color1)}
.ows-theme-grad-down-hvr:hover  { color: var(--color9)}
.ows-theme-grad-up              { color: var(--color1)}
.ows-theme-grad-up-hvr:hover    { color: var(--color9)}
.ows-theme-grad-ltr             { color: var(--color1)}
.ows-theme-grad-ltr-hvr:hover   { color: var(--color9)}
.ows-theme-grad-rtl             { color: var(--color1)}
.ows-theme-grad-rtl-hvr:hover   { color: var(--color9)}
