@CHARSET "UTF-8";

/*
 * The global.onyx-theme.variables.css file contains global variables for the global custom onyx bootstrap theme settings
 * The stylesheet has the next customisations:
 * - `theme-default` - the html tag CSS class for the GENERAL store theme
 * - `theme-jewel-360` - the html tag CSS class for the JEWEL store theme
*/

@import url("css/store-theme/global.store-theme.components.variables.css");

:root {
    --system-nav-background: #337AB7;
    --system-body-background: #f9f9f9;

    --switcher-active-default: #dddddd;
    --switcher-active-focus: #337AB7;
    --switcher-disabled-default: #eeeeee;
    --switcher-disabled-focus: #7CA9D1;

    --link-active-default: #337AB7;
    --link-active-hover: #23527c;
    --link-active-focus: #23527c;
    --link-disabled-default: #7B7B7B;
    --link-disabled-hover: #7B7B7B;
    --link-disabled-focus: #7B7B7B;

    --btn-primary-active-default-color: #ffffff;
    --btn-primary-active-default-background: #337AB7;
    --btn-primary-active-default-border: #2e6da4;
    --btn-primary-active-hover-background: #286090;
    --btn-primary-active-hover-border: #204d74;
    --btn-primary-active-focus-background: #286090;
    --btn-primary-active-focus-border: #122b40;
    --btn-primary-disabled-default-background: #7CA9D1;
    --btn-primary-disabled-default-border: #7CA9D1;

    --btn-success-default-color: #ffffff;
    --btn-success-default-background: #337AB7;
    --btn-success-default-border: #285E8E;
    --btn-success-hover-background: #285E8E;
    --btn-success-hover-border: #285E8E;
    --btn-success-focus-background: #337AB7;
    --btn-success-focus-border: #285E8E;
    --btn-success-disabled-background: #7CA9D1;
    --btn-success-disabled-border: #7CA9D1;

    --btn-danger-default-color: #ffffff;
    --btn-danger-default-background: #f8615d;
    --btn-danger-default-border: #A94442;
    --btn-danger-hover-background: #A94442;
    --btn-danger-hover-border: #A94442;
    --btn-danger-focus-background: #A94442;
    --btn-danger-focus-border: #A94442;
    --btn-danger-disabled-background: #d9534f;
    --btn-danger-disabled-border: #d9534f;

    --btn-info-default-color: #ffffff;
    --btn-info-default-background: #5bc0de;
    --btn-info-default-border: #46b8da;
    --btn-info-hover-color: #ffffff;
    --btn-info-hover-background: #39b3d7;
    --btn-info-hover-border: #269abc;
    --btn-info-focus-background: #39b3d7;
    --btn-info-focus-border: #269abc;
    --btn-info-disabled-background: #5bc0de;
    --btn-info-disabled-border: #46b8da;

    --field-default-background: #ffffff;
    --field-default-border: #dddddd;
    --field-default-color: #333333;
    --field-default-placeholder: #CBCBCB;
    --field-default-label: #333333;
    --field-hover-background: #eeeeee;
    --field-focus-background: #ffffff;
    --field-focus-border: #7CA9D1;
    --field-focus-shadow: rgba(51, 122, 183, 0.15);
    --field-disabled-background: #eeeeee;
    --field-disabled-border: #dddddd;
    --field-disabled-color: #7B7B7B;
    --field-disabled-placeholder: #CBCBCB;
    --field-disabled-label: #CBCBCB;
    --field-readonly-background: #eeeeee;
    --field-readonly-border: #dddddd;
    --field-readonly-color: #333333;
    --field-readonly-placeholder: #CBCBCB;
    --field-readonly-label: #333333;
    --field-error-border: #D9534F;
    --field-error-label: #D9534F;
    --field-warning-border: #8A6D3B;
    --field-warning-label: #8A6D3B;

    --pagination-btn-active-color: #ffffff;
    --pagination-btn-active-background: #428bca;
    --pagination-btn-active-border: #428bca;

    --badge-default-background: #1B71A0;

    --alert-info-color: #3a87ad;
    --alert-info-background: #d9edf7;
    --alert-info-border: #bce8f1;
    --alert-info-hr: #a6e1ec;
    --alert-info-link: #2d6987;

    --text-primary: #428bca;
    --text-grey: #7B7B7B;
    --text-default: #333333;
    --text-tertiary: #CBCBCB;

    --bg-primary-01: #DEEBF5;

    --dropdown-menu-item-default-color: #333;
    --dropdown-menu-item-default-background: #fff;
    --dropdown-menu-item-hover-color: #262626;
    --dropdown-menu-item-hover-background: #f5f5f5;
    --dropdown-menu-item-active-color: #262626;
    --dropdown-menu-item-active-background: #f5f5f5;
    --dropdown-menu-item-disabled-color: #ddd;
    --dropdown-menu-item-disabled-background: #ffff;

    --table-border: #ddd;
    --table-color: #333333;
    --table-background: #ffffff;
    --table-header-background: #ffffff;
    --table-footer-background: #ffffff;
    --table-body-row-hover-background: #eeeeee;
    --table-body-row-odd-background: #F8F8F8;
    --table-body-row-child-odd-background: #F8F9FA;
    --table-sort-icon-default-color: #CBCBCB;
    --table-sort-icon-active-color: #7B7B7B;

    --panel-default-border: #dddddd;
    --panel-default-background: #ffffff;
    --panel-default-header-border: #dddddd;
    --panel-default-header-background: #ffffff;
}

:root.theme-jewel-360 {
    --system-nav-background: #091F25;

    --switcher-active-focus: #36555C;
    --switcher-disabled-focus: #87999E;

    --link-active-default: #2C8392;
    --link-active-hover: #30717C;
    --link-active-focus: #30717C;
    --link-disabled-default: #87999E;
    --link-disabled-hover: #87999E;
    --link-disabled-focus: #87999E;

    --btn-primary-active-default-background: #0E333C;
    --btn-primary-active-default-border: #36555C;
    --btn-primary-active-hover-background: #36555C;
    --btn-primary-active-hover-border: #36555C;
    --btn-primary-active-focus-background: #36555C;
    --btn-primary-active-focus-border: #AF988B;
    --btn-primary-disabled-default-background: #5E777D;
    --btn-primary-disabled-default-border: #AFBBBE;

    --btn-success-default-background: #0E333C;
    --btn-success-default-border: #36555C;
    --btn-success-hover-background: #36555C;
    --btn-success-hover-border: #36555C;
    --btn-success-focus-background: #36555C;
    --btn-success-focus-border: #AF988B;
    --btn-success-disabled-background: #5E777D;
    --btn-success-disabled-border: #AFBBBE;

    --field-focus-border:  #0E333C;
    --field-focus-shadow: rgba(14, 51, 60, 0.25);

    --pagination-btn-active-background: #2C8392;
    --pagination-btn-active-border: #2C8392;

    --badge-default-background: #0E333C;

    --alert-info-color: #31708F;
    --alert-info-background: #D8EDF7;
    --alert-info-border: #31708F;
    --alert-info-hr: #31708F;
    --alert-info-link: #31708F;

    --text-primary: #36555C;

    --bg-primary-01: #EAF3F5;
}