::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.3);
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgba(255, 140, 0, 0.8);
    box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5);
}

::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255, 140, 0, 0.4);
}


:root{
    --black:#0c0d0e;
    --black-025:#fafafb;
    --black-050:#eff0f1;
    --black-075:#e4e6e8;
    --black-100:#d6d9dc;
    --black-150:#c8ccd0;
    --black-200:#bbc0c4;
    --black-300:#9fa6ad;
    --black-350:#9199a1;
    --black-400:#848d95;
    --black-500:#6a737c;
    --black-600:#535a60;
    --black-700:#3c4146;
    --black-750:#2f3337;
    --black-800:#242729;
    --black-900:#0c0d0e;
    --blue:#0077cc;
    --blue-050:#f2f9ff;
    --blue-100:#cfeafe;
    --blue-200:#addafc;
    --blue-300:#6cbbf7;
    --blue-400:#379fef;
    --blue-500:#0095ff;
    --blue-600:#0077cc;
    --blue-700:#0064bd;
    --blue-800:#0054a3;
    --blue-900:#004487;
    --bronze:#caa789;
    --bronze-darker:#ab825f;
    --bronze-lighter:#f2e9e1;
    --bs-lg:0 1px 4px rgba(0,0,0,0.09),0 3px 8px rgba(0,0,0,0.09),0 4px 13px rgba(0,0,0,0.13);
    --bs-md:0 1px 3px rgba(0,0,0,0.06),0 2px 6px rgba(0,0,0,0.06),0 3px 8px rgba(0,0,0,0.09);
    --bs-sm:0 1px 2px rgba(0,0,0,0.05),0 1px 4px rgba(0,0,0,0.05),0 2px 8px rgba(0,0,0,0.05);
    --fc-dark:#0c0d0e;
    --fc-light:#6a737c;
    --fc-medium:#3c4146;
    --focus-ring:rgba(0,149,255,0.15);
    --focus-ring-error:rgba(192,45,46,0.15);
    --focus-ring-muted:rgba(36,39,41,0.1);
    --focus-ring-success:rgba(166,217,183,0.4);
    --focus-ring-warning:rgba(233,198,63,0.4);
    --gold:#ffcc01;
    --gold-darker:#f1b600;
    --gold-lighter:#fff4d1;
    --green:#5eba7d;
    --green-025:#eef8f1;
    --green-050:#dcf0e2;
    --green-100:#cae8d4;
    --green-200:#a6d9b7;
    --green-300:#82ca9a;
    --green-400:#5eba7d;
    --green-500:#48a868;
    --green-600:#3d8f58;
    --green-700:#2f6f44;
    --green-800:#29603b;
    --green-900:#1e472c;
    --orange:#f48024;
    --orange-050:#fff7f2;
    --orange-100:#fee3cf;
    --orange-200:#fcd0ad;
    --orange-300:#f7aa6d;
    --orange-400:#f48024;
    --orange-500:#f2720c;
    --orange-600:#da670b;
    --orange-700:#bd5c00;
    --orange-800:#a35200;
    --orange-900:#874600;
    --powder:#e1ecf4;
    --powder-050:#f4f8fb;
    --powder-100:#e1ecf4;
    --powder-200:#d1e5f1;
    --powder-300:#b3d3ea;
    --powder-400:#a0c7e4;
    --powder-500:#7aa7c7;
    --powder-600:#5b8db1;
    --powder-700:#39739d;
    --powder-800:#2c5777;
    --powder-900:#1e3c52;
    --red:#d1383d;
    --red-050:#fdf3f4;
    --red-100:#f9d3d7;
    --red-200:#f4b4bb;
    --red-300:#e87c87;
    --red-400:#de535e;
    --red-500:#d1383d;
    --red-600:#c02d2e;
    --red-700:#ac2726;
    --red-800:#942121;
    --red-900:#7a1819;
    --scrollbar:rgba(0,0,0,0.2);
    --silver:#b4b8bc;
    --silver-darker:#9a9c9f;
    --silver-lighter:#e8e8e8;
    --white:#fff;
    --yellow:#fbf2d4;
    --yellow-050:#fdf7e3;
    --yellow-100:#fbf2d4;
    --yellow-200:#f1e5bc;
    --yellow-300:#e6d178;
    --yellow-400:#e9c63f;
    --yellow-500:#ddb624;
    --yellow-600:#cea51b;
    --yellow-700:#b89516;
    --yellow-800:#9f8010;
    --yellow-900:#826a0b;
    }

/*
https://codeburst.io/css-variables-explained-with-5-examples-84adaffaa5bd 
::selection {
    background-color: #338FFF !important;
    color: #fff !important;
} 
*/ 

button,a,select,option,*:focus  {
    outline: none !important;
    outline-style:none;
    box-shadow:none;
    border-color:transparent;
}
button.close{
    color: var(--red);
    opacity: .8;
    font-weight: bold;
    border: 1px solid var(--red);
    padding: 0 5px;
    box-sizing: border-box;
}

.modal-dialog.modal-xl {
    width: calc(100% - 20px) !important;
    margin: 10px auto;
}
.modal-dialog iframe{
    width:100%;min-height:calc(100vh - 75px);display:block;
}

.x-toggle {
    width: 120px;
    height: 26px;
    font-family: RahenLipi, Arial, Helvetica, sans-serif;
    font-size: 15px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    user-select: none;
    overflow: hidden;
    cursor: pointer;
    /* border: 1px solid #aaa; */
    border-radius: 20px;
    text-rendering: optimizeLegibility;
}

.x-toggle input {
    display: none;
}

.x-toggle label {
    display: block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    cursor: pointer;
}

.x-toggle b {
    display: block;
    width: 18px;
    height: 18px;
    line-height: 18px;
    font-weight: normal;
    text-align: center;
    color: #666;
    position: absolute;
    top: 50%;
    left:4px;
    transform: translateY(-50%);
    background: #fff;
    position: absolute;
    /* border: 1px solid #aaa; */
    box-shadow:0 1px 2px 0 rgba(0,0,0,.48);
    border-radius: 50%;
    transition: all 0.2s ease-in 0s;
}

.x-toggle a{
    display: block;
    width: 200%;
    height: 100%;
    box-sizing: border-box;
    padding: 4px 0;
    background: #cbced0;
    transition: all 0.2s ease-in 0s;
    text-decoration: none;
    color: inherit;
}

.x-toggle a:hover{
    filter: contrast(90%) saturate(60%);
}

.x-toggle a::before,.x-toggle a::after{
    display: block;
    width: 50%;
    box-sizing: border-box;
    float: left;
}

.x-toggle a::before{
    content: attr(data-on-text);
    padding-left: 28px;
    text-align: left;
}

.x-toggle a::after{
    content: attr(data-off-text);
    margin-left: 0%;
    padding-right: 28px;
    text-align: right;
}

.x-toggle :checked+label a{
    margin-left: -100%;
    background: #9de0ad;
}

.x-toggle :checked+label b{
   left: 100%;
   margin-left: -24px;
}

@import "_spinner.css"