html, body {
    min-height: 100vh;
    background-color: #202020;
}


.hr-style{
    height: 10px !important;
}

.signup-box{
    background-color : #000000 !important;
    box-shadow: 0 5px 10px rgb(0 0 0) !important;
}

.input-group-text-mob {
   margin: 0 !important;
   padding: 2px 20px 2px 2px !important;
}

.textBlack {
    color: #000000 !important;
}

.body-bg {
    background-color: #010101;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1000'%3E%3Cg %3E%3Ccircle fill='%23010101' cx='50' cy='0' r='50'/%3E%3Cg fill='%23080808' %3E%3Ccircle cx='0' cy='50' r='50'/%3E%3Ccircle cx='100' cy='50' r='50'/%3E%3C/g%3E%3Ccircle fill='%230e0e0e' cx='50' cy='100' r='50'/%3E%3Cg fill='%23131313' %3E%3Ccircle cx='0' cy='150' r='50'/%3E%3Ccircle cx='100' cy='150' r='50'/%3E%3C/g%3E%3Ccircle fill='%23171717' cx='50' cy='200' r='50'/%3E%3Cg fill='%231b1b1b' %3E%3Ccircle cx='0' cy='250' r='50'/%3E%3Ccircle cx='100' cy='250' r='50'/%3E%3C/g%3E%3Ccircle fill='%231f1f1f' cx='50' cy='300' r='50'/%3E%3Cg fill='%23232323' %3E%3Ccircle cx='0' cy='350' r='50'/%3E%3Ccircle cx='100' cy='350' r='50'/%3E%3C/g%3E%3Ccircle fill='%23272727' cx='50' cy='400' r='50'/%3E%3Cg fill='%232b2b2b' %3E%3Ccircle cx='0' cy='450' r='50'/%3E%3Ccircle cx='100' cy='450' r='50'/%3E%3C/g%3E%3Ccircle fill='%232f2f2f' cx='50' cy='500' r='50'/%3E%3Cg fill='%23333333' %3E%3Ccircle cx='0' cy='550' r='50'/%3E%3Ccircle cx='100' cy='550' r='50'/%3E%3C/g%3E%3Ccircle fill='%23383838' cx='50' cy='600' r='50'/%3E%3Cg fill='%233c3c3c' %3E%3Ccircle cx='0' cy='650' r='50'/%3E%3Ccircle cx='100' cy='650' r='50'/%3E%3C/g%3E%3Ccircle fill='%23404040' cx='50' cy='700' r='50'/%3E%3Cg fill='%23444444' %3E%3Ccircle cx='0' cy='750' r='50'/%3E%3Ccircle cx='100' cy='750' r='50'/%3E%3C/g%3E%3Ccircle fill='%23494949' cx='50' cy='800' r='50'/%3E%3Cg fill='%234d4d4d' %3E%3Ccircle cx='0' cy='850' r='50'/%3E%3Ccircle cx='100' cy='850' r='50'/%3E%3C/g%3E%3Ccircle fill='%23525252' cx='50' cy='900' r='50'/%3E%3Cg fill='%23565656' %3E%3Ccircle cx='0' cy='950' r='50'/%3E%3Ccircle cx='100' cy='950' r='50'/%3E%3C/g%3E%3Ccircle fill='%235B5B5B' cx='50' cy='1000' r='50'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: contain;
}

.bgBlack {
    background-color: #000000 !important;
}

.bg1 {
    background-color: #000000 !important;
}

.bg2 {
    background-color: #202020 !important;
}

.border2 {
    border: 2px solid #202020 !important;
}

.signup-background {
    margin: 0;
    /* background-color: #16214E !important; */
    background-color: #202020 !important;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

@keyframes rise {
    0% {
        transform: translateY(0);
        opacity: 0.7;
    }
    100% {
        transform: translateY(-100vh);
        opacity: 0;
    }
}

/* .bubble {
    position: absolute;
    bottom: -50px;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    opacity: 0.7;
    animation: rise 10s infinite ease-in;
}

.bubble:nth-child(1) { left: 10%; width: 30px; height: 30px; animation-duration: 6s; }
.bubble:nth-child(2) { left: 20%; width: 20px; height: 20px; animation-duration: 8s; }
.bubble:nth-child(3) { left: 40%; width: 25px; height: 25px; animation-duration: 7s; }
.bubble:nth-child(4) { left: 60%; width: 35px; height: 35px; animation-duration: 9s; }
.bubble:nth-child(5) { left: 80%; width: 15px; height: 15px; animation-duration: 5s; } */

.signup-input{
    background-color: #7e7e7e !important;
    color: #000000 !important;
    border: none !important;
    box-shadow: 0 3px 10px rgb(0 0 0 / 0.5) !important;
}

.signup-input-mob{
    background-color: #7e7e7e !important;
    border: none !important;
    max-width: 50px !important;
}

.signup-input::placeholder {
    color: #dcdcdc !important;
    opacity: 1 !important;    
}

.rec-pass{
    background: none !important;
    color: #0EA5E0 !important;
    float: right !important;
    border: none !important;
}

.modalhead{
    background-color: #003B61 !important;
}

.modal-bor{
    border: none !important;
}

.mod-body{
    background: rgb(31, 49, 62) !important;
}

.mod-addborder{
    border-top: 1px solid rgb(90, 87, 87) !important;
    border-bottom: 1px solid rgb(90, 87, 87) !important;
}

.sign-icon{
    color: #f40606 !important;
    font-size: 17px !important;
}

.sidebar-icon{
    font-size: 17px !important;
}

.gold{
    border: 2px solid #B9962E !important;
}

.modal-input{
    background-color: #b1cbe1 !important;
    border: none !important;
    box-shadow: 0 3px 10px rgb(0 0 0 / 0.5) !important;
}

.modal-input::placeholder {
    color: #003D64 !important;
    opacity: 1 !important;    
}

.bg-modal{
    background-color: rgba(0, 0, 0, 0.8) !important;
}


.icon-img{
    width: 60px !important;
    height: auto !important;
    border-radius: 50% !important;
}

.text-gold{
    color: rgba(255, 179, 0, 0.909) !important;
}

.text-green{
    color: rgb(62, 128, 0) !important;
}

.text-blue{
    color: rgb(0, 116, 193) !important;
}

.text-brown{
    color: rgba(113, 75, 75, 0.715) !important;
}

.text-silver{
    color: rgb(143, 142, 142) !important;
}

.pkg-img{
    width: 120px !important;
}

.hr-card{
    background-color: #0EA5E8 !important;
    height : 2px !important;
}

.hr-card1{
    background-color: #616CF4 !important;
    height : 2px !important;
    margin-top: 5px !important;
}

.level-select{
    border: 1px solid #fff !important;
    width: 170px !important;
    color: #fff !important;
}

.logo-img{
    height: auto !important;
    width: 200px !important;
}

.ind-logo{
    height: auto !important;
    width: 120px !important; 
}

.text-wh{
    color: white !important;
}

.textWhite {
    color: #ffffff !important;
}

.mainDiv{
    min-height: 270px !important;
    max-height: 270px !important;
    background-image:linear-gradient(to bottom, #0a3391 30%, #000429 100%);
}

.iconImg{
    width: 70px !important;
    height: 70px !important;
    margin: 0% auto;
    opacity: 1 !important;
    border-radius: 50% !important;
    border: 2px solid white !important;

}

.margin-top{
    margin-top: 15px !important;
}

.padding-left{
    padding-left: 20px !important;
}

.mainDiv1{
    min-height: 350px !important;
    max-height: 400px !important;
    overflow: hidden !important;
}

.text-white1{
    color: #ffd588 !important;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.bg-white1{
    background-color: rgb(255, 238, 238) !important;
}

input[type="checkbox"].bg-white1:checked {
    background-color: #81a0ff !important;
    border-color: #000000 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M6.173 12.927a.5.5 0 0 1-.707 0L2.146 9.607a.5.5 0 1 1 .708-.708L6.5 12.25l6.646-6.647a.5.5 0 0 1 .708.708l-7 7z'/%3E%3C/svg%3E") !important;
}

.log-btn{
    height: 30px !important;
    padding: 10px !important;

}

.dark-bg{
    background-color: #003B61 !important;
}

.pkgImgIndex{
    width: 150px !important;
    height: auto !important;
}

.text-muted1{
    color: #bad3e9 !important;
}

.text-muted2{
    color: #b1b1b1 !important;
}

.div-shadow{
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.8) !important;
}

.pkg-img2{
    width: 150px !important;
    height: auto !important;
}

.doCenter{
    display: flex;
    justify-content: center;
}

.qrImg{
    width: 150px !important;
    height: auto !important;
    margin: 0 auto !important;
}

.gold-background {
    background: linear-gradient(135deg, #FFD700, #FFA500, #FFB700);
    background-size: 200% 200%;
    animation: goldGlow 5s ease infinite;
    color: #000; /* optional: dark text for contrast */
}

@keyframes goldGlow {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.gold-border {
    border: 2px solid transparent;
    border-image: linear-gradient(135deg, #FFD700, #FFA500, #FFB700);
    border-image-slice: 1;
    border-radius: 6px; /* optional */
}

.border3 {
    border: 1px solid #696969 !important;
}

.bg3 {
    background-color: #696969 !important;
}

.text3 {
    color: #696969 !important;
}

.inner-input{
    background-color: #7e7e7e !important;
    color: #000000 !important;
    border: none !important;
    box-shadow: 0 3px 10px rgb(0 0 0 / 0.5) !important;
}

.inner-input::placeholder{
    color: #000 !important;
}

.inner-input2{
    background-color: #16214E !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 3px 10px rgb(0 0 0 / 0.5) !important;
}

.inner-input2::placeholder{
    color: #696969 !important;
}

.hr-card2 {
    height: 2px !important;
    background-color: white !important;
    opacity: 50% !important;
}

/* Search input */
.dataTables_filter input {
    background-color: #202020 !important;
    color: #fff !important;
    border: 1px solid #444;
}

/* Show entries dropdown */
.dataTables_length select {
    background-color: #202020 !important;
    color: #fff !important;
    border: 1px solid #444;
}

/* Pagination buttons */
.dataTables_paginate .paginate_button {
    background-color: #202020 !important;
    color: #fff !important;
    border: 1px solid #444;
}

.dataTables_paginate .paginate_button.current {
    background-color: #333 !important;
    color: #FFD700 !important; /* Optional: gold color for active */
}

.pkg-list {
    margin: 0 !important;
    padding: 0 !important;
    margin-left: -15px !important;
}

.birder-direct {
    border-bottom: 2px solid #444 !important;
}

.wallet-img {
    width: 30px !important;
    height: auto !important;
    text-align: center !important;
}

.coin-img {
    width: 100px !important;
    height: auto !important;
}

.supSelect {
    background-color: #202020 !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    height: 40px !important;
}

.tArea {
    background-color: #202020 !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
}

.ootp {
   background-color: #202020 !important; 
}

.basic-input {
    background-color: #202020 !important;
}

.h40 {
    height: 40px !important;
    border: 1px solid rgba(143, 221, 243, 0.5) !important;
}

.select-height {
    height: 40px !important;
}