/*===============================
            Fonts
=================================*/

@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

@font-face {font-family: 'MANDALA_REGULAR';src: url('../../../../Fonts/Mandala/MANDALA_REGULAR.OTF') format('opentype');}

:root {
    --font-family: "Jost", sans-serif;

    --color-primary: #1e274e;
    --color-secondary: #fdc700;
    --color-success: #28a745;
    --color-danger: #dc3545;
    --color-warning: #ffc107;  

    --color-btn-primary: #00113d;
    --color-btn-secondary: #fdc700;
    --color-btn-success: #28a745;
    --color-btn-danger: #dc3545;
    --color-btn-warning: #ffc107;  

    --color-bg: #fff;
    --color-white: #fff;
    --color-black: #000;
    --color-light: #f0f5f9;
    --color-primary-light: #e4e6ff;
    --color-secondary-light: #fff7f9;
    --color-yellow-lt:#fff7de;

    --color-sorting: #666666;
    --color-selFlight: rgb(0 141 236 / 90%);
    --color-table-bg: #6b6b6b;
    --color-table-border: #838080;
}

/*===============================
          Common CSS
=================================*/

body {background-color: var(--color-bg) !important;}
body .m_container {max-width: 90%;width: 100%;}
body, input, select, textarea, body button, a, span, table, table tr th, table tr td {font-family: var(--font-family) !important;}

/*===============================
          table
=================================*/

body .table, body table tr th, body .table tr td {vertical-align: middle !important;text-align: center;background:#fff;}
body table {width: 100%;}
body table tr th, body .table tr th {background: var(--color-table-bg);color: var(--color-white);border-right: 1px solid #989c9f;padding: 5px;text-transform: capitalize;font-size: 13px;font-weight: 500;white-space: nowrap;}
body table tr td, body .table tr td {padding: 5px;font-size: 13px;font-weight: 400;text-transform: capitalize;}

/*===============================
          Input Fields
=================================*/

body label {cursor: pointer;color: #8392a5;font-weight: 500;text-transform: capitalize;font-size: 13px;margin: 0;}
input[disabled] {cursor: not-allowed !important;}
input[type=number]{-moz-appearance: textfield;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button{-webkit-appearance: none;margin: 0;}
input:focus, select:focus, textarea:focus {box-shadow: none !important;}

body .form-control, body .nice-select, body .nice-select.clscmbanim {border: 1px solid #b0b6bf;border-radius: 4px;font-size: 13px;height: 40px;font-weight: 600;background-color: #fff;color: #333;width: 100%;padding: 8px;}
body select.form-control:not([size]):not([multiple]) {height: 40px;}
body input[type="radio"] {left: 0px;top: 2px;cursor: pointer;width: auto;height: auto !important;position: relative;margin-right: 4px;}
body .form-control.col2-left {float: left;width: 20%;border-radius: 4px 0 0 4px;border-right: 0;}
body .form-control.col2-right {float: left;width: 80%;border-radius: 0 4px 4px 0;}
body .col-form-label {font-size: 14px;}

/*===============================
            Button
=================================*/

.btn_color1 {background: var(--color-btn-primary);color: var(--color-white) !important;border: 1px solid var(--color-btn-primary);height: 40px;padding: 5px 20px;font-size: 14px;font-weight: 500;text-shadow: none;margin-top:22px;border-radius: 4px;cursor:pointer;}
.btn_color2 {background: var(--color-btn-secondary);color: var(--color-white) !important;border: 1px solid var(--color-btn-secondary);height: 40px;padding: 5px 20px;font-size: 14px;font-weight: 500;text-shadow: none;margin-top:22px;border-radius: 4px;cursor:pointer;}
.btn_color3 {background: var(--color-btn-success);color: var(--color-white) !important;border: 1px solid var(--color-btn-success);height: 40px;padding: 5px 20px;font-size: 14px;font-weight: 500;text-shadow: none;margin-top:22px;border-radius: 4px;cursor:pointer;}
.btn_color4 {background: var(--color-btn-warning);color: var(--color-black) !important;border: 1px solid var(--color-btn-warning);height: 40px;padding: 5px 20px;font-size: 14px;font-weight: 500;text-shadow: none;margin-top:22px;border-radius: 4px;cursor:pointer;}

.btn_color1:hover, .btn_color1:focus, .btn_color1:active {background: var(--color-btn-primary);color: var(--color-white);outline: none;}
.btn_color2:hover, .btn_color2:focus, .btn_color2:active {background: var(--color-btn-secondary);color: var(--color-white);outline: none;}
.btn_color3:hover, .btn_color3:focus, .btn_color3:active {background: var(--color-btn-success) !important;color: var(--color-white);outline: none;}
.btn_color4:hover, .btn_color4:focus, .btn_color4:active {background: var(--color-btn-warning) !important;color: var(--color-white);outline: none;}