/* 
    Variables
*/
:root {
    --color-primary-label-bg: #fff;
    --color-primary-label-bg-darker: #eaeef1;
    --color-primary-label-headers-btns: #2770f6;
    --color-primary-label-headers-btns-lighter: #0069d9;
    --color-secondary-label: #2770f6;

    --color-navbar: white;
    --color-navbar-link: #2770f6;
    --color-navbar-link-disabled: #9d9d9d;

    --color-bg-main-gradient1: #eaeef1;
    --color-bg-main-gradient2: #eaeef1;

    --color-headers: #0a2360;
    --color-account-name: #6f7073;
    --color-dropdown-shadow: 0px 4px 8px 0px #9d9d9d;

    --color-text: black;
    --color-wallet-border: #fff;

    --color-dropdown-a-hover: #fff;
    --color-btn-disabled: #ffc107;

    --color-cancel: #f52743;
    --color-cancel-hover: var(--color-bg-danger);

    --color-card-title: #0a2360;
    --color-text-on-total: var(--color-secondary-label);

    --color-control-labels: #2770f6;
    --color-table-lg: #606974;
    --color-table-lg-td: #f2f2f2;
    --color-account-left-menu: #606974;
    --color-copyright: #0a2360;

    --color-form-control-focus: #2770f6;
    --color-form-control-hover: #eef2f8;

    --color-buy-sell-nav-tabs-bg: #eef2f8;

    --buy-tab-bg: var(--color-buy-sell-nav-tabs-bg);
    --sell-tab-bg: var(--color-buy-sell-nav-tabs-bg);

    --buy-tab-bg-active: white;
    --sell-tab-bg-active: white;

    --color-card-tabs-container-bg: var(--color-primary-label-bg);
    --color-card-tabs-container-border: #e1e1e1;

    --color-nav-link-buy-sell: #61689D;
    --color-link-active: var(--color-primary-label-headers-btns);

    --color-dropdown-item: #0a2360;
    --color-dropdown-item-active: #fff;
    --color-dropdown-item-hover: rgba(39, 112, 246, 0.7);
    --color-dropdown-item-hover-text: var(--color-white);

    --color-primary-label-headers-btns-hover: #e0a800;

    --color-btn-disabled-text: #0a2360;

    --color-forms-text: #000;

    --color-amount-to-buy: #61689D;
    --color-amount-to-buy-focus: #000;

    --color-datapicker-bg: #f0f3f9;

    --color-datapicker-valid-dates: #333;
    --color-datapicker-invalid-dates: #ccc;
    --color-datapicker-selected: #49e;
    --color-datapicker-selected-number: #fff;
    --color-datapicker-month-name: var(--color-secondary-label);
    --color-datapicker-hover-circle: #e1e1e1;
    --color-datapicker-top-bar: #606974;

    --color-datapicker-range: #9cdbf7;
    --color-datapicker-hovering-range: #cdecfa;

    --color-links: var(--color-primary-label-headers-btns);
    --color-link-hover: #0056b3;
    --color-account-balance: #0a2360;

    --color-buy-sell-lighter: #f0f3f9;

    --color-dropdown-currency: #000;

    --color-total: #f0f3f9;
    --color-text-on-total: #0a2360;

    --color-border-account-balance: #e1e1e1;
    --color-bg-inputs: var(--color-primary-label-bg);

    --color-profile-name: #0a2360;

    --color-alert-warning-text: #060A26;
    --color-alert-warning-bg: #fff3cd;

    --color-file-input-uploded-btn: #8427f6;
    --color-file-input-uploaded-file-caption: #e6d4fd;
    --color-file-input-rejected-btn: #f52743;
    --color-file-input-rejected-file-caption: #f7d0d0;
    --color-file-input-approved-btn: #12d5b8;
    --color-file-input-approved-file-caption: #d0f7f1;

    --color-text-theme: var(--color-secondary-label);
    --color-btn-theme: var(--color-secondary-label);
    --color-bg-theme: var(--color-secondary-label);

    --color-black: #000;
    --color-white: #fff;

    --color-bg-header: var(--color-primary-label-bg);
    --color-bg-body: #060A26;
    --color-bg-footer: var(--color-primary-label-bg);

    --color-modal-bg: var(--color-primary-label-bg);

    --color-text-on-btn: var(--color-white);

    --color-trading-buy-sell-summary: var(--color-secondary-label);
    --color-trading-buy-sell-summary-text: var(--color-white);

    --color-bg-white: var(--color-white);
    --color-bg-danger: #f34f66;

    --color-bg-green: #24f692;
    --color-bg-green2: #24f692;
    --color-bg-orange: #f6ad24;

    --color-btn-disabled-text: #fff;

    --color-border-bottom: var(--color-success);

    --color-success: #12d5b8;
    --color-success-text: #000;
    --color-error: #f52743;
    --color-emphasis: #ffd923;

    --color-border-common: #e1e1e1;
    --color-border-gray1: #f2f2f2;
    --color-border-gray2: #9d9d9d;
    --color-border-td: #dee2e6;
    --color-border-inputs: #e6e9ef;
    --color-input-group-text: #d4e2fc;
    /* e.g. phone number */

    --color-text-sell-details: #fff;
    --color-dots: #878995;
    --color-dots-buy-sell: #fff;
    --color-buy-sell-bg-for-dots: var(--color-trading-buy-sell-summary);
    --color-buy-sell-btn: #ffd923;
    --color-buy-sell-btn-selling: #ffd923;
    --color-buy-sell-focus: 0 0 0 0.2rem rgba(255, 193, 7, .5);
    --color-pagination-bg-active: #007bff;
    --color-pagination-bg: transparent;

    --color-bg-table-striped: #fafbfc;
    --color-text-striped-table: #5a5f6d;

    --color-text-basic: var(--color-black);
    --color-text-white: var(--color-white);

    --color-header-basic: #231f20;
    /* e.g. account page */

    --color-icon-gray: #828595;
    --color-hamburger-menu: rgba(0, 0, 0, .5);
    --color-hamburger-menu-border: rgba(0, 0, 0, .1);

    /* Chart */
    --color-chart-bg-body: transparent;
    --color-chart-text-currency: var(--color-primary-label-headers-btns-lighter);
    --color-chart-button-divaider: var(--color-datapicker-invalid-dates);
    --color-chart-button-hover: var(--color-total);

    /* Font example, waiting desingns Fonts */
    --font-family: 'proxima-nova', "Roboto", Arial, sans-serif;
    --font-family-monospace: monospace;
    --font-body: 12px;
    --font-small: 12px;
    --font-medium-sm: 13px;
    --font-medium: 14px;
    --font-lg-sm: 16px;
    --font-lg: 18px;
    --font-xxlg: 22px;
    --font-xxlg-lg: 25px;
    --font-xxxlg: 32px;

    --box-shadow: 0 10px 18px rgba(0, 0, 0, .1);
    --border: 1px solid var(--color-border-common);

    --border-radius: 5px;
    --grid-gap: 15px;
    --grid-frame-padding:var(--grid-gap);

    --card-header-border: none;
    --card-header-background: transparent;
    --card-footer-background: rgba(0, 0, 0, .03);
    --card-footer-border-top: 1px solid rgba(0, 0, 0, .125);
    --card-box-shadow: none;
    --card-border-radius: var(--border-radius);
    --card-border: 1px solid var(--color-border-common);

    /* Header */
    --header-flex: 0 0 70px;
    --header-width: 100%;
    --header-height: 70px;
    --padding-navbar:  10px 0;

    /* Header Logo */
    --header-logo-height: 48px;
    --header-logo-width: 160px;

    /* Container */
    --container-fluid-max-width: 1200px;

    /*grid*/
    --grid-1440: 'banner banner banner''buysell stockchart stockchart''buysell recenttrades orderbook''historylogin historylogin depthchart';
    --grid-992: 'banner  banner''buysell stockchart''buysell orderbook''recenttrades depthchart''historylogin historylogin';
    --grid-template-columns-992: minmax(350px, 380px) auto;
    --grid-template-columns-1440: minmax(350px, 380px) minmax(350px, 25%) minmax(25%, 50%);
    --grid-template-rows-992: minmax(44px, auto) 404px auto 457px auto;
    --grid-template-rows-1440: minmax(44px, auto) 404px 457px minmax(392px, auto);

    /*--grid-992:'banner banner''buysell stockchart''buysell orderbook''recenttrades depthchart''historylogin historylogin';
    --grid-1440: 'buysell banner banner''buysell depthchart stockchart''buysell recenttrades stockchart''historylogin historylogin orderbook';
    --grid-template-columns-992: minmax(350px, 380px) auto;
    --grid-template-columns-1440: minmax(350px, 380px) minmax(350px, 25%) minmax(25%, 50%);
    --grid-template-rows-992: minmax(44px, auto) 350px auto 350px auto;
    --grid-template-rows-1440: minmax(44px, auto) 350px 350px minmax(392px, auto);*/
}