/* CYMART PERFORMANCE V1 - default theme CSS after icon sheets; source order preserved */

/* ---- SOURCE: /templates/default/css/theme.css ---- */
.page-pre-loader {
 display: none !important;
}
input[type="button"],select,input[type="text"],textarea{}
button:focus,a:focus{outline: none}
body{
 font-size:1rem;
 font-family:'myriad-pro', sans-serif;
 position: relative;
 background: #78665;
}
body.open-theme-selection{
 margin-right: 300px;
 padding:0 !important;
 overflow: auto;
}
.row{
 margin-left: -12px;
 margin-right: -12px;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
 padding-right: 12px;
 padding-left: 12px;
}

img{
 max-width:100% !important;
}
a{
 color:#030303;
}
a:hover{
 text-decoration: none;
 color:black;
}
p{margin-bottom: 0.3rem;}

label{
 margin-bottom: 0;
}
.badge{
 font-weight: 500;
}
h1,h2,h3,h4,h5{

}
header{
 background: white;
}
.center{
 display: flex;
 justify-content: center;
 align-items: center;
 height: 100%;
}

.content-loader{
 position: absolute;
 height: 100%;
 width: 100%;
 left: 0;
 top: 0;
 z-index: 99999;
 background: rgba(0,0,0,0.8);
 color:white;
 border-radius: 5px;
 display: none;
}
.btn-primary:hover{
 border-color: transparent;
}
table img{ min-width: 16px;}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
 -webkit-box-shadow: 0 0 0 30px white inset !important;
}
input:-webkit-autofill {
 -webkit-text-fill-color: black !important;
}

.container {
 max-width: 1400px;
}
#id-verification .inner-container{
 margin: 0 -15px;
}


body.full .container{
 max-width: 100%;
}
body.transparent header{
 position:fixed;
 left:0;
 width:100%;
 z-index:99
}
body.transparent .header-bottom,body.transparent .header-top,body.transparent .header-middle{
 background: #00000024 !important;
 border:none
}
body.transparent header a,body.transparent .nav.navbar-light .nav-link,body.transparent header .text-muted{
 color:white !important;
}
body.transparent .dropdown-menu,body.transparent .navbar-products .nav-item:hover,body.transparent .header-top .nav-item:hover{
 background: #0009;
}
body.transparent .dropdown-item:focus,body.transparent .dropdown-item:hover{
 background: #0009 !important;
}
body.transparent .menu-column,body.transparent .submenu-column{
 border-right:#ffffff14 solid 1px
}

.text-muted{
 font-size:80%
}

a.btn {
 padding: 0;
 margin-right: 0;
 font-weight: 600;
 color: #fff;
 font-size: 0.9rem;
}
.lg-btn{
 font-size: 1.5rem;
}


.header-top{
 border-bottom:#f6f6f6 solid 1px;
}
.header-top .nav-item:hover{
 background: #fff;
}
.header-top .nav-item:hover .nav-link{
 color:black;
}
.header-middle{
 /*box-shadow:0px 2px 2px 0px rgb(0, 0, 0);*/
}

.bg-secondary,button.btn-secondary{
 border:none !important;
 padding:10px 20px;
 color:white;
}

button.btn.btn-secondary{
 background: #6c757d !important;
}

.bg-hover:hover,.bg-hover:focus,.dropdown-item:focus, .dropdown-item:hover{
 background: #f6f6f6 !important;
 transition: all 0.3s ease 0s;
 border-radius: 5px;
}

.navbar-brand {
 font-weight: bold;
 margin-left:15px;
}
.navbar-brand img{
 max-height:50px;
}
.avatar-img{
 margin-right: 15px;
 position: relative;
}
.avatar-img:after{
 content: '';
 position: absolute;
 left: -8px;
 height: 40px;
 width: 40px;
 background: rgba(0, 0, 0, 0.07);
 border-radius: 50%;
 top: -10px;
}
.breadcrumb {
 background-color: transparent;
 align-items: center;
 color:#888;
 font-size:0.8rem;
 margin-bottom: 0;
 padding-top:0;
 padding-bottom:0;
}
.breadcrumb a{
 padding:15px 5px;
 color:#888
}
.page-container{
 padding:0 1rem;
}
.page-container .page-title{
 padding:0;
}
.modal-body .page-container,.page-container .page-container{
 padding:0;
}
.serchcontent{
 padding: 15px;
 list-style: none;
 background: #f5f5f5;
 margin-top: 5px;
 border: #ddd solid 1px;
 border-radius: 5px;
}
.serchcontent li.dropdown-header{
 padding: 0;
 list-style: none;
 font-weight: 600;
 text-transform: uppercase;
 margin-top: 15px;
}
.serchcontent li.dropdown-item{
 padding:0 10px;
}
.serchcontent li.dropdown-item a{
 text-overflow: ellipsis;
 overflow: hidden;
 border-bottom: #ececec solid 1px;
 color:black !important;
}
.serchcontent li:hover{
 background: #f4f4f4;
}
.serchcontent li.dropdown-header:hover{
 background: transparent;
}
.rounded-5{
 border-radius: 0 0 5px 5px !important;
}

.login-captcha {
 width: 150px;
 margin-right: 10px;
 height: 44px;
 border-radius: 3px;
}


.overflow-auto{
 overflow: auto;
 height:100%;
}
.no-result-found{
 opacity: 0.3;
 margin-top: 50px;
}
.flag {
 display: inline-block;
}

.page-title{
 margin-bottom: 1rem;
 opacity: 0.8;
 font-weight: 100;
 text-transform: uppercase;
 padding:0 1rem;
}
h5.page-title{
 margin-bottom: 1rem;
 padding:0;
}
.page-title.inner-page-title{
 padding: 0 !important;
}
.page-index .page-content {
 padding: 0 !important;
}
.content-title{
 font-size: 1.3rem;
 color: black;
}
.content-category{
 padding:0;
}
.content-category .list-group-item{
 border:none;
 border-bottom:#ddd solid 1px;
 border-radius: 0 !important;
 margin-bottom: 0;
 padding: 10px 3px;
}
.page-blog .blockquote{
 border-bottom:#ddd solid 1px;
}
.content-category > .list-group:last-child .list-group-item:last-child,.page-blog .blockquote:last-child{
 border-bottom: none;
}
h3.h3{
 text-align: left;
 position: relative;
 margin-top: 3rem;
}
h3.h3.or{
 text-align: center;
}
h3.h3.or.gray span.text-muted:before{
 background: whitesmoke;
}
h3.h3.or span{
 padding: 0 1rem;
}
h3.h3 span{
 display: inline-block;
 z-index: 1;
 position: relative;
 border-bottom: none;
 padding: 10px 0 0 0;
 margin-bottom: 1rem;
}
h3.h3 span.text-muted{
 font-size: 14px;
 text-transform: uppercase;
 color: #d0d0d0;
}
h3.h3 span.text-muted:before{
 background: white;
}
h3.h3 span:before{
 content: '';
 height: 100%;
 width: 100%;
 background: #f4f4f4;
 position: absolute;
 z-index: -1;
 top: 0;
 left: 0;
}

h3.h3:after,h3.h3:before{
 content: '';
 position: absolute;
 border-bottom:#dfe2e6 solid 1px;
 height: 1px;
 width: 50%;
 z-index: 0;
 top: 50%;
}
h3.h3.box-white span:before{
 background: #fff;
}
h3.h3.box-white:after,h3.h3.box-white:before{
 border-bottom: #fff solid 1px;
}

h3.h3:after{
 left: 0;
}
h3.h3:before{
 right: 0;
}



.input-captcha{
 display: flex;
 align-items: center;
}
.input-captcha span{
 margin-right:10px;
}
.input-captcha span img{
 border-radius: 3px;
 height:46px;
}
.input-captcha .form-control{
 text-transform: uppercase;
}
.input-captcha .form-control{

}

.card{
 border:none;
 background: white;
 border-radius:5px;
 box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 2px 0px;
 padding:1.5rem;
}
.card.card-min-height{
 height: 100%;
}
.card .card-title-text{
 text-transform: uppercase;
 font-size: 90%;
 opacity:0.8
}
.card.card-productdetail {
 border-top-left-radius: 0;
 border-top-right-radius: 0;
 margin-top: -15px;
}
.card .card{
 box-shadow: none;
 padding:0;
 border-radius: 0;
}

.col-lg-9 .col-lg-3.col-product {
 -ms-flex: 0 0 33.33%;
 flex: 0 0 33.33%;
 max-width: 33.33%;
}

.mce-panel{border-color:#d4d4d4 !important;background: white !important;}

.table tr.href{
 cursor:pointer;
}

.table.compaq .replay-code{
 height: 25px;
 overflow: auto;
}

.d-row{
 display:flex;
 justify-content: space-between;
 align-items: center;
 flex-wrap: wrap;
}

.pagination{
 width: 100%;
 justify-content: flex-start;
 margin-top: 1.5rem;
 border-radius: 0;
 align-items: center;
}
.pagination .pages-dropdown{
 margin-bottom: 1rem;
}
.pagination ul{
 margin-left: auto;
}
.pagination a,.page-item:first-child .page-link{
 padding: 12px 20px;
}
.pagination .active{
 background: #eee;
}
.set-track{
 margin-left:12px;
}
.card-retail-order .retail-item{
 border-bottom:#ddd solid 1px;
 padding-top:1rem
}
.card-retail-order .retail-item .track-order{
 margin-top:1.2rem;
}
.card-retail-order .retail-item:last-child{
 border:none
}

.textgreen, .textred, .textblue, .textyellow {
 white-space: nowrap;
 display: inline-block;
 padding: 0px 5px;
 border-radius: 3px;
 font-size: 75%;
}
.textgreen,.statusA{
 color: #fff;
 background-color: #28a745;
}
.textred,.statusR{
 color: #fff;
 background-color: #dc3545;
}
.textblue,.statusP{
 color: #fff;
 background-color: #007bff;
}
.textyellow,.statusY{
 color: #fff;
 background-color: orange;
}


.small, small{
 font-size:90%;
}


.imeiservices .service,.serverservices .service,.orderdetail{display:none}
.imeiservices .service.active,.serverservices .service.active,.orderdetail.active{display:block}



.modal-ajax .modal-body a[data-target="#modal-ajax"],.modal-ajax .group-name{
 display: none;
}

.form-group {
 position: relative;
}
.form-group .form-label,.form-group  label:not(.custom-control-label) {
 font-size: 13px;
}
.form-group label.label-checkbox{
 font-size: 15px;
}

.form-inline .form-group{

}

.custom-control{

}
.custom-control.custom-radio{
 padding-left: 1.5rem;
}
.custom-controls.tickbox-control .controls{
 margin-left: 20px;
}
.custom-controls .form-control,.custom-controls .chosen-container-single{
 width: 94% !important;
 display: inline-block;
 margin-right: 10px;
}
select.form-control:not([size]):not([multiple]){
 height: auto;
}
.form-control.loading {
 background:white url('../images/loading.gif') no-repeat right center;
 background-size: 10%;
}
.input-group>.form-control:focus{
 box-shadow: none;
}
select.form-control {
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
}
.card-search .form-group{
 margin-bottom: 0;
}
#tcs-table{
 min-height: 400px;
}
.input-daterange input{
 text-align: left;
}

.ajax-responsive.loading{
 height:300px;
 width:200px;
 margin: auto;
 background:url('../images/loading.gif') no-repeat center;
 background-size:20%;
}

.hot{
 font-weight: normal;
 right: 10px;
 position: absolute;
 top: -10px;
 transform: rotate(90deg);
}
.free{
 font-weight:normal;
}
.free,.hot{
 text-transform: uppercase;
 border-radius:0px;
}

.card-product{
 overflow: hidden;
 border: transparent solid 1px;
 transition: all 0.3s;
 display: flex;
 height: 100%;
 flex-direction: column;
}
.card-product:hover{
 transition: all 0.3s;
 /*box-shadow: 0px 0px 0px 5px rgba(0,0,0,0.03);*/
}
.card-product .quick-view{
 right: 0px;
 bottom: -20px;
 position: absolute;
 opacity: 0;
 visibility: hidden;
 z-index: 99;
 background: #888;
 padding: 5px 10px;
}
.card-product:hover  .quick-view{
 opacity: 1;
 visibility: visible;
 bottom: 0px;
 background: #f4f4f4;
 transition: all 0.3s ease 0s;
 border-radius: 5px;
}
.card-product .quick-view a{
 color:#888
}

.card-product .product-info{
 position: absolute;
 left: 0;
 right: 0;
 z-index: 99;
 bottom: -150%;
 background: white;
 padding: 20px 20px 0 20px;
 opacity: 0;
 transition: all 0.3s ease 0s
}
.card-product:hover  .product-info{
 bottom:0;
 opacity: 1;
 transition: all 0.3s ease 0s
}
.card-group.card-product  .product-info{
 display: none;
}
.imagemode .card-group.card-product:hover .product-info{
 display: block;
}
.card-product  .service-name,.card-product .truncate-text{
 color:black
}

.imagemode .card-product{
 padding: 0;
 border-radius: 15px;
 min-height: 150px;
}
.imagemode .card-img-top {
 margin-top: 0 !important;
}
.imagemode .card-product .card-body{
 padding: 0;
}
.imagemode .card-product:not(.card-group) .card-info{
 display: none !important;
}
.imagemode .hot{
 top:6px
}
.imagemode .card-product .product-info{
 background: #ffffffeb;
}
.imagemode .card-product:hover .quick-view {
 border-radius: 10px 0 0;
}
.imagemode .card-group .card-info{
 opacity: 0;
 visibility: hidden;
 position: absolute;
 bottom: 0;
 width: 100%;
 padding-bottom: 1rem;
 background: white;
}
.imagemode .card-group:hover .card-info{

 opacity: 1;
 visibility: visible;
}

.table-invoice-items .table td{
 vertical-align: middle;
}
.price-details table td{
 white-space: nowrap;
 padding: 0.5rem;
 border-top:none
}
.price-details table tr td:last-child{
 text-align: right;
 padding-left: 1rem;
 min-width: 150px;
}
.price-details table tr:hover{
 background: transparent !important;
}

.price{
 padding: 0.5rem 0;
 overflow: hidden;
 position: relative;
 font-size: 16px;
 font-weight: bold;
}
.prefix,.suffix{
 opacity: 0.6;
 font-weight: 300;
}
header .prefix,header .suffix{
 opacity: 1;
}
.btn-addtocart{
 text-transform: uppercase;
 transition: all 0.3s;
 position: absolute;
 left:-100px;
 background: white;
}
.card-product:hover  .btn-addtocart{
 left: 0;
 transition: all 0.3s;
}

.related-parent{
 top:0;bottom:0;left:0;right:0;
}

.text-overflow{
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}
.carousel-control-next-icon, .carousel-control-prev-icon {
 background-color: #0000001c !important;
 height: 50px;
 background-size: 50%;
 border-radius: 3px;
 width: 30px;
}
ul.sort-by{
 list-style: none;
 display: block;
 width: 100%;
 padding:0;
}
.no-wrap,.nowrap{
 white-space: nowrap;
}

ul.sort-by li a{
 display: block;
 padding: 6px 15px;
 color: #999;
 font-size: 0.9rem;
}
ul.sort-by li a.selected{
 color: #000000;
}
ul.filter-by{
 margin:0px;
 padding:0;
 list-style: none;
 display: flex;
}

.modal .d-none-modal{
 display:none !important;
}
.modal .d-block-modal{
 display:block !important;
}

.modal-header{
 border-bottom:none;
 color: white;
 align-items: center;
}
.modal-header .close {

 opacity: 1;
 width: 40px;
 padding: 0;
 font-weight: normal;
 text-shadow: none;
 color: white !important;
}
.modal-content{
 border:none;
 max-height: 800px;
 overflow: hidden;
}
.modal-title{

}
.modal-menu .modal-content{
 max-height: 100%;
}
.modal-body{
 padding:1.5rem 1.5rem;
 overflow: auto;
}
.modal-body .container{
 padding:0
}
.modal .card{
 box-shadow: none;
 padding:0;
 background: transparent;
}
.modal .modal-xl{
 max-width: 1280px;
}
.modal-theme-settings .modal-header{
 background: transparent !important;
}
.border{
 border-color:#ced4da
}
.border-dotted{
 border-style:dashed !important;
}
.alert1{
 border-radius: 4px;
 margin-bottom: 1.5rem;
}
.alert1.alert-error {
 color: #721c24;
 background-color: #f8d7da;
 border-color: #f5c6cb;
 list-style: none;
}
.alert1.alert-success {
 color: #155724;
 background-color: #d4edda;
 border-color: #c3e6cb;
 list-style: none;
}
.alert-newsletter{
 padding: 10px;
 border-radius: 3px;
}
.alert {
 display:none;
 font-size: 14px;
 font-weight: 600;
 padding: 0.75rem;
}
.alert[data-toggle="tooltip"]{
 cursor: pointer;
}
.alert1.alert{
 display:flex;
 align-items: center;
}
.alert li{
 list-style: none;
}
.alert-danger{
 background: #bf0718;
 border-color: #bf0718;
 color:white;
}
.alert-success
{
 background: #08af2e;
 border-color: #08af2e;
 color:white;
}
.alert-info {
 color: white;
 background-color: #0ab0ca;
 border-color: #0ab0ca;
}
.alert a{
 padding: 0 10px;
 background: white;
 border-radius: 3px;
 color:black;
 margin-left: auto;
 text-align: center;
 float: right;
}


.modal .alert{
 position: relative;
 top: auto;
 right: auto;
}
.alter:nth-child(2n) .hover{
 /*box-shadow: 0 0 20px 10px rgba(34, 34, 34, 0.04);*/
}
.alter .hover:hover{
 box-shadow: 0 0 20px 10px rgba(34, 34, 34, 0.04);
}


.reloadcaptcha {
 height: 15px;
 width: 15px;
 display: block;
 background:#fff url(../images/captcha-reload.png) no-repeat center;
 background-size: auto auto;
 background-size: cover;
 vertical-align: middle;
 margin-left: 5px;
 cursor: pointer;
 z-index: 99;
 position: absolute;
 right: 10px;
 top: 14px;
}



.form h5{
 text-transform: uppercase;
 color: #000;
 padding: 0.5rem 0;
 margin-bottom: 4px;
 font-size: 15px;
}

.clear{clear:both}

.chosen-container{
 width: 100% !important;
}
.chosen-container .chosen-results li.active-result{
 clear:both;
 display: list-item;
 cursor: pointer;
 font-weight: normal;
 text-transform: capitalize;
 white-space: nowrap;
}

.chosen-container-single .chosen-single,input[type="button"],button[type="button"],input[type="submit"],button[type="submit"],.form-control{
 padding:10px;
 height: auto;
}
input[type="button"],button[type="button"],input[type="submit"],button[type="submit"]{
 padding: 10px 20px;
}

.chosen-container-single .chosen-single {
 height: auto;
 border-color: #ced5da;
 background: #fff;
 box-shadow: none;
 border-radius: 3px;
 font-size: 14px;
 white-space: normal;
 min-width: 150px;
}

.material-textbox .chosen-container-single .chosen-single,.material-textbox .form-control{
 padding: 10px 0;
 border-radius: 0;
 border: none;
 border-bottom: #888 solid 1px;
}

.chosen-container-single .chosen-single span{
 white-space: normal;
}
.chosen-container .chosen-results li.group-result {
 font-size: 1rem;
 color: #000;
}
.big-chosen .chosen-container-single .chosen-single {
 background: #fff;
 font-size: 20px;
 padding: 20px;
 height: auto;
 box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 2px 0px;
 border:none
}
.chosen-container .chosen-drop{
 border: #aaa solid 1px;
}
.big-chosen .chosen-container .chosen-results{
 max-height: 500px;
}
.big-chosen .chosen-container-single .chosen-search input[type=text] {
 padding: 7px 20px 7px 5px;
 background: #eee;
}
.big-chosen .chosen-container .chosen-results li.active-result{
 padding-left: 25px;
}
.chosen-container-active.chosen-with-drop .chosen-single{
 background-image: none;
 position: relative;
}
.chosen-container-single.chosen-with-drop:after{
 position: absolute;
 content: '';
 height: 2px;
 background: #fff;
 left: 1px;
 z-index: 9999;
 bottom: 0px;
 right: 1px;
}
.chosen-container-single .chosen-single img{
 margin-top:10px
}
.chosen-container-single .chosen-single img,.chosen-results img{
 height:16px;
 float:right;
}
.chosen-container-single{
 font-size: 1.1rem;
 margin-right:5px;
 color:#000;
 opacity: 1;
}
.chosen-container-single .chosen-single div b{
 margin-top:5px;
 height:80%;
 display: none;
}
#service_id_chosen .chosen-drop{
 width: 500px;
 border-radius: 0 5px 5px 5px;
 padding:0.5rem
}
.big-chosen #service_id_chosen .chosen-drop{
 width:100%;
 border:none;
 border-radius:  0 0 5px 5px;
}

.mx-height{
 max-height:300px;overflow: auto
}




.mce-stack-layout-item .mce-btn {
 border-color: transparent !important;
 text-shadow: 0 1px 1px rgba(255,255,255,0.75) !important;
 border-radius: 0px !important;
 -webkit-box-shadow:none !important;
 -moz-box-shadow: none !important;
 box-shadow: none !important;
 background-color: transparent !important;
 background-image: none !important;
}




/*.box {
 display: table;
 width: 100%;
 height: 100%;
 border-spacing: 0;
 table-layout: fixed;
}
.box .box-col {
 display: table-cell;
 vertical-align: top;
 height:100%;
}
.box .box-row {
 display: table-row;
 height: 100%;
}
.box .box-row .box-cell {
 position: relative;
 width: 100%;
 height: 100%;
 overflow: auto;
 -webkit-overflow-scrolling: touch;
}
.box .box-inner {
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
}*/

/*.full .container{
    max-width: 100%;
}*/
input[type="checkbox"], input[type="radio"]{
 margin-right:8px;
}

.carousel.index-banner{

}
.client-area{
 margin-top: -1px;
}
.carousel.slide-products{
 position: relative;
 min-height: 250px;
 background-color: white;
 display: flex;
 align-items: center;
}
.carousel.slide-products .carousel-inner{
 padding: 10px;
}
.carousel.slide-products .carousel-indicators{
 margin: 0;
}
.carousel-inner .position-relative img{max-width: 100%;}

.carousel.slide-products .carousel-indicators{
 border-top: #eee solid 1px;
 margin-top: 15px;
}
.carousel-indicator-img{
 position: relative;
 border-top: none;
 display: block;
 margin: 0;
 bottom:auto;
}
.carousel-indicator-img li{
 text-indent: inherit;
 height: auto;
 cursor: pointer;
 padding: 15px 0;
 width: 50px;
 border-bottom:#ddd solid 1px;
}
.carousel-indicator-img li:last-child{
 border:none
}
.text-400{
 font-size:20px;
}

.row-center{
 align-items: center;
}
.news2 .carousel-inner{
 min-height: 150px;
}

.text-underline{
 text-decoration: underline;
}


.service-list{
 height: calc(100vh - 340px);
}
.service-list.service-list-box{
 height: auto;
}
.service-list .border-bottom{
 padding-left: 0 !important;
}
.default .min-height{
 min-height: calc(100vh - 549px);
 padding-bottom: 6rem;
}
.no-cart .min-height{
 min-height: calc(100vh - 435px);
}
.service-information{
 /*height:calc(100vh - 610px) !important;*/
 overflow: auto;
}



.index.transparent .navbar-container{
 background: rgba(0,0,0,0.1);
}


.fixed-height{
 max-height: calc(100vh - 280px); overflow: auto;
}

.carousel-item a{
 color: #8a8a8a;
}

.order-total{
 font-size: 35px;
}

.datepicker-dropdown.dropdown-menu{
 border:1px solid rgba(0,0,0,.15);
 border-radius: 5px;
 margin: 0;
}
.shadow-sm{
 box-shadow: 2px 5px 10px rgba(0,0,0,0.1) !important;
}

.big-font{
 font-size: 40px;
 font-weight: 100;
 margin-bottom: 0;
}

h3.text-400{
 font-size: 1.3rem;
 font-weight: 600;
}

.tab-content .tab-pane{

}

.lg-space{
 margin: 70px 0 30px;
}
.card-link{
 color:#6b6b6b
}

.border.active{
 border-color: orange !important;
}
.border.copied{
 border-color:#00bfe2e6 !important
}

.remaining-time .progress{
 height: 30px;
}
.spinner-loader {
 padding: 5rem;
 align-items: center;
 text-align: center;
}



.sa-icon {
 width: 80px;
 height: 80px;
 border: 4px solid gray;
 -webkit-border-radius: 40px;
 border-radius: 40px;
 border-radius: 50%;
 margin: 20px auto;
 padding: 0;
 position: relative;
 box-sizing: content-box;
}

.sa-icon.alert-success {
 border-color: #4CAF50;
}

.sa-icon.alert-success::before, .sa-icon.alert-success::after {
 content: '';
 -webkit-border-radius: 40px;
 border-radius: 40px;
 border-radius: 50%;
 position: absolute;
 width: 60px;
 height: 120px;
 background: white;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}

.sa-icon.alert-success::before {
 -webkit-border-radius: 120px 0 0 120px;
 border-radius: 120px 0 0 120px;
 top: -10px;
 left: -30px;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
 -webkit-transform-origin: 60px 60px;
 transform-origin: 60px 60px;
}

.sa-icon.alert-success::after {
 -webkit-border-radius: 0 120px 120px 0;
 border-radius: 0 120px 120px 0;
 top: -10px;
 left: 30px;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
 -webkit-transform-origin: 0px 60px;
 transform-origin: 0px 60px;
}

.sa-icon.alert-success .sa-placeholder {
 width: 80px;
 height: 80px;
 border: 4px solid rgba(76, 175, 80, .5);
 -webkit-border-radius: 40px;
 border-radius: 40px;
 border-radius: 50%;
 box-sizing: content-box;
 position: absolute;
 left: -4px;
 top: -4px;
 z-index: 2;
}

.sa-icon.alert-success .sa-fix {
 width: 5px;
 height: 90px;
 background-color: white;
 position: absolute;
 left: 28px;
 top: 8px;
 z-index: 1;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
}

.sa-icon.alert-success.animate::after {
 -webkit-animation: rotatePlaceholder 4.25s ease-in;
 animation: rotatePlaceholder 4.25s ease-in;
}

.sa-icon.alert-success {
 border-color: transparent\9;
}
.sa-icon.alert-success .sa-line.sa-tip {
 -ms-transform: rotate(45deg) \9;
}
.sa-icon.alert-success .sa-line.sa-long {
 -ms-transform: rotate(-45deg) \9;
}

.animateSuccessTip {
 -webkit-animation: animateSuccessTip 0.75s;
 animation: animateSuccessTip 0.75s;
}

.animateSuccessLong {
 -webkit-animation: animateSuccessLong 0.75s;
 animation: animateSuccessLong 0.75s;
}

@-webkit-keyframes animateSuccessLong {
 0% {
  width: 0;
  right: 46px;
  top: 54px;
 }
 65% {
  width: 0;
  right: 46px;
  top: 54px;
 }
 84% {
  width: 55px;
  right: 0px;
  top: 35px;
 }
 100% {
  width: 47px;
  right: 8px;
  top: 38px;
 }
}
@-webkit-keyframes animateSuccessTip {
 0% {
  width: 0;
  left: 1px;
  top: 19px;
 }
 54% {
  width: 0;
  left: 1px;
  top: 19px;
 }
 70% {
  width: 50px;
  left: -8px;
  top: 37px;
 }
 84% {
  width: 17px;
  left: 21px;
  top: 48px;
 }
 100% {
  width: 25px;
  left: 14px;
  top: 45px;
 }
}
@keyframes animateSuccessTip {
 0% {
  width: 0;
  left: 1px;
  top: 19px;
 }
 54% {
  width: 0;
  left: 1px;
  top: 19px;
 }
 70% {
  width: 50px;
  left: -8px;
  top: 37px;
 }
 84% {
  width: 17px;
  left: 21px;
  top: 48px;
 }
 100% {
  width: 25px;
  left: 14px;
  top: 45px;
 }
}

@keyframes animateSuccessLong {
 0% {
  width: 0;
  right: 46px;
  top: 54px;
 }
 65% {
  width: 0;
  right: 46px;
  top: 54px;
 }
 84% {
  width: 55px;
  right: 0px;
  top: 35px;
 }
 100% {
  width: 47px;
  right: 8px;
  top: 38px;
 }
}

.sa-icon.alert-success .sa-line {
 height: 5px;
 background-color: #4CAF50;
 display: block;
 border-radius: 2px;
 position: absolute;
 z-index: 2;
}

.sa-icon.alert-success .sa-line.sa-tip {
 width: 25px;
 left: 14px;
 top: 46px;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}

.sa-icon.alert-success .sa-line.sa-long {
 width: 47px;
 right: 8px;
 top: 38px;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
}

@-webkit-keyframes rotatePlaceholder {
 0% {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
 }
 5% {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
 }
 12% {
  transform: rotate(-405deg);
  -webkit-transform: rotate(-405deg);
 }
 100% {
  transform: rotate(-405deg);
  -webkit-transform: rotate(-405deg);
 }
}
@keyframes rotatePlaceholder {
 0% {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
 }
 5% {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
 }
 12% {
  transform: rotate(-405deg);
  -webkit-transform: rotate(-405deg);
 }
 100% {
  transform: rotate(-405deg);
  -webkit-transform: rotate(-405deg);
 }
}






#captchaimgs{margin-right: 5px;max-width:90% !important;}



.wrap-normal{white-space: normal}
.index-content p {
 margin: 0;
 color: #6f6f6f;
 font-size: 12px;
}

.card-img-top{width: auto;max-width: 150px}
.loader-icon{width: auto !important}
.modal-body p{text-align: left !important;}
.modal-body .page-title{
 display: none;
}
.cursor-pointer{
 cursor: pointer;
}
.bg-light{
 background: #f5f5f5 !important;
}
.bg-gray{
 background: #f5f5f5 !important;
}
.btn:not(:disabled):not(.disabled) {
 cursor: pointer;
 min-width: 100px;
}
button.btn.btn-dark{
 background-color: #222 !important;
}
.btn.btn-light{
 background: #eee !important;
 color:black !important;
 border: none;
}





.navbar-nav{
 align-items:center
}
.navbar-xl {
 display: flex;
 align-items: center;
}
.nav.navbar-light .nav-link{
 color:rgba(0,0,0,0.9)
}
.nav.navbar-dark .nav-link,
.header-bottom.header-middle .navbar-expand-lg .navbar-nav .nav-link,
.header-bottom.header-middle .navbar-expand-lg .navbar-nav .nav-item:hover .nav-link,
.header-bottom.header-middle .navbar-brand,
.header-bottom.header-middle .navbar-toggler{
 color:rgba(255,255,255,0.9)
}
.nav-link:focus  {

}
.nav-link .fa-chevron-down,.nav-link .fa-chevron-right,.dropdown-item .fa-chevron-right{
 font-size:12px;
 margin-left:5px;
}
.profile .nav-link.dropdown-toggle {
 padding:11px !important;
}




.navbar-expand-lg .navbar-nav .nav-link{
 padding:18px;
 position: relative;
 white-space: nowrap;
}
.navbar-expand-lg .navbar-nav .nav-item:hover .nav-link{

}
.navbar-expand-lg .navbar-nav .nav-item .nav-link:not(.bg-secondary)::before{
 position: absolute;
 content: '';
 bottom: 0;
 height: 3px;
 background: #ffdd7c;
 left: 0;
 opacity: 0;
 width:0;
}
.navbar-expand-lg .navbar-nav .nav-item:hover .nav-link:not(.bg-secondary)::before{
 width:100%;
 opacity: 1;
 transition: all 0.3s ease 0s;
}
.navbar-expand-lg .navbar-nav .nav-item-curlang .nav-link{
 opacity: 0.6;
 font-size: 12px;
}

.card-announcement{
 border: none;
}
.card-announcement .card{
 margin-bottom: 0.5rem;
}
.news-date{
 font-size: 12px;
 opacity: 0.6;
}
.news-list{
 border-bottom:solid 1px #eee;
 padding:10px 0;
}
.news-list:last-child{
 border-bottom:none;
}

header .dropdown-menu{
 min-width:100%;
 border: none;
 border-radius:0 0 5px 5px;
 margin:0px 0 0 0;
 box-shadow: 2px 5px 10px #0000001a;
 top:130%;
 opacity: 0;
 visibility: hidden;
 padding: 15px;
 transition: all 0.2s ease 0s;
}
header .dropdown-menu:not(.onclick){
 display: inline-block;
}
header .dropdown:hover .dropdown-menu:not(.onclick){
 opacity: 1;
 visibility: visible;
 top:100%;
 transition: all 0.1s ease 0s;
 z-index:9999
}

.dropdown-header {
 font-size: 1rem;
 color: #000;
 white-space: nowrap;
 text-transform: uppercase;
 padding:0.5rem;
 font-weight: 600;
}
.dropdown-divider{
 border-top: 3px solid #f5f5f5;
}
.dropdown-toggle::after{
 border-top: .3em solid;
 border-right: .3em solid transparent;
 border-bottom: 0;
 border-left: .3em solid transparent;
 border-top-color: #757575;
 display:none
}

.dropdown-item{
 color: #525252;
 display: block;
 padding:0.25rem 1rem;
 transition: all 0.1s ease 0s;
 cursor: pointer;
}

header  .dropdown-menu.dropdown-menu-inline .dropdown-item {
 width: 16.3%;
 display: inline-block;
 padding:0.25rem 0.5rem
}
header .dropdown-menu.dropdown-menu-block .dropdown-item {
 width: 100%;
 display: block;
}

header .dropdown-menu.dropdown-menu-inline .dropdown-item:nth-child(2n+1),header .dropdown-menu.dropdown-menu-inline .dropdown-item:nth-child(2n+3){
 background: #f4f4f4;
}
header .position-static .dropdown-menu{
 transform: translate3d(0px, 0px, 0px) !important;
 right: 0px;
 left: 0px;
 border-radius: 0;
 padding:1rem;
 max-height: calc(100vh - 549px);
 overflow: auto;
}
header .position-static.show .dropdown-menu{
 opacity: 1;
 visibility: visible;
}
.lg-icon,.cartminiview .fa-shopping-cart{
 font-size: 14px;
 margin-right: 5px;
}




.d-none.show{
 display:block !important;
}
.nav-link-search{
 color:white
}

.navbar-products{
 flex-wrap: nowrap;
 overflow: hidden;
}
.navbar-products .nav-item:hover{
 background: #fff;
}
.navbar-products .nav-item:hover .nav-link{
 color:black;
}
.navbar-products .nav-link{
 white-space: nowrap;
 padding:1rem
}
.grid{
 display: flex;
 flex-wrap: wrap;
}
.grid .box{
 max-width:250px ;
 padding: 0.5rem 1rem;
}
.group-image{
 max-width: 150px !important;
}
.menu-column,.submenu-column {
 border-right:#eee solid 1px;
 margin-bottom:0rem;
 width:250px;
}
.menu-column a,.submenu-column a{
 white-space: normal;
}
.submenu-column {
 margin-right:10px;
}
.discount{
 font-size: 16px;
 text-decoration: line-through;
}





.modal-menu{
 padding: 0 !important;
}
.modal-menu ul{
 padding: 0 ;
 list-style: none;
 display: block;
}
.modal-menu .modal-dialog{
 margin: 0;
 max-width: 300px;
 margin-left: -300px;
 transition: all 0.3s ease-in-out;
}
.modal-menu.modal.show .modal-dialog{
 margin-left: 0px;
 transition: all 0.3s;
}
.modal-menu  .dropdown .dropdown-menu {
 display: block;
 position: relative;
 box-shadow: none;
 float: none;
 opacity: 1;
 padding: 0;
 visibility: visible;
 border: none;
}
.modal-menu  .dropdown:hover .dropdown-menu:not(.onclick) {
 display: block;
}
.modal-menu .dropdown-item:last-child{
 border-bottom: none;
}
.modal-menu .dropdown-item,.modal-menu .nav-link{
 padding: .7rem 1.1rem;
 display: block;
 border-bottom: #eee solid 1px;
 color:black
}
.modal-menu .nav-link.dropdown-toggle,.profile .nav-link.dropdown-toggle{
 padding: 1.2rem 1.1rem 0.3rem 1.1rem !important;
 border-bottom: #eee solid 1px;
 text-transform: uppercase;
 font-size: 14px;
 padding-top: 20px;
 color: #888;
}
.modal-menu .nav-link.dropdown-toggle .fa-chevron-down{
 display:none
}
.modal-menu .dropdown-divider{
 display:none;
}
.modal-menu .nav-item.dropdown{
 border-left:none;
 border-right:none;
 list-style: none;
}
.modal-menu .dropdown-header{
 display:none
}

.modal-menu .position-static .dropdown-item {
 width: 100%;
 display: block;
}


.modal-menu .catloglist li ul{
 display:none;
}
.modal-menu .catloglist li.selectedgroup ul{
 display:block;
}


.modal-menu .catloglist li.maincategory > a,.modal-menu .catloglist > li.nocategory > a{
 color: black !important;
 font-size: 15px !important;
 padding: 0.7rem 1.1rem !important;
 border-top: #eee solid 1px;
}
.modal-menu .catloglist li a{
 padding: 0.5rem;
 cursor: pointer;
 display: block;
 color: #525252;
 font-size: 14px;
 border-top: #eee solid 1px;
}
.modal-menu .catloglist li:first-child a{
 border-top: none;
}
.modal-menu .catloglist li a:hover
{
 background: #f6f6f6 !important;
 transition: all 0.3s ease 0s;
 border-radius: 0px;
}

.modal-menu .catloglist li.maincategory > a,.modal-menu .dropdown-item,.modal-menu .nav-link,.modal-menu .catloglist > li.nocategory > a{
 border-radius: 0;
 position: relative;
 font-size: 1rem;
}
.modal-menu .catloglist li.maincategory > a:after,.modal-menu .dropdown-item:after,.modal-menu .nav-link:after,.modal-menu .catloglist > li.nocategory > a:after{
 border-radius: 0;
 position: absolute;
 font-family: "Font Awesome 5 Pro";
 content:"\f054";
 right:12px;
 top:12px;
 font-weight: normal;
 color:#999;
}


.input-qnt .form-control{
 padding:0;
 border-left:none !important;
 border-right:none !important;
}
.input-qnt .input-group-text
{
 border-radius: 50%;
 height: 40px;
 width: 40px;
 padding: 0;
 text-align: center;
 display: block;
 line-height: 38px;
 font-weight: bold;
 cursor: pointer;
 background: white;
}









footer .dropdown-toggle::after{
 border-top-color: #fff;
}
.btn-primary {
 border-color:transparent;
}
.btn-warning{
 color: white;
}




.progressbar{

}
@-webkit-keyframes progressbar {
 from { width: 0%; }
 to { width: 70%; }
}

.backdrop-over{
 background: rgba(0,0,0,0.6);
 position: fixed;
 top:0;
 left:0;
 right: 0;
 bottom: 0;
}


.carousel-control-next, .carousel-control-prev{
 font-size: 30px;
 display: none;
}

.banner-footer-content{
 display: none;
}
.active.banner-footer-login{
 display: block;
}
.active.banner-footer-checkout{
 display: block;
}

.banner-type.none{
 background: white;
}

.news.carousel-indicators li{
 height: 5px;
 width:5px;
 background-color: rgba(255, 255, 255, 0.5);
 border-radius: 50%;
}


.input-group>.custom-select:not(:first-child), .input-group>.form-control:not(:first-child) {
 border-top-left-radius: 0;
 border-bottom-left-radius: 0;
 border: #e0e0e0 solid 1px;
 border-left:none;
}
.chosen-container .chosen-drop {
 margin-top: -1px;
}
.chosen-container-single .chosen-search input[type=text] {
 padding: 5px 20px 5px 5px;
 border: 1px solid #aaaaaa45;
 background: transparent;
 border-radius: 3px;
}

.center{
 display: flex;
 justify-content: center;
 align-items: center;
}

.checkbox label,
.form-radio label {
 position: relative;
 cursor: pointer;
 padding-left: 25px;
 text-align: left;
 display: block;
 margin-top: -8px;
}
.checkbox input,
.form-radio input {
 width: 16px;
 opacity: 0.00000001;
 position: absolute;
 left: 0;
 z-index:999;
 height:16px;
 cursor: pointer;
}

.checkbox + label,.form-radio + label{
 display: none;
}


.radio .helper {
 position: absolute;
 top: -0.25rem;
 left: -0.25rem;
 cursor: pointer;
 display: block;
 font-size: 1rem;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
 color: #999;
}
.radio .helper::before, .radio .helper::after {
 content: '';
 position: absolute;
 left: 0;
 top: 0;
 margin: 0.25rem;
 width: 15px;
 height: 15px;
 -webkit-transition: -webkit-transform 0.28s ease;
 transition: -webkit-transform 0.28s ease;
 transition: transform 0.28s ease;
 transition: transform 0.28s ease, -webkit-transform 0.28s ease;
 border: 1px solid currentColor;
}
.radio .helper::after {
 -webkit-transform: scale(0);
 transform: scale(0);
 background-color: #5e83db;
 border-color: #5e83db;
}
.radio label:hover .helper {
 color: #5e83db;
}
.radio input:checked ~ .helper::after {
 -webkit-transform: scale(0.5);
 transform: scale(0.5);
}
.radio input:checked ~ .helper::before {
 color: #5e83db;
}

.checkbox,.radio {
 margin:0;
 display:block;
 padding:6px 0;
 vertical-align: middle;
}
.checkbox .helper {
 color: #999;
 position: absolute;
 top: 0;
 left: 0;
 width: 14px;
 height:14px;
 z-index: 0;
 border: 1px solid currentColor;
 border-radius: 0.0625rem;
 -webkit-transition: border-color 0.28s ease;
 transition: border-color 0.28s ease;
}
.checkbox .helper::before, .checkbox .helper::after {
 position: absolute;
 height: 0;
 width: 2px;
 background-color: #003087;
 display: block;
 -webkit-transform-origin: left top;
 transform-origin: left top;
 border-radius: 0.25rem;
 content: '';
 -webkit-transition: opacity 0.28s ease, height 0s linear 0.28s;
 transition: opacity 0.28s ease, height 0s linear 0.28s;
 opacity: 0;
}
.checkbox .helper::before {
 top: 0.65rem;
 left: 0.38rem;
 -webkit-transform: rotate(-135deg);
 transform: rotate(-135deg);
}
.checkbox .helper::after {
 top: 0.3rem;
 left: 0;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
}
.checkbox label:hover .helper {
 color: #5e83db;
}
.checkbox input:checked ~ .helper {
 color: #0461aa;
}
.checkbox input:checked ~ .helper::after, .checkbox input:checked ~ .helper::before {
 opacity: 1;
 -webkit-transition: height 0.28s ease;
 transition: height 0.28s ease;
}
.checkbox input:checked ~ .helper::after {
 height: 0.5rem;
}
.checkbox input:checked ~ .helper::before {
 height: 1.2rem;
 -webkit-transition-delay: 0.28s;
 transition-delay: 0.28s;
}

.radio + .radio,
.checkbox + .checkbox {
 margin-top: 1rem;
}
.form-control:disabled, .form-control[readonly] {
 background-color: #f7f7f7;
 opacity: 0.5;
}

.chosen-container .chosen-results li {
 display: none;
 margin: 0;
 padding: 10px 6px;
 list-style: none;
 line-height: 25px;
 word-wrap: break-word;
 border-bottom: #eee solid 1px;
 font-size: 14px;
 font-weight: 600 !important;
}

#replytime strong {
 font-weight: 600;
 font-size: 20px;
 color: #6d6d6d;
}

.mw-520{
 min-width: 450px;
 margin-bottom: 1.5rem;
}
.mw-320{
 min-width: 320px;
 margin: 12px;
}
.mw-320 h2{
 font-size: 1.5rem;
}
.mw-360{
 max-width: 360px;
}
.mw-400{
 max-width: 400px;
}
.mw-600{
 max-width: 600px;
}
.mw-500{
 max-width: 500px;
}
.mw-300{
 max-width: 300px;
}
.mw-100{
 min-width: 100px;
}
.mxw-100{
 max-width: 100px !important;
}
.mw-250{
 min-width: 250px;
 margin-bottom: 20px;
}
.w-250{
 max-width: 250px;
}
.mw-200{
 min-width: 280px;
 margin-bottom: 20px;
}
.d-grid{
 min-width: 200px;
 flex-grow: 1;
 margin: auto;
}
#productdetails div:first-child{
 margin-top: 1.5rem;
}
.card-product-img{
 height: 100%;
}

.text-sm{
 font-size: 15px;
}
.custom-radio-center i.text-lg{
 font-size: 50px;
 margin-right: 10px;
 padding: 7px
}

.custom-radio-center .custom-radio{

}
.custom-radio-center .custom-radio .custom-control-label::before,.custom-radio-center .custom-radio .custom-control-label::after{
 top:1.5rem;
}

.reload-cartitems{
 position: sticky;
 top: 1rem;
}

.tcs-select {
 background-color: #e8f0fd !important;
}

.tcs-select.tcs-ignore,
.tcs-ignore .tcs-select {
 background-color: #7AAAB9;
}
.gmap_canvas {
 overflow: hidden;
 background: none !important;
 height: 400px;
 width: 100%;
 border: dashed 1px #d8d8d8;
 padding: 10px;
 border-radius: 5px;
}
.table.compaq td{
 padding: 0.3rem;
 font-size: 1rem;
}

tr.updateorder-Replied td{
 background: white;
 -webkit-animation-name: blink; /* Safari 4.0 - 8.0 */
 -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
 animation-name: blink;
 animation-duration: 4s;
 font-weight: 600;
}
tr.updateorder-Cancelled td{
 background: white;
 -webkit-animation-name: blink2; /* Safari 4.0 - 8.0 */
 -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
 animation-name: blink2;
 animation-duration: 4s;
 font-weight: 600;
}
.table-cart-items tr td{
 vertical-align: middle;
}
.table.table-cart-items tbody tr:hover,.price-details .table tbody tr:hover{
 background: none !important;
}
.table.table-cart-items tbody tr .delete-icon{
 opacity: 0;
 visibility: hidden;
 padding: 0.5rem 0;
 display: block;
}
.table.table-cart-items tbody tr:hover .delete-icon{
 opacity: 1;
 visibility: visible;
}

@-webkit-keyframes blink {
 0%   {background-color: white;}
 25%   {background-color: #28a7451f;}
 50%   {background-color: white;}
 100% {background-color: #28a7451f;}
}
@keyframes blink2 {
 0%   {background-color: white;}
 25%   {background-color: #ffe8e8;}
 50%   {background-color: white;}
 100% {background-color: #ffe8e8;}
}

ul.nav-pills.flex-nowrap{
 align-items: center;
}



.homepagegroups ul.nav-pills.flex-nowrap .nav-item:not(.nav-item-parent) .nav-link{
 font-size: 18px;
 padding: 5px 15px 5px 0;
 border-color: transparent;
}
.homepagegroups ul.nav-pills.flex-nowrap .nav-item-parent .nav-link{
 border:none;
 font-size: 25px;
 padding: 0;
}

ul.nav-pills.flex-nowrap .nav-link{
 color:#888;
}
ul.nav-pills.flex-nowrap .nav-link.active{
 background: transparent !important;
 border-bottom: black solid 2px;
 border-radius: 0;
 color:black
}

.max-360{
 max-width: 450px;
}



.banner-without-image{
 min-height:500px;
}

.big-icon {
 font-size: 30px;
 opacity: 0.5;
}
.fa-image{
 opacity: 0.1;
}
.twitter a{
 color: white;
}

.carousel .page-title,.carousel .or-login-with{
 display: none;
}
.quick-checkout{
 width: 360px;
}





.pulse-button {
 box-shadow: 0 0 0 0 rgba(90, 153, 212, 0.5);
 -webkit-animation: pulse 1.5s infinite;
}
@-webkit-keyframes pulse {
 0% {
  -moz-transform: scale(0.9);
  -ms-transform: scale(0.9);
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
 }
 70% {
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
  box-shadow: 0 0 0 30px rgba(90, 153, 212, 0);
 }
 100% {
  -moz-transform: scale(0.9);
  -ms-transform: scale(0.9);
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  box-shadow: 0 0 0 0 rgba(90, 153, 212, 0);
 }
}



hr.dashed{
 border-top: #eee dashed 1px;
}
table{
 width:100%
}



.table{
 margin-bottom: 0;
 background: white;
 border-bottom: #e0e2e6 solid 1px;
}
.table.table-align-center td{
 vertical-align: middle;
}
.table:not(.table-hover-disable) tbody tr:hover {
 background-color: rgba(0,0,0,.02) !important;
}
.table thead th {
 vertical-align: bottom;
 border-bottom: 1px solid #e0e2e6;
 font-size: 14px;
 color: #7c7c7c;
 font-weight: normal;
 text-transform: uppercase;
}
.table tbody tr:first-child td, .table th{
 border-top:none;
 min-width: 80px;
}
.table th h5{
 color:black;
 margin:0
}
.table-bordered {
 border: 1px solid #efefef;
}
.table-striped tbody tr:nth-of-type(odd) {
 background-color: #fff;
}
.table.align-items-center td{
 vertical-align: middle;
}
.table td.border-0{
 border: 0 !important;
}
.price-details{
 float: right;
 padding-top: 1rem;
 border-top: #f3f3f3 solid 3px;
}
.clearfix{
 clear:both;
}
.collapse-heading.collapsed .closed:after{
 content:'+';
}
.collapse-heading .closed:after{
 content:'-';
}


.product-features td{

}
.btn-reset{
 display: none;
}
.related-products .quick-view{
 display: none !important;
}
.detail-view{
 display: none;
}
.modal-body .detail-view{
 display: block;
}


.footer-top{
 background: white;
}

.footer-top .footer-navbar .nav{
 display: block;
}
.footer-top .footer-navbar .nav .nav-item a.nav-link{
 padding:2px 0;
 color:black;
}
.footer-top .footer-navbar .nav .nav-item:hover{
 background: transparent;
 color:black;
}
.footer-top .link-heading{
 padding:10px 0;
 position:relative;
 margin:10px 0;
}
.footer-top .link-heading:after{
 content:'';
 position: absolute;
 width:70px;
 height: 3px;
 background: black;
 bottom:0;
 left:0;
}
.footer-bottom{
 background: #000;
 color:white
}
.d-actionbar-mobile{
 display:flex;
 justify-content: space-between;
 align-items: center;
 margin-top: 0.5rem;
}
.d-actionbar-mobile .col{
 padding: 0;
 margin: 0;
}
.page-checkout .container{
 padding: 0 !important;
}

.order-tracking{
 text-align: center;
 width: 25%;
 position: relative;
 display: block;
}
.order-tracking .is-complete{
 display: block;
 position: relative;
 border-radius: 50%;
 height: 15px;
 width: 15px;
 border: 0px solid #AFAFAF;
 background-color: #eeeeee;
 margin: 0 auto;
 transition: background 0.25s linear;
 -webkit-transition: background 0.25s linear;
 z-index: 2;
}
.order-tracking .is-complete:after {
 display: block;
 position: absolute;
 content: '';
 height: 8px;
 width: 7px;
 top: 0px;
 bottom: 0;
 left: 5px;
 margin: auto 0;
 border: 0px solid #AFAFAF;
 border-width: 0px 2px 2px 0;
 transform: rotate(45deg);
 opacity: 0;
}
.order-tracking.completed .is-complete{
 border-color: #27aa80;
 border-width: 0px;
 background-color: #27aa80;
}
.order-tracking.completed .is-complete:after {
 border-color: #fff;
 border-width: 0px 2px 2px 0;
 width: 5px;
 left: 5px;
 opacity: 1;
}
.order-tracking p {
 color: #A4A4A4;
 font-size: 12px;
 margin-top: 2px;
 margin-bottom: 0;
}
.order-tracking p span{font-size: 14px;}
.order-tracking.completed p{color: #000;}
.order-tracking::before {
 content: '';
 display: block;
 height: 1px;
 width: calc(100% - 24px);
 background-color: #eeeeee;
 top: 8px;
 position: absolute;
 left: calc(-50% + 12px);
 z-index: 0;
}
.order-tracking:first-child:before{display: none;}
.order-tracking.completed:before{background-color: #27aa80;}
.btn-close-editor{
 min-width: auto !important;
}

.card-payment-method .custom-control-label{
 margin-bottom: 15px;
}
.card.card-simple-form{
 padding-top: 5rem;
 padding-bottom: 5rem;
}

#imeiserviceDetails .page-title{
 padding: 0;
}





.paypal-buttons{

}
.tpl-cart .page-title,.tpl-client_retail_group .page-title,.tpl-cart_item_config .page-title{
 display: none;
}

.tpl-cart .page-title.inner-page-title,.tpl-client_retail_group .page-title.inner-page-title,.tpl-cart_item_config .page-title.inner-page-title{
 display: block !important;
}
.tpl-cart_checkout .card-registration{
 padding-top: 0rem;
 padding-bottom: 0rem;
}

.wizard > .steps .current-info, .wizard > .steps .number {
 display: none; }

section h5{
 display:none
}
.wizard-title{
 font-weight: 500;
 font-size: 1.5rem;
 text-transform: uppercase;
}
.steps ul {
 display: flex;
 position: relative;
 list-style: none;
 justify-content: space-between;
 padding:0;
 flex-wrap: nowrap;
 border:none;
}
.steps ul li {
 width: 100%;
 margin: 2px; }
.steps ul li a {
 display: inline-block;
 width: 100%;
 height: 4px;
 background: #e6e6e6;
 border-radius: 3.5px; }
.steps ul li.first a, .steps ul li.checked a {
 background: #f3d4b7;
 transition: all 0.5s ease; }

.nav-tabs.nav-wizard .nav-link{
 border: none !important;
 height: 5px;
 padding: 0;
 border-radius: 10px;
}

.big-badge .badge {
 font-size: 35px;
 font-weight: 100;
}

.paymentbtn{
 width:100%
}

.ordertheme img{
 border-radius: 5px;
}

.input-captcha .form-control::-webkit-input-placeholder {
 text-transform: capitalize;
}

.input-captcha .form-control:-ms-input-placeholder {
 text-transform: capitalize;
}

.input-captcha .form-control::placeholder {
 text-transform: capitalize;
}
.payment-btn .alert{
 margin-bottom: 0;
}

.table tbody tr td.seperator-colon{
 border-right: #e0e2e6 solid 1px;
 min-width: 0;
}
address{
 opacity: 0.6;
}
.price-details table td.double-border{
 border-top: none;
}
.double-border h5{
 color:black;
 font-size: 1.5rem;
 margin-bottom: 0;
}

h3.title{

}
.colon{
 min-width: 50px;
 text-align: center;
}
.services .table h5{
 padding-bottom: 0;
}

.btn-primary.disabled, .btn-primary:disabled{
 border-color:transparent;
}
.loadinfo{
 font-size: 80%;
}
.loadinfo p{
 margin-top: 1rem;
}
.btn-cartview-next{
 max-width: 380px; margin-top: 2.5rem
}
.show-pass{

}
.cart-gallery{
 border: #d0d2d5 solid 1px;
 height: 100%;
 border-radius: 5px;
}
.col-product{
 margin-top:12px ;
 margin-bottom:12px ;
}

.btn.focus, .btn:focus{
 box-shadow: none;
}
.form-group .required{
 position: absolute;
}


@media (max-width: 992px) {
 body{
  font-size: 0.9rem;
  background: #f5f5f5;
 }
 header .position-static .dropdown-menu{
  padding:15px 0;
 }
 .carousel.index-banner, .clientarea-balance{
  margin:0;
 }
 .navbar-brand{
  padding:12px;
 }

 .header-bottom{
  height: 72px;
 }
 .lg-icon, .cartminiview .fa-shopping-cart {
  font-size: 24px;
  margin-right: 0px;
 }
 .dropdown-menu.onclick {
  display: block;
  position: absolute;
  top: 0px;
 }
 .card-product .product-info{
  position: relative;
  left: 0;
  right: 0;
  z-index: 99;
  bottom: 0;
  padding: 0px 10px 10px 15px;
  opacity: 1;
  margin-top: 1rem;
 }
 .card-body{
  padding:0;
  height:100%;
 }

 .d-none-modal,.chat-icon-position,.d-actionbar-mobile .text-muted,.d-actionbar-mobile .form-label,.card-product .quick-view{
  display:none !important;
 }
 .d-block-modal{
  display:block !important;
 }
 .search-bar .dropdown-menu{
  opacity: 1;
  visibility: visible;
  padding:0  0 1rem;
  border-radius:0 !important;
 }
 .h1, h1 {
  font-size: 1.5rem;
 }
 .d-actionbar-mobile{
  position: fixed;
  bottom: 0;
  background: whitesmoke;
  z-index: 999;
  left: 0;
  right: 0;
  text-align: center !important;
  padding: 10px !important;
 }
 .d-actionbar-mobile .btn{
  width: 100%;
 }
 .carousel.slide-products{
  min-height: auto;
 }
 .pagination .pages-dropdown,#autorefresh{
  display:none
 }
 h3.h3 span{
  padding:20px;
 }
 .service-list,.service-information,.bg-svg2{
  height: auto !important;
 }
 .modal-body,.modal-header{
  padding:1rem 1rem 0 1rem;
  border-radius: 0;
 }
 .modal-header .close{
  margin: 0;
  right: 12px;
  top: 8px;
  font-size: 1.5rem;
 }
 .modal-header .close{
  background: transparent;
  color:black;
 }
 .modal.show .modal-dialog{
  margin:0;
  max-width: 100%;
 }
 .modal.modal-menu.show .modal-dialog{
  max-width: 320px;
 }
 .modal-dialog,.modal-content,.modal-body{
  height: 100%;
 }
 .modal-body{
  height: calc(100vh - 0px);
  overflow: auto;
 }
 .card-product{

 }
 .price{
  font-weight:bold;
 }

 .table th h5{
  padding:0
 }
 .table tbody tr:first-child td, .table th{
  min-width: auto;
 }

 .card-img-top{
  min-width: 50px;
  max-width: 150px;
 }
 .form-inline .w-25{
  width:100% !important;
 }
 .card{
  padding: 1rem;
 }
 .card-product .quick-view {
  bottom: 0;
  opacity: 1;
  visibility: visible;
  background: #f4f4f4;
 }



 .max-360{
  max-width: 100%;
 }
 .mw-360{
  max-width: 100%;
 }


 .min-height {
  min-height: calc(100vh - 187px) !important;
 }
 .mw-100{
  min-width: auto;
 }


 .cart .breadcrumb{
  padding: 0;
 }
 .h3, h3,.homepagegroups ul.nav-pills.flex-nowrap .nav-link,.homepagegroups ul.nav-pills.flex-nowrap .nav-item-parent .nav-link{
  font-size: 1.2rem;
 }
 .h-100{

 }
 .modal-menu .modal-content, .modal-menu .modal-dialog{
  height: 100% !important;
 }
 .pagination .page-item:first-child,.menu-item-1007,.menu-item-1015{
  display:none
 }

 .card-retail-order .retail-item{
  padding-bottom:40px;
 }

 .card-retail-order .retail-item .track-order {
  margin-top: 0rem;
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  padding: 10px;
  z-index: 99;
 }

 .card-retail-order .retail-item h5{
  font-size: 1rem;
 }

 .card-retail-order .retail-item .col-img{
  padding:0
 }
 .card-retail-order .retail-item .col-detail{
  padding-right:0
 }
 .page-container{
  padding:0;
 }
 .table.table-cart-items tbody tr .delete-icon{
  opacity:1;
  visibility: visible;
 }
 table td.double-border h5{
  font-size:1rem
 }
 .card.card-simple-form{
  padding-top: 1rem;
  padding-bottom: 0rem;
 }
 .page-checkout .card.card-registration{
  margin-bottom: 0 !important;
 }
 .col-product{
  flex: 0 0 100% !important;
  max-width: 100% !important;
 }
 .index-content{
  padding: 0 !important;
  margin: 0 !important;
 }
 .homepagegroups ul.nav-pills.flex-nowrap .nav-item:not(.nav-item-parent) .nav-link {
  font-size: 12px;
  padding: 5px 10px 5px 0;
 }
 .navbar-toggler:not(:disabled):not(.disabled) {
  cursor: pointer;
  padding: 10px;
 }
 .cart-item-detail{
  border: none !important;
 }
 .price{
  padding: 0.5rem 0 0 0;
 }
 .page-title{
  padding: 0;
 }
 .price-details{
  width: 100%;
 }
 .reload-cartitems{
  margin-bottom: 1rem;
 }
 .big-badge .badge{
  margin-bottom: 1rem;
  font-size: 18px;
 }
 .text-right{

 }
 .min-height{
  padding-bottom: 2rem;
 }
 .btn-cartview-next{
  margin-top: 0rem
 }
 .card-search .form-group{
  margin-bottom: 1rem;
 }
 .card,.card-search,.col-order-area{
  margin-bottom: 1rem !important;
 }

 .col-product .card{
  margin-bottom: 0 !important;
 }
 .services .table h5 {
  font-size: 18px;
 }
 .show-pass{

 }
 .page-login{

 }
 .card-body.border-left{
  border: none !important;
 }
 .alert1{
  margin-bottom: 1rem;
 }
 .card-othercredit{
  margin: 2rem 0 1rem 0 !important;
 }
 .card-unpaid-balance{
  margin-top: 1rem !important;
 }
 header .dropdown-menu{
  box-shadow: 2px 5px 10px #00000000;
 }
 .group.row{
  margin-top: 0;
 }
 .service.mb-4{
  margin: 0!important;
 }
 .col-auto.col-group-icon{
  display: none;
 }
 .card ul.nav-pills.flex-nowrap{
  overflow: auto;
 }
 .card ul.nav-pills.flex-nowrap .nav-item .nav-link{
  white-space: nowrap;
 }
 .deposit-total{
  border-bottom: none !important;
 }
 .api-access-btns{
  display: block !important;
 }
 .imagemode .card-group .card-info {
  opacity: 1;
  visibility: visible;
  position: relative;
 }
 .nav-registration{
  background: black;
 }
 .nav-login{
  background: white;
  color:black
 }
 .card-announcement{
  max-height: initial !important;
 }
}


@media (max-width: 480px) {
 .modal-dialog.mx-auto{
  margin: 0rem !important;
 }
}

.homepagegroups .tab-content .tab-pane{
 padding: 0;
}

.cart-item-detail .text-muted{
 text-transform: uppercase;
}

.paypal-checkout-sandbox-iframe{
 border: none;
}
.text-muted.font-normal{
 text-transform: uppercase;
}

.card-announcement{
 max-height: 521px;
 overflow: auto;
}


.index-reseller{

}
.card-othercredit{
 background: #fafafa;
}

.index-items-homepagegroup{
 background: #fafafa;
}

.default .index-items-homepagegroup{
 background: transparent;
 padding: 0;
}

.modal-dialog .form-group.col-lg-4{
 max-width: 100%;
}

.tab-content .container{
 padding: 0;
}
.modal-open .modal{
 padding-right: 0 !important;
}

.input-daterange input:last-child{
 border-radius: 3px;
}

/*
ul.tree, ul.tree ul {
 list-style: none;
 margin: 0;
 padding: 0;
 display: block;
}
ul.tree ul {
 margin-left: 16px;
}
ul.tree li {
 margin: 0;
 padding: 3px 7px;
 color: #369;
 border-left:1px dashed rgb(191, 191, 191);
}
ul.tree li:last-child {
 border-left:none;
}
ul.tree li:before {
 position:relative;
 top:-0.3em;
 height:1em;
 width:12px;
 color:white;
 border-bottom:1px dashed rgb(191, 191, 191);
 content:"";
 display:inline-block;
 left:-7px;
}
ul.tree li:last-child:before {
 border-left:1px dashed rgb(191, 191, 191);
}
*/

.link a{
 color:#007bff
}
/* width */
.overflow::-webkit-scrollbar,.chosen-container .chosen-results::-webkit-scrollbar {
 width: 10px;
}

/* Track */
.overflow::-webkit-scrollbar-track,.chosen-container .chosen-results::-webkit-scrollbar-track {
 background: #f1f1f1;
}

/* Handle */
.overflow::-webkit-scrollbar-thumb,.chosen-container .chosen-results::-webkit-scrollbar-thumb {
 background: #888;
}

/* Handle on hover */
.overflow::-webkit-scrollbar-thumb:hover,.chosen-container .chosen-results::-webkit-scrollbar-thumb:hover {
 background: #555;
}


.digit-group input[type="number"] {
 width: 48px;
 height: 50px;
 border: solid 1px #ddd;
 text-align: center;
 font-size: 24px;

 font-weight: 200;

 margin: 0 2px;
 line-height: 50px;
 border-radius: 3px;
}

.digit-group input::-webkit-outer-spin-button,
.digit-group input::-webkit-inner-spin-button {
 -webkit-appearance: none;
 margin: 0;
}

/* Firefox */
.digit-group input[type=number] {
 -moz-appearance: textfield;
}

/* ---- SOURCE: /templates/default/css/cymart-futuristic.css ---- */

/* ==========================================================================
   CYMART UNLOCK — FUTURISTIC NEON UI
   Visual-only skin.
   No JavaScript, AJAX, forms, URLs, tokens or template logic are changed.
   ========================================================================== */

/* ---------- 01. GLOBAL SURFACE ---------- */
html,
body {
    background: #020611 !important;
    color: #eaf3ff;
}

body {
    font-family: 'myriad-pro', Inter, system-ui, -apple-system, BlinkMacSystemFont,
                 "Segoe UI", sans-serif;
    background:
        radial-gradient(circle at 50% -20%, rgba(109, 30, 255, .18), transparent 38%),
        radial-gradient(circle at 8% 60%, rgba(0, 116, 255, .12), transparent 32%),
        radial-gradient(circle at 94% 58%, rgba(164, 0, 255, .12), transparent 34%),
        #020611 !important;
}

/* Tech/network atmosphere without touching page content. */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    opacity: .62;
    background:
        radial-gradient(circle at 5% 68%, transparent 0 34px, rgba(0,149,255,.30) 35px 36px, transparent 37px 76px, rgba(0,149,255,.15) 77px 78px, transparent 79px 128px),
        radial-gradient(circle at 94% 30%, transparent 0 44px, rgba(130,0,255,.26) 45px 46px, transparent 47px 90px, rgba(130,0,255,.12) 91px 92px, transparent 93px 150px),
        linear-gradient(32deg, transparent 0 19%, rgba(0,123,255,.12) 19.05% 19.12%, transparent 19.2% 34%, rgba(127,0,255,.10) 34.05% 34.12%, transparent 34.2% 100%),
        linear-gradient(148deg, transparent 0 65%, rgba(0,145,255,.10) 65.05% 65.12%, transparent 65.2% 79%, rgba(174,0,255,.10) 79.05% 79.12%, transparent 79.2% 100%);
    background-size: auto, auto, 620px 620px, 760px 760px;
}

body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(90deg, transparent 0 49.8%, rgba(0,153,255,.025) 50%, transparent 50.2%),
        linear-gradient(0deg, transparent 0 49.8%, rgba(152,0,255,.022) 50%, transparent 50.2%);
    background-size: 180px 180px;
    mix-blend-mode: screen;
}

.bg-gray,
.content,
.main-content,
.min-height {
    background-color: transparent !important;
}

/* ---------- 02. HEADER / TOP TICKER ---------- */
header {
    position: relative;
    z-index: 100;
    background: rgba(1, 5, 18, .90) !important;
}

.header-top {
    min-height: 34px;
    background:
        linear-gradient(90deg, #0719b9 0%, #3513a5 30%, #79008f 58%, #3513a5 80%, #0719b9 100%) !important;
    border: 0 !important;
    box-shadow: 0 1px 16px rgba(43, 0, 255, .34);
    color: #fff;
}

.header-top .nav-link,
.header-top .text-muted,
.header-top a {
    color: #f7fbff !important;
    text-shadow: 0 0 8px rgba(0, 213, 255, .24);
}

.header-middle {
    background: rgba(2, 7, 23, .94) !important;
    border: 1px solid rgba(119, 18, 255, .54) !important;
    border-radius: 10px;
    margin: 8px 14px 0;
    box-shadow:
        0 0 0 1px rgba(0, 145, 255, .18),
        0 0 22px rgba(126, 0, 255, .18),
        inset 0 0 22px rgba(0, 109, 255, .06);
}

.header-middle::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    pointer-events: none;
    box-shadow:
        0 0 7px rgba(185, 0, 255, .42),
        0 0 20px rgba(0, 133, 255, .18);
}

.header-middle::after {
    content: "";
    position: absolute;
    left: 1.5%;
    right: 1.5%;
    bottom: -1px;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, #00a7ff, #b100ff, #00a7ff, transparent);
    box-shadow: 0 0 10px rgba(0, 177, 255, .72);
}

.header-bottom {
    background: transparent !important;
    border: 0 !important;
}

/* ---------- 03. MAIN NAVIGATION ---------- */
.header-middle .navbar-brand {
    position: relative;
    z-index: 2;
}

.header-middle .navbar-brand img {
    border-radius: 7px;
    box-shadow:
        0 0 8px rgba(0, 149, 255, .36),
        0 0 16px rgba(160, 0, 255, .18);
}

.header-middle .navbar-nav .nav-link {
    color: #edf6ff !important;
    font-weight: 500;
    text-shadow: 0 1px 3px rgba(0,0,0,.7);
    transition: color .18s ease, text-shadow .18s ease, background .18s ease;
}

.header-middle .navbar-nav .nav-item:hover > .nav-link,
.header-middle .navbar-nav .nav-link:hover {
    color: #6de4ff !important;
    text-shadow: 0 0 9px rgba(0, 199, 255, .58);
    background: rgba(92, 0, 255, .08);
}

.header-middle .navbar-expand-lg .navbar-nav .nav-item .nav-link:not(.bg-secondary)::before {
    background: linear-gradient(90deg, #9c00ff, #00cfff) !important;
    box-shadow: 0 0 9px rgba(0, 196, 255, .55);
}

.header-middle .lg-icon i,
.header-middle .nav-link i {
    color: #70dfff !important;
}

.header-middle .user-balance {
    text-shadow: 0 0 8px rgba(40, 255, 133, .25);
}

/* ---------- 04. DROPDOWNS ---------- */
header .dropdown-menu,
.header-middle .dropdown-menu {
    background:
        linear-gradient(145deg, rgba(5, 13, 34, .98), rgba(18, 3, 37, .98)) !important;
    color: #edf6ff !important;
    border: 1px solid rgba(128, 30, 255, .65) !important;
    border-radius: 9px !important;
    box-shadow:
        0 18px 45px rgba(0,0,0,.62),
        0 0 18px rgba(119, 0, 255, .20) !important;
}

header .dropdown-menu .dropdown-item,
.header-middle .dropdown-menu .dropdown-item {
    color: #eaf4ff !important;
}

header .dropdown-menu .dropdown-item:hover,
header .dropdown-menu .dropdown-item:focus,
.header-middle .dropdown-menu .dropdown-item:hover,
.header-middle .dropdown-menu .dropdown-item:focus {
    color: #69ddff !important;
    background: rgba(73, 0, 170, .24) !important;
}

/* ---------- 05. PAGE TITLE / BREADCRUMB ---------- */
.bg-gray {
    color: #eaf3ff !important;
    background:
        radial-gradient(circle at 3% 58%, transparent 0 52px, rgba(0,133,255,.20) 53px 54px, transparent 55px 90px, rgba(0,133,255,.11) 91px 92px, transparent 93px 140px),
        radial-gradient(circle at 97% 61%, transparent 0 54px, rgba(154,0,255,.19) 55px 56px, transparent 57px 94px, rgba(154,0,255,.10) 95px 96px, transparent 97px 145px),
        linear-gradient(135deg, #020611 0%, #030d20 52%, #020817 100%) !important;
}

.breadcrumb {
    color: #69cfff !important;
}

.breadcrumb a,
.breadcrumb i {
    color: #59c9ff !important;
}

.page-title {
    color: #f3f8ff !important;
    letter-spacing: .02em;
    text-shadow: 0 0 15px rgba(0, 145, 255, .18);
}

.page-title::after {
    content: "";
    display: block;
    width: 72px;
    height: 3px;
    margin-top: 8px;
    border-radius: 3px;
    background: linear-gradient(90deg, #d000ff, #00bfff);
    box-shadow: 0 0 10px rgba(152, 0, 255, .55);
}

/* ---------- 06. GLASS CARDS ---------- */
.card,
.card-product,
.card-announcement,
.serchcontent {
    background:
        linear-gradient(145deg, rgba(5, 16, 37, .96), rgba(5, 7, 27, .96)) !important;
    color: #eaf4ff !important;
    border: 1px solid rgba(122, 0, 255, .52) !important;
    border-radius: 9px !important;
    box-shadow:
        0 0 15px rgba(102, 0, 255, .10),
        inset 0 0 20px rgba(0, 112, 255, .035) !important;
}

.card:hover,
.card-product:hover {
    border-color: rgba(0, 183, 255, .66) !important;
    box-shadow:
        0 0 18px rgba(0, 131, 255, .13),
        0 0 24px rgba(143, 0, 255, .08),
        inset 0 0 20px rgba(0, 119, 255, .04) !important;
}

.card .text-muted,
.text-muted {
    color: #91a8c3 !important;
    opacity: 1;
}

.card h1,
.card h2,
.card h3,
.card h4,
.card h5,
.card h6,
.card p,
.card span,
.card label {
    color: inherit;
}

/* ---------- 07. FORMS ---------- */
.form-control,
select.form-control,
textarea.form-control,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="url"] {
    color: #eef7ff !important;
    background: #06142b !important;
    border: 1px solid rgba(0, 143, 255, .48) !important;
    border-radius: 6px !important;
    box-shadow: inset 0 0 10px rgba(0, 80, 180, .05);
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    color: #7189a5 !important;
}

.form-control:focus,
input:focus,
textarea:focus,
select:focus {
    color: #fff !important;
    background: #071833 !important;
    border-color: #a100ff !important;
    box-shadow:
        0 0 0 1px rgba(0, 193, 255, .26),
        0 0 12px rgba(132, 0, 255, .20) !important;
}

.form-group .form-label,
.form-group label:not(.custom-control-label) {
    color: #b7cbe0 !important;
}

.custom-control-label {
    color: #d9e7f5 !important;
}

/* ---------- 08. BUTTONS ---------- */
.btn,
button.btn,
input[type="submit"],
input[type="button"] {
    border-radius: 6px !important;
    transition: filter .18s ease, box-shadow .18s ease, transform .18s ease;
}

.btn-primary,
button.btn-primary,
.btn-info,
button.btn-info {
    color: #fff !important;
    background: linear-gradient(90deg, #8b00ff, #c000ff 48%, #006dff) !important;
    border: 1px solid rgba(0, 207, 255, .55) !important;
    box-shadow:
        0 0 10px rgba(130, 0, 255, .22),
        inset 0 0 10px rgba(255,255,255,.06);
}

.btn-primary:hover,
button.btn-primary:hover,
.btn-info:hover,
button.btn-info:hover {
    filter: brightness(1.12);
    box-shadow:
        0 0 14px rgba(155, 0, 255, .34),
        0 0 22px rgba(0, 153, 255, .18);
}

.btn-secondary,
button.btn-secondary {
    color: #fff !important;
    background: linear-gradient(90deg, #321079, #162d67) !important;
    border: 1px solid rgba(0, 171, 255, .42) !important;
}

.btn-light,
button.btn-light {
    color: #eaf5ff !important;
    background: #08162d !important;
    border: 1px solid rgba(0, 150, 255, .36) !important;
}

/* ---------- 09. PROFILE / SETTINGS ---------- */
.tpl-client_settings_profile .card,
.page-client_settings_profile .card {
    background:
        linear-gradient(145deg, rgba(3, 12, 30, .98), rgba(4, 7, 24, .98)) !important;
}

.tpl-client_settings_profile ul.nav-pills.flex-nowrap,
.page-client_settings_profile ul.nav-pills.flex-nowrap {
    border-bottom: 1px solid rgba(108, 0, 255, .45) !important;
}

.tpl-client_settings_profile ul.nav-pills .nav-link,
.page-client_settings_profile ul.nav-pills .nav-link {
    color: #8fa8c2 !important;
    border-radius: 4px 4px 0 0 !important;
}

.tpl-client_settings_profile ul.nav-pills .nav-link.active,
.page-client_settings_profile ul.nav-pills .nav-link.active {
    color: #fff !important;
    background: linear-gradient(90deg, rgba(130,0,255,.24), rgba(0,140,255,.12)) !important;
    border-bottom: 2px solid #d100ff !important;
    box-shadow: 0 5px 15px rgba(135,0,255,.10);
}

/* ---------- 10. IMEI ORDER / SERVICE CARDS ---------- */
.cymart-imei-page .card-search,
body.cymart-imei-active .card-search {
    background:
        linear-gradient(90deg, rgba(6, 18, 42, .98), rgba(12, 4, 35, .98)) !important;
    border-color: rgba(0, 163, 255, .55) !important;
}

.cymart-imei-page .service .card-product,
body.cymart-imei-active .service .card-product {
    background:
        linear-gradient(145deg, rgba(8, 17, 39, .98), rgba(7, 5, 29, .98)) !important;
    border-color: rgba(146, 0, 255, .56) !important;
}

.cymart-imei-page .service .card-product:hover,
body.cymart-imei-active .service .card-product:hover {
    border-color: rgba(0, 198, 255, .75) !important;
    box-shadow:
        0 0 18px rgba(126, 0, 255, .22),
        0 0 20px rgba(0, 159, 255, .10) !important;
}

.cymart-imei-page .col-group-icon .bg-gray {
    background: linear-gradient(180deg, #07162e, #060b20) !important;
    border-right: 1px solid rgba(0, 154, 255, .30);
}

.cymart-imei-page .service-list h3.title span,
body.cymart-imei-active h3.title span {
    color: #eef7ff !important;
    background: transparent !important;
    border-color: #9e00ff !important;
    text-shadow: 0 0 10px rgba(143,0,255,.22);
}

.badge-success {
    background: linear-gradient(90deg, #079447, #0acb68) !important;
    color: #fff !important;
    box-shadow: 0 0 8px rgba(0, 226, 106, .15);
}

.badge-warning {
    background: linear-gradient(90deg, #f1a900, #ffd21c) !important;
    color: #16100a !important;
}

/* ---------- 11. DASHBOARD ---------- */
body.cymart-dashboard-active .card {
    background:
        linear-gradient(145deg, rgba(5, 18, 38, .98), rgba(3, 9, 27, .98)) !important;
    border-color: rgba(0, 142, 255, .42) !important;
}

body.cymart-dashboard-active .card:hover {
    border-color: rgba(171, 0, 255, .62) !important;
}

body.cymart-dashboard-active .alert-info {
    background: linear-gradient(90deg, rgba(0, 133, 196, .25), rgba(91, 0, 177, .18)) !important;
    border: 1px solid rgba(0, 188, 255, .42) !important;
    color: #e9faff !important;
}

body.cymart-dashboard-active .big-font {
    text-shadow: 0 0 10px rgba(0, 165, 255, .12);
}

body.cymart-dashboard-active .card input,
body.cymart-dashboard-active .card select,
body.cymart-dashboard-active .card textarea {
    background: #06152b !important;
}

/* ---------- 12. TABLES / ORDERS ---------- */
.table,
.table-responsive {
    color: #e9f4ff !important;
}

.table {
    background: rgba(3, 10, 26, .90) !important;
    border: 1px solid rgba(100, 0, 255, .42) !important;
}

.table thead th {
    color: #65d9ff !important;
    background: rgba(10, 12, 36, .92) !important;
    border-bottom: 1px solid rgba(0, 148, 255, .34) !important;
}

.table td,
.table th {
    border-top-color: rgba(87, 0, 190, .22) !important;
    color: #e8f2ff !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background: rgba(65, 0, 130, .075) !important;
}

.table tbody tr:hover {
    background: rgba(0, 126, 255, .07) !important;
}

.page-link {
    color: #68dfff !important;
    background: #07132a !important;
    border-color: rgba(91, 0, 180, .35) !important;
}

/* ---------- 13. ALERTS / STATUS ---------- */
.alert {
    border-radius: 7px !important;
}

.alert-info {
    color: #e6faff !important;
    background: rgba(0, 129, 189, .18) !important;
    border: 1px solid rgba(0, 188, 255, .38) !important;
}

.alert-success {
    color: #eafff2 !important;
    background: rgba(0, 151, 78, .16) !important;
    border-color: rgba(0, 225, 115, .34) !important;
}

.alert-danger,
.alert-error {
    color: #fff0f5 !important;
    background: rgba(180, 0, 68, .16) !important;
    border-color: rgba(255, 0, 103, .34) !important;
}

/* ---------- 14. MODALS ---------- */
.modal-content {
    color: #edf6ff !important;
    background:
        linear-gradient(145deg, #06152d, #0b0522) !important;
    border: 1px solid rgba(133, 0, 255, .60) !important;
    border-radius: 9px !important;
    box-shadow:
        0 20px 60px rgba(0,0,0,.65),
        0 0 25px rgba(129,0,255,.18) !important;
}

.modal-header {
    color: #fff !important;
    background: linear-gradient(90deg, #160b42, #081b3c) !important;
    border-bottom: 1px solid rgba(0, 158, 255, .30) !important;
}

.modal-header .close {
    color: #fff !important;
    text-shadow: none;
}

/* ---------- 15. HOMEPAGE / BANNER ---------- */
.page-index {
    background: #020611 !important;
}

.page-index .index-banner {
    background-color: #020611 !important;
}

.page-index .carousel-item {
    border-bottom: 1px solid rgba(136, 0, 255, .40);
}

.page-index .banner-content {
    text-shadow: 0 2px 7px rgba(0,0,0,.65);
}

.page-index .carousel-control-next,
.page-index .carousel-control-prev {
    color: #6be2ff !important;
}

.page-index .carousel-indicators li {
    background: rgba(113, 0, 255, .48) !important;
    box-shadow: 0 0 7px rgba(141, 0, 255, .28);
}

.page-index .carousel-indicators li.active {
    background: #00c5ff !important;
    box-shadow: 0 0 10px rgba(0, 196, 255, .65);
}

.page-index .bg-svg,
.page-index .bg-svg2 {
    opacity: .22;
}

/* ---------- 16. FOOTER ---------- */
footer {
    color: #91a9c2 !important;
}

.footer-top {
    background:
        linear-gradient(180deg, rgba(3, 10, 27, .98), rgba(2, 7, 20, .98)) !important;
    border-top: 1px solid rgba(103, 0, 255, .45);
    box-shadow: 0 -5px 24px rgba(79, 0, 255, .10);
}

.footer-top .link-heading {
    color: #eef7ff !important;
}

.footer-top .link-heading::after {
    background: linear-gradient(90deg, #9d00ff, #00bfff) !important;
    box-shadow: 0 0 8px rgba(126, 0, 255, .50);
}

.footer-top .footer-navbar .nav .nav-item a.nav-link,
.footer-top a {
    color: #9cb4cc !important;
}

.footer-top a:hover {
    color: #66ddff !important;
}

.footer-bottom {
    background: #01040d !important;
    color: #8399b0 !important;
    border-top: 1px solid rgba(0, 124, 255, .22);
}

/* ---------- 17. COMMON SMALL UI ---------- */
hr,
.border,
.border-top,
.border-right,
.border-bottom,
.border-left {
    border-color: rgba(103, 0, 255, .25) !important;
}

.dropdown-divider {
    border-top-color: rgba(92, 0, 180, .25) !important;
}

.list-group-item {
    color: #eaf4ff !important;
    background: transparent !important;
    border-color: rgba(92, 0, 180, .22) !important;
}

.progress {
    background: #08142a !important;
}

.progress-bar {
    background: linear-gradient(90deg, #008cff, #a900ff) !important;
    box-shadow: 0 0 9px rgba(104, 0, 255, .30);
}

.spinner-loader,
.ajax-responsive.loading {
    filter: drop-shadow(0 0 7px rgba(0, 190, 255, .35));
}

/* Keep the existing navigation mechanics; this only improves the visual toggle. */
.navbar-toggler {
    color: #69ddff !important;
    border-color: rgba(0, 154, 255, .35) !important;
    background: rgba(5, 18, 40, .75) !important;
}

/* ---------- 18. RESPONSIVE VISUAL TUNING ---------- */
@media (max-width: 991px) {
    body::before,
    body::after {
        opacity: .34;
    }

    .header-middle {
        margin: 5px 7px 0;
        border-radius: 8px;
    }

    .header-top {
        min-height: 30px;
    }

    .page-title {
        font-size: 1.35rem;
    }

    .card,
    .card-product {
        border-radius: 8px !important;
    }
}

/* ---------- 19. ACCESSIBILITY / MOTION ---------- */
@media (prefers-reduced-motion: reduce) {
    .btn,
    button.btn,
    .header-middle .navbar-nav .nav-link {
        transition: none !important;
    }
}

/* ==========================================================================\n   CYMART HARD SURFACE OVERRIDES\n   These rules intentionally use !important because some original template\n   pages load app-css.tpl AFTER this stylesheet. They are visual-only and do\n   not alter JavaScript, forms, AJAX, routes, sessions or order logic.\n   ========================================================================== */
html, body {
    background-color: #020611 !important;
}

body {
    background:
        radial-gradient(circle at 50% -20%, rgba(109, 30, 255, .18), transparent 38%),
        radial-gradient(circle at 8% 60%, rgba(0, 116, 255, .12), transparent 32%),
        radial-gradient(circle at 94% 58%, rgba(164, 0, 255, .12), transparent 34%),
        #020611 !important;
}

header,
.header-top,
.header-middle,
.header-bottom,
main,
.page-container,
.client-area,
.content,
.main-content,
.content-fluid,
.container,
.container-fluid,
.row-fluid,
.bg-gray,
.subcontainerfullwidth,
.app-content-header,
footer {
    background-color: transparent !important;
}

.bg-gray,
.page-container,
.client-area {
    background:
        radial-gradient(circle at 3% 58%, transparent 0 52px, rgba(0,133,255,.20) 53px 54px, transparent 55px 90px, rgba(0,133,255,.11) 91px 92px, transparent 93px 140px),
        radial-gradient(circle at 97% 61%, transparent 0 54px, rgba(154,0,255,.19) 55px 56px, transparent 57px 94px, rgba(154,0,255,.10) 95px 96px, transparent 97px 145px),
        linear-gradient(135deg, #020611 0%, #030d20 52%, #020817 100%) !important;
}

/* Original app-css.tpl is loaded after theme.css on several mobile/app pages. */
.card-app {
    background:
        linear-gradient(145deg, rgba(5, 16, 37, .98), rgba(5, 7, 27, .98)) !important;
    color: #eaf4ff !important;
    border: 1px solid rgba(122, 0, 255, .52) !important;
    border-radius: 12px 12px 0 0 !important;
    box-shadow: 0 0 18px rgba(102, 0, 255, .12) !important;
}

.app-content-header {
    color: #edf6ff !important;
    background: rgba(3, 9, 27, .86) !important;
}

.form-control,
select.form-control,
textarea.form-control,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="url"] {
    color: #eef7ff !important;
    background: #06142b !important;
    border: 1px solid rgba(0, 143, 255, .48) !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #06142b inset !important;
    box-shadow: 0 0 0 30px #06142b inset !important;
    -webkit-text-fill-color: #eef7ff !important;
}

.serchcontent {
    background:
        linear-gradient(90deg, rgba(6, 18, 42, .98), rgba(12, 4, 35, .98)) !important;
    border: 1px solid rgba(0, 163, 255, .55) !important;
}

.banner-type.none,
.mce-panel,
.table,
.table-striped tbody tr:nth-of-type(odd) {
    background-color: transparent !important;
}

.table {
    background: rgba(3, 10, 26, .90) !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background: rgba(65, 0, 130, .075) !important;
}

/* Catch the original theme's common white utility surfaces. */
.bg-white,
.bg-light,
.card.bg-white,
.card.bg-light,
.list-group,
.dropdown-menu,
.modal-content,
.popover,
.tooltip-inner,
.page-link {
    background-color: #07132a !important;
    color: #eaf4ff !important;
}

header .dropdown-menu,
.header-middle .dropdown-menu {
    background: linear-gradient(145deg, rgba(5,13,34,.98), rgba(18,3,37,.98)) !important;
}

button.btn.btn-secondary,
.btn-secondary {
    background: linear-gradient(90deg, #321079, #162d67) !important;
    color: #fff !important;
}

.btn-light,
button.btn.btn-light {
    background: #08162d !important;
    color: #eaf5ff !important;
}

/* =========================================================
   CYMART LOGO — PROTECTED SIZE / VISIBILITY
   Keep the menu logo at the same visual size as the
   existing template. This is visual-only; no template
   markup or logo URL is changed.
   ========================================================= */
.header-middle .navbar-brand {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
    margin-left: 15px !important;
    margin-right: 18px !important;
    padding: 0 !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 20 !important;
}

.header-middle .navbar-brand img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 50px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 50px !important;
    object-fit: contain !important;
    object-position: center center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* Preserve the same 50px logo image size on the three
   pages that already have page-specific logo rules. */
body.cymart-imei-active .header-middle .navbar-brand img,
body.cymart-orders-active .header-middle .navbar-brand img,
body.cymart-dashboard-active .header-middle .navbar-brand img {
    width: auto !important;
    min-width: 0 !important;
    max-width: 50px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 50px !important;
}

/* Do not let generic responsive image rules collapse the logo. */
.header-middle .navbar-brand img.img-fluid,
.header-middle .navbar-brand img.img-thumbnail {
    width: auto !important;
    max-width: 50px !important;
    height: auto !important;
    max-height: 50px !important;
}

@media (max-width: 767.98px) {
    .header-middle .navbar-brand {
        width: 58px !important;
        min-width: 58px !important;
        max-width: 58px !important;
        height: 58px !important;
        min-height: 58px !important;
        max-height: 58px !important;
        margin-left: 8px !important;
        margin-right: 10px !important;
        flex-shrink: 0 !important;
    }

    .header-middle .navbar-brand img {
        max-width: 50px !important;
        max-height: 50px !important;
    }
}

/* ==========================================================================
   CYMART V4 — COMPACT FUTURISTIC HEADER
   FINAL OVERRIDES
   --------------------------------------------------------------------------
   Purpose:
   - Make the main navigation shorter and visually futuristic.
   - Keep the existing logo at 50px.
   - Fit the desktop navigation in the viewport without horizontal scrolling.
   - Remove the gray Bootstrap/theme surface from the navigation bar.
   - Preserve existing links, dropdowns, login, profile, cart and JS behavior.
   ========================================================================== */

/* ---------- HEADER SHELL ---------- */
html,
body {
    max-width: 100%;
    overflow-x: hidden !important;
}

.header-middle {
    width: calc(100% - 20px) !important;
    max-width: none !important;
    margin: 6px 10px 0 !important;
    min-height: 62px !important;
    background:
        linear-gradient(135deg,
            rgba(3, 9, 27, .98) 0%,
            rgba(8, 10, 34, .96) 48%,
            rgba(18, 4, 38, .96) 100%) !important;
    border: 1px solid rgba(91, 42, 255, .78) !important;
    border-radius: 10px !important;
    box-shadow:
        0 0 0 1px rgba(0, 185, 255, .14),
        0 0 14px rgba(108, 0, 255, .28),
        0 0 28px rgba(0, 154, 255, .12),
        inset 0 0 18px rgba(0, 122, 255, .07) !important;
}

.header-middle > .container {
    width: 100% !important;
    max-width: none !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.header-middle > .container > nav.navbar-xl {
    width: 100% !important;
    min-width: 0 !important;
    height: 60px !important;
    min-height: 60px !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    background: transparent !important;
}

/* ---------- LOGO: KEEP CURRENT SIZE ---------- */
.header-middle .navbar-brand,
.header-middle > .container > nav > .navbar-brand {
    flex: 0 0 50px !important;
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    margin-left: 2px !important;
    margin-right: 10px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 20 !important;
}

.header-middle .navbar-brand img,
.header-middle > .container > nav > .navbar-brand img {
    display: block !important;
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 7px !important;
    opacity: 1 !important;
    visibility: visible !important;
    box-shadow:
        0 0 8px rgba(0, 173, 255, .46),
        0 0 17px rgba(157, 0, 255, .30) !important;
}


/* =========================================================
   CYMART V5 — FULL-WIDTH CENTERED FUTURISTIC NAV
   Visual-only override. Keeps all original links, variables,
   dropdowns, sessions and JS untouched.
   ========================================================= */

html, body { max-width:100%; }

.header-middle {
    position:relative !important;
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100vw !important;
    min-width:0 !important;
    margin:6px 0 0 !important;
    padding:0 !important;
    overflow:visible !important;
    background:
        linear-gradient(135deg, rgba(2,8,24,.98), rgba(7,14,35,.98) 48%, rgba(18,5,38,.98)) !important;
    border:1px solid rgba(91,42,255,.82) !important;
    border-radius:10px !important;
    box-shadow:
        0 0 0 1px rgba(0,185,255,.12),
        0 0 16px rgba(108,0,255,.25),
        0 0 28px rgba(0,154,255,.10),
        inset 0 0 18px rgba(0,122,255,.07) !important;
}

.header-middle::before {
    content:"" !important;
    position:absolute !important;
    inset:-1px !important;
    border-radius:inherit !important;
    pointer-events:none !important;
    box-shadow:0 0 8px rgba(185,0,255,.35), 0 0 20px rgba(0,133,255,.16) !important;
}

.header-middle::after {
    content:"" !important;
    position:absolute !important;
    left:2% !important;
    right:2% !important;
    bottom:-1px !important;
    height:1px !important;
    background:linear-gradient(90deg,transparent,#00b8ff,#a900ff,#00b8ff,transparent) !important;
    box-shadow:0 0 10px rgba(0,177,255,.70) !important;
    pointer-events:none !important;
}

.header-middle > .container {
    box-sizing:border-box !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 10px !important;
}

.header-middle > .container > nav.navbar-xl {
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    height:60px !important;
    min-height:60px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
}

/* Logo: deliberately preserved at the current desktop size. */
.header-middle .navbar-brand,
.header-middle > .container > nav > .navbar-brand {
    box-sizing:border-box !important;
    flex:0 0 50px !important;
    width:50px !important;
    min-width:50px !important;
    max-width:50px !important;
    height:50px !important;
    min-height:50px !important;
    max-height:50px !important;
    margin:0 14px 0 2px !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    position:relative !important;
    z-index:20 !important;
    opacity:1 !important;
    visibility:visible !important;
}

.header-middle .navbar-brand img,
.header-middle > .container > nav > .navbar-brand img {
    display:block !important;
    width:50px !important;
    min-width:50px !important;
    max-width:50px !important;
    height:50px !important;
    min-height:50px !important;
    max-height:50px !important;
    object-fit:contain !important;
    object-position:center !important;
    margin:0 !important;
    padding:0 !important;
    border-radius:7px !important;
    opacity:1 !important;
    visibility:visible !important;
    box-shadow:0 0 8px rgba(0,173,255,.46),0 0 17px rgba(157,0,255,.30) !important;
}

/* The menu occupies the full remaining width and is centered. */
.header-middle > .container > nav > .d-none.d-lg-block {
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    display:block !important;
}

.header-middle .navbar-mastermenu {
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex-wrap:nowrap !important;
    gap:0 !important;
}

.header-middle .navbar-mastermenu > .nav-item {
    flex:0 0 auto !important;
    min-width:0 !important;
}

.header-middle .navbar-expand-lg .navbar-nav .nav-link,
.header-middle .navbar-mastermenu > .nav-item > .nav-link {
    box-sizing:border-box !important;
    min-width:0 !important;
    padding:8px 6px !important;
    margin:0 !important;
    border-radius:6px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color:#edf7ff !important;
    font-size:11.5px !important;
    line-height:1.15 !important;
    font-weight:600 !important;
    white-space:nowrap !important;
    text-shadow:0 0 7px rgba(0,166,255,.18) !important;
    background:transparent !important;
    transition:color .18s ease, background .18s ease, box-shadow .18s ease, text-shadow .18s ease !important;
}

.header-middle .navbar-mastermenu > .nav-item > .nav-link:hover,
.header-middle .navbar-mastermenu > .nav-item > .nav-link:focus,
.header-middle .navbar-mastermenu > .nav-item:hover > .nav-link {
    color:#70e6ff !important;
    background:linear-gradient(135deg,rgba(0,164,255,.10),rgba(153,0,255,.14)) !important;
    text-shadow:0 0 7px rgba(0,207,255,.70),0 0 14px rgba(137,0,255,.30) !important;
    box-shadow:inset 0 0 10px rgba(79,0,255,.12),0 0 9px rgba(0,153,255,.08) !important;
}

.header-middle .navbar-expand-lg .navbar-nav .nav-item .nav-link:not(.bg-secondary)::before {
    left:8px !important;
    right:8px !important;
    width:auto !important;
    height:2px !important;
    bottom:2px !important;
    border-radius:4px !important;
    background:linear-gradient(90deg,#8c00ff,#00d8ff) !important;
    box-shadow:0 0 7px rgba(0,208,255,.70),0 0 12px rgba(139,0,255,.35) !important;
}

.header-middle .nav-link i,
.header-middle .lg-icon i {
    color:#72ddff !important;
    text-shadow:0 0 7px rgba(0,205,255,.48) !important;
}

.header-middle .nav-link .fa-chevron-down,
.header-middle .nav-link .fa-chevron-right {
    font-size:8px !important;
    margin-left:4px !important;
}

.header-middle .navbar-mastermenu .bg-secondary,
.header-middle .navbar-mastermenu .btn-secondary {
    min-width:0 !important;
    padding:7px 10px !important;
    border:1px solid rgba(0,181,255,.42) !important;
    border-radius:6px !important;
    background:linear-gradient(135deg,rgba(0,117,194,.28),rgba(102,0,175,.30)) !important;
    color:#f3fbff !important;
}

.header-middle .profile .nav-link {
    padding:5px 7px !important;
    font-size:11px !important;
}

.header-middle .profile .avatar-img { margin-right:5px !important; }
.header-middle .profile .avatar-img img {
    width:25px !important;
    height:25px !important;
    min-width:25px !important;
    max-width:25px !important;
    object-fit:cover !important;
}
.header-middle .profile .user-balance { font-size:10px !important; line-height:1 !important; }

.header-middle > .container > nav > ul.navbar-nav:last-child {
    flex:0 0 auto !important;
    min-width:0 !important;
    width:auto !important;
    margin:0 0 0 4px !important;
}

.header-middle .navbar-xl,
.header-middle .navbar-xl *,
.header-middle .navbar-expand-lg,
.header-middle .navbar-mastermenu {
    background-color:transparent !important;
}

.header-middle .dropdown-menu {
    background:linear-gradient(145deg,rgba(3,10,29,.99),rgba(22,4,43,.99)) !important;
    border:1px solid rgba(0,170,255,.48) !important;
    border-radius:8px !important;
    box-shadow:0 15px 35px rgba(0,0,0,.65),0 0 18px rgba(105,0,255,.24) !important;
}

.header-middle .dropdown-menu .dropdown-item {
    color:#eaf5ff !important;
    font-size:12px !important;
}
.header-middle .dropdown-menu .dropdown-item:hover,
.header-middle .dropdown-menu .dropdown-item:focus {
    color:#69e1ff !important;
    background:linear-gradient(90deg,rgba(0,144,255,.14),rgba(130,0,255,.16)) !important;
}

/* Keep the header itself from becoming a source of horizontal scrolling. */
.header-middle,
.header-middle > .container,
.header-middle > .container > nav.navbar-xl,
.header-middle > .container > nav > .d-none.d-lg-block,
.header-middle .navbar-mastermenu {
    overflow:visible !important;
}

@media (min-width:1200px) {
    .header-middle .navbar-expand-lg .navbar-nav .nav-link,
    .header-middle .navbar-mastermenu > .nav-item > .nav-link {
        padding-left:5px !important;
        padding-right:5px !important;
        font-size:11.5px !important;
    }
}

@media (min-width:992px) and (max-width:1199.98px) {
    .header-middle > .container { padding-left:8px !important; padding-right:8px !important; }
    .header-middle .navbar-brand { margin-right:8px !important; }
    .header-middle .navbar-expand-lg .navbar-nav .nav-link,
    .header-middle .navbar-mastermenu > .nav-item > .nav-link {
        padding-left:3px !important;
        padding-right:3px !important;
        font-size:9.5px !important;
    }
    .header-middle .profile .nav-link { font-size:9px !important; padding-left:4px !important; padding-right:4px !important; }
}

@media (max-width:991.98px) {
    .header-middle {
        width:100% !important;
        max-width:100vw !important;
        margin:5px 0 0 !important;
        min-height:56px !important;
    }
    .header-middle > .container { padding:0 6px !important; }
    .header-middle > .container > nav.navbar-xl { height:54px !important; min-height:54px !important; }
    .header-middle .navbar-brand,
    .header-middle > .container > nav > .navbar-brand {
        flex-basis:48px !important;
        width:48px !important;
        min-width:48px !important;
        max-width:48px !important;
        height:48px !important;
        min-height:48px !important;
        max-height:48px !important;
        margin-left:2px !important;
        margin-right:8px !important;
    }
    .header-middle .navbar-brand img,
    .header-middle > .container > nav > .navbar-brand img {
        width:40px !important;
        min-width:40px !important;
        max-width:40px !important;
        height:40px !important;
        min-height:40px !important;
        max-height:40px !important;
    }
}

/* =========================================================
   CYMART V6 — FINAL FULL-WIDTH / CENTER / ACCOUNT STABILITY
   ========================================================= */
.header-middle {
    position: relative !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    margin-left: 50% !important;
    margin-right: 0 !important;
    transform: translateX(-50%) !important;
    box-sizing: border-box !important;
}

html, body { max-width: 100% !important; overflow-x: hidden !important; }

.header-middle > .container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    box-sizing: border-box !important;
}

.header-middle > .container > nav.navbar-xl {
    width: 100% !important;
    min-width: 0 !important;
    height: 60px !important;
    min-height: 60px !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}

.header-middle > .container > nav > .navbar-brand,
.header-middle .navbar-brand {
    flex: 0 0 50px !important;
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    margin-left: 2px !important;
    margin-right: 16px !important;
}

.header-middle > .container > nav > .navbar-brand img,
.header-middle .navbar-brand img {
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
}

.header-middle > .container > nav > .d-none.d-lg-block {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    display: block !important;
}

.header-middle .navbar-mastermenu {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}

.header-middle .navbar-mastermenu > .nav-item {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
}

.header-middle .navbar-mastermenu > .nav-item > .nav-link,
.header-middle .navbar-expand-lg .navbar-nav .nav-link {
    font-size: 12px !important;
    line-height: 1 !important;
    padding: 8px 7px !important;
    white-space: nowrap !important;
    flex-wrap: nowrap !important;
}

.header-middle > .container > nav > ul.navbar-nav:last-child,
.header-middle > .container > nav > ul.navbar-nav:last-child > li,
.header-middle .profile,
.header-middle .profile > a,
.header-middle .profile .nav-link {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}

.header-middle > .container > nav > ul.navbar-nav:last-child {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    margin-left: 8px !important;
    margin-right: 2px !important;
}

.header-middle .profile .nav-link {
    min-width: max-content !important;
    padding: 5px 8px !important;
    gap: 5px !important;
}

.header-middle .profile .avatar-img { flex: 0 0 auto !important; margin-right: 3px !important; }
.header-middle .profile .avatar-img img {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    object-fit: cover !important;
}
.header-middle .profile .user-balance { font-size: 10px !important; line-height: 1 !important; white-space: nowrap !important; }
.header-middle .profile * { white-space: nowrap !important; }

@media (min-width: 1200px) {
    .header-middle > .container > nav > .d-none.d-lg-block { padding: 0 12px !important; }
    .header-middle .navbar-mastermenu > .nav-item > .nav-link,
    .header-middle .navbar-expand-lg .navbar-nav .nav-link {
        font-size: 12px !important;
        padding-left: 7px !important;
        padding-right: 7px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .header-middle > .container { padding-left: 9px !important; padding-right: 9px !important; }
    .header-middle > .container > nav > .d-none.d-lg-block { padding: 0 4px !important; }
    .header-middle .navbar-mastermenu > .nav-item > .nav-link,
    .header-middle .navbar-expand-lg .navbar-nav .nav-link {
        font-size: 10px !important;
        padding-left: 3px !important;
        padding-right: 3px !important;
    }
    .header-middle .profile .nav-link { font-size: 9px !important; padding-left: 4px !important; padding-right: 4px !important; }
}

@media (max-width: 991.98px) {
    .header-middle {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: 50% !important;
        transform: translateX(-50%) !important;
    }
}


/* =========================================================
   CYMART V7 — WIDER DESKTOP BAR + LOGO NEAR CLIENT AREA
   Visual-only override. Navigation links, dropdowns, sessions and
   existing page dimensions remain untouched.
   ========================================================= */

html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Wider, centered bar on every desktop page. The 16px side breathing
   room keeps the page from looking stretched while using the viewport. */
.header-middle {
    position: relative !important;
    left: 50% !important;
    right: auto !important;
    width: calc(100vw - 32px) !important;
    max-width: calc(100vw - 32px) !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: translateX(-50%) !important;
    box-sizing: border-box !important;
}

.header-middle > .container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-sizing: border-box !important;
}

.header-middle > .container > nav.navbar-xl {
    width: 100% !important;
    min-width: 0 !important;
    height: 60px !important;
    min-height: 60px !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}

/* Keep the menu itself centered and give the logo a fixed visual anchor
   just to the left of Client Area instead of leaving it at the far edge. */
@media (min-width: 1200px) {
    .header-middle > .container > nav > .navbar-brand {
        position: absolute !important;
        left: clamp(150px, calc(50% - 700px), 430px) !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
        z-index: 30 !important;
    }

    .header-middle > .container > nav > .d-none.d-lg-block {
        flex: 1 1 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        display: block !important;
        padding: 0 250px !important;
        box-sizing: border-box !important;
    }

    .header-middle .navbar-mastermenu {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
        gap: 0 !important;
    }

    /* The account/profile area stays as one horizontal unit. */
    .header-middle > .container > nav > ul.navbar-nav:last-child {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: max-content !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        white-space: nowrap !important;
        margin-left: 8px !important;
        margin-right: 2px !important;
        gap: 0 !important;
    }

    .header-middle > .container > nav > ul.navbar-nav:last-child > li {
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        white-space: nowrap !important;
    }

    .header-middle .profile,
    .header-middle .profile > a,
    .header-middle .profile .nav-link {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
    }

    .header-middle .profile .nav-link {
        min-width: max-content !important;
        padding: 5px 8px !important;
        line-height: 1 !important;
        gap: 5px !important;
    }

    .header-middle .profile .avatar-img,
    .header-middle .profile .avatar-img img {
        flex: 0 0 auto !important;
    }

    /* If the theme exposes a separate account toggle, keep it on the same
       line rather than allowing it to drop below the profile control. */
    .header-middle > .container > nav > ul.navbar-nav:last-child > li > a,
    .header-middle > .container > nav > ul.navbar-nav:last-child > li > .nav-link {
        white-space: nowrap !important;
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .header-middle > .container > nav > .navbar-brand {
        position: absolute !important;
        left: 110px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
    }

    .header-middle > .container > nav > .d-none.d-lg-block {
        padding: 0 145px !important;
        box-sizing: border-box !important;
    }

    .header-middle > .container > nav > ul.navbar-nav:last-child {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
    }
}

@media (max-width: 991.98px) {
    .header-middle {
        width: 100vw !important;
        max-width: 100vw !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }
}

/* CYMART V11 - LOGIN MAIN MENU ONLY
   Scoped exclusively to body.page-login so logged-in pages remain unchanged. */

@media (min-width: 1200px) {
    /* Main header/menu on LOGIN only: make the navigation visibly larger. */
    body.page-login .header-middle > .container > nav.navbar-xl {
        height: 68px !important;
        min-height: 68px !important;
    }

    /* Reserve a clear zone for the existing logo; do not move/resize the logo. */
    body.page-login .header-middle > .container > nav > .d-none.d-lg-block {
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        padding: 0 18px 0 330px !important;
        box-sizing: border-box !important;
    }

    body.page-login .header-middle .navbar-mastermenu {
        width: 100% !important;
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
        gap: 2px !important;
    }

    /* Approximately +100% visual scale versus the small login menu. */
    body.page-login .header-middle .navbar-mastermenu > .nav-item > .nav-link,
    body.page-login .header-middle .navbar-expand-lg .navbar-nav .nav-link {
        font-size: 16px !important;
        line-height: 1.2 !important;
        padding: 12px 10px !important;
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    body.page-login .header-middle .navbar-mastermenu > .nav-item > .nav-link i,
    body.page-login .header-middle .nav-link i,
    body.page-login .header-middle .lg-icon i {
        font-size: 14px !important;
    }

    /* Keep the Login control at the same enlarged scale without changing its function. */
    body.page-login .header-middle > .container > nav > .d-none.d-lg-block .bg-secondary,
    body.page-login .header-middle > .container > nav > .d-none.d-lg-block .btn-secondary {
        font-size: 16px !important;
        min-height: 42px !important;
        padding: 10px 14px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    body.page-login .header-middle > .container > nav.navbar-xl {
        height: 64px !important;
        min-height: 64px !important;
    }

    body.page-login .header-middle > .container > nav > .d-none.d-lg-block {
        padding: 0 10px 0 220px !important;
    }

    body.page-login .header-middle .navbar-mastermenu {
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
    }

    body.page-login .header-middle .navbar-mastermenu > .nav-item > .nav-link,
    body.page-login .header-middle .navbar-expand-lg .navbar-nav .nav-link {
        font-size: 13px !important;
        padding: 9px 6px !important;
        min-height: 38px !important;
    }
}

/* ============================================================
   CYMART V12 - RECARGAS DENTRO DEL MAIN DE ORDENES
   SOLO se usa desde client_order_imei.tpl y client_order_server.tpl.
   NO afecta el header ni otras paginas.
   ============================================================ */
.cymart-imei-recharge-actions{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:stretch;
    gap:18px;
    margin:0 auto 22px;
    padding:0;
    box-sizing:border-box;
}

.cymart-imei-recharge-actions .cymart-recharge-action{
    flex:0 1 330px;
    min-height:78px;
    display:flex;
    align-items:center;
    gap:13px;
    padding:13px 17px;
    box-sizing:border-box;
    text-decoration:none !important;
    color:#f4f8ff !important;
    background:linear-gradient(135deg,rgba(3,18,45,.98),rgba(12,8,43,.98));
    border:1px solid rgba(0,153,255,.82);
    border-radius:10px;
    box-shadow:0 0 10px rgba(0,136,255,.16), inset 0 0 18px rgba(0,72,180,.10);
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

.cymart-imei-recharge-actions .cymart-recharge-action:hover{
    transform:translateY(-2px);
    border-color:#b900ff;
    box-shadow:0 0 18px rgba(185,0,255,.28), inset 0 0 20px rgba(0,100,255,.13);
}

.cymart-imei-recharge-actions .cymart-recharge-icon{
    flex:0 0 42px;
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background:rgba(0,126,255,.12);
    border:1px solid rgba(0,174,255,.35);
    font-size:22px;
}

.cymart-imei-recharge-actions .cymart-recharge-copy{
    min-width:0;
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    line-height:1.25;
}

.cymart-imei-recharge-actions .cymart-recharge-copy strong{
    font-size:15px;
    font-weight:700;
    white-space:nowrap;
}

.cymart-imei-recharge-actions .cymart-recharge-copy small{
    margin-top:4px;
    color:#82a7cf !important;
    font-size:11px;
}

.cymart-imei-recharge-actions .cymart-recharge-action > i{
    flex:0 0 auto;
    font-size:14px;
    color:#63caff;
}

/* On the compact server/remote layout keep the pair centered and readable. */
@media (max-width:767.98px){
    .cymart-imei-recharge-actions{
        flex-direction:column;
        gap:10px;
        margin-bottom:16px;
    }
    .cymart-imei-recharge-actions .cymart-recharge-action{
        flex:1 1 auto;
        width:100%;
        min-height:70px;
    }
}

/* ============================================================
   CYMART V13 - RECARGA PREMIUM / FUTURISTA
   Solo afecta al bloque incluido en IMEI / Server / Remote.
   ============================================================ */
.cymart-recharge-panel{
    position:relative;
    width:100%;
    margin:0 auto 24px;
    padding:15px 16px 16px;
    box-sizing:border-box;
    border:1px solid rgba(65,148,255,.22);
    border-radius:16px;
    overflow:hidden;
    background:
        radial-gradient(circle at 12% 0%, rgba(0,153,255,.11), transparent 34%),
        radial-gradient(circle at 88% 100%, rgba(143,0,255,.09), transparent 34%),
        linear-gradient(135deg,rgba(4,15,36,.97),rgba(9,9,29,.98));
    box-shadow:0 12px 32px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.035);
}

.cymart-recharge-panel::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.025) 48%,transparent 52%);
    transform:translateX(-100%);
    animation:cymartRechargePanelSweep 7s ease-in-out infinite;
}

.cymart-recharge-panel-head{
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    gap:14px;
    margin:0 2px 13px;
}

.cymart-recharge-panel-title{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

.cymart-recharge-panel-title > span:last-child{
    display:flex;
    flex-direction:column;
    line-height:1.15;
}

.cymart-recharge-panel-title strong{
    color:#eef7ff;
    font-size:14px;
    font-weight:800;
    letter-spacing:.35px;
    text-transform:uppercase;
}

.cymart-recharge-panel-title small{
    margin-top:3px;
    color:#7595bd;
    font-size:10px;
    letter-spacing:.15px;
}

.cymart-recharge-panel-orb{
    width:29px;
    height:29px;
    flex:0 0 29px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(0,174,255,.38);
    border-radius:9px;
    color:#61d4ff;
    background:rgba(0,139,255,.09);
    box-shadow:0 0 15px rgba(0,163,255,.12);
}

.cymart-recharge-panel-orb i{font-size:13px;}

.cymart-recharge-panel-line{
    height:1px;
    flex:1;
    background:linear-gradient(90deg,rgba(70,155,255,.25),transparent);
}

.cymart-imei-recharge-actions{
    position:relative;
    z-index:1;
    width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin:0;
    padding:0;
    box-sizing:border-box;
}

.cymart-imei-recharge-actions .cymart-recharge-action{
    position:relative;
    min-width:0;
    min-height:88px;
    display:flex;
    align-items:center;
    gap:13px;
    padding:13px 14px;
    box-sizing:border-box;
    overflow:hidden;
    isolation:isolate;
    text-decoration:none !important;
    color:#f4f8ff !important;
    border:1px solid rgba(86,157,255,.30);
    border-radius:13px;
    background:linear-gradient(135deg,rgba(8,25,52,.98),rgba(10,12,35,.98));
    box-shadow:0 7px 20px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.035);
    transform:translateY(0);
    transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease,background .28s ease;
}

.cymart-imei-recharge-actions .cymart-recharge-action::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    background:radial-gradient(circle at 0% 50%,rgba(0,151,255,.14),transparent 48%);
    opacity:.65;
    transition:opacity .3s ease,transform .3s ease;
}

.cymart-imei-recharge-actions .cymart-recharge-action::after{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:-55%;
    width:42%;
    z-index:3;
    pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);
    transform:skewX(-18deg);
    transition:left .6s ease;
}

.cymart-recharge-action .cymart-recharge-shine{
    position:absolute;
    width:130px;
    height:130px;
    right:-75px;
    top:-70px;
    border-radius:50%;
    pointer-events:none;
    opacity:.42;
    filter:blur(3px);
    background:radial-gradient(circle,rgba(0,174,255,.22),transparent 68%);
    transition:transform .4s ease,opacity .4s ease;
}

.cymart-recharge-action .cymart-recharge-icon{
    position:relative;
    flex:0 0 49px;
    width:49px;
    height:49px;
    display:flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    border-radius:14px;
    font-size:22px;
    transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease;
}

.cymart-recharge-action .cymart-recharge-icon svg{
    width:29px;
    height:29px;
    display:block;
}

.cymart-recharge-binance .cymart-recharge-icon{
    color:#f3ba2f;
    border:1px solid rgba(243,186,47,.35);
    background:linear-gradient(145deg,rgba(243,186,47,.15),rgba(243,186,47,.035));
    box-shadow:0 0 17px rgba(243,186,47,.08),inset 0 0 13px rgba(243,186,47,.04);
}

.cymart-recharge-transfer .cymart-recharge-icon{
    color:#55c8ff;
    border:1px solid rgba(55,190,255,.34);
    background:linear-gradient(145deg,rgba(0,160,255,.15),rgba(0,160,255,.035));
    box-shadow:0 0 17px rgba(0,167,255,.08),inset 0 0 13px rgba(0,167,255,.04);
}

.cymart-recharge-copy{
    min-width:0;
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    line-height:1.15;
}

.cymart-recharge-copy .cymart-recharge-kicker{
    margin-bottom:4px;
    font-size:8px;
    line-height:1;
    font-weight:800;
    letter-spacing:1.15px;
    color:#7191b7;
}

.cymart-recharge-copy strong{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#f3f8ff;
    font-size:14px;
    font-weight:800;
    letter-spacing:.05px;
}

.cymart-recharge-copy small{
    margin-top:5px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#7898bd !important;
    font-size:10px;
}

.cymart-recharge-arrow{
    position:relative;
    z-index:4;
    flex:0 0 29px;
    width:29px;
    height:29px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(100,180,255,.18);
    border-radius:9px;
    color:#6fcfff;
    background:rgba(0,140,255,.055);
    transition:transform .28s ease,background .28s ease,color .28s ease,border-color .28s ease;
}

.cymart-recharge-arrow i{font-size:12px;}

.cymart-recharge-action:hover{
    transform:translateY(-4px) scale(1.008) !important;
}

.cymart-recharge-action:hover::before{
    opacity:1;
    transform:scale(1.08);
}

.cymart-recharge-action:hover::after{left:125%;}

.cymart-recharge-action:hover .cymart-recharge-icon{
    transform:scale(1.08) rotate(-2deg);
}

.cymart-recharge-action:hover .cymart-recharge-arrow{
    transform:translateX(4px);
}

.cymart-recharge-action:hover .cymart-recharge-shine{
    opacity:.8;
    transform:scale(1.25);
}

.cymart-recharge-binance:hover{
    border-color:rgba(243,186,47,.78) !important;
    background:linear-gradient(135deg,rgba(39,34,17,.99),rgba(15,13,28,.99));
    box-shadow:0 11px 30px rgba(0,0,0,.25),0 0 25px rgba(243,186,47,.14),inset 0 0 22px rgba(243,186,47,.055) !important;
}

.cymart-recharge-binance:hover .cymart-recharge-icon{
    box-shadow:0 0 25px rgba(243,186,47,.25),inset 0 0 14px rgba(243,186,47,.08);
}

.cymart-recharge-binance:hover .cymart-recharge-arrow{
    color:#f3ba2f;
    border-color:rgba(243,186,47,.42);
    background:rgba(243,186,47,.08);
}

.cymart-recharge-transfer:hover{
    border-color:rgba(64,201,255,.78) !important;
    background:linear-gradient(135deg,rgba(8,35,57,.99),rgba(10,13,34,.99));
    box-shadow:0 11px 30px rgba(0,0,0,.25),0 0 25px rgba(0,171,255,.15),inset 0 0 22px rgba(0,171,255,.055) !important;
}

.cymart-recharge-transfer:hover .cymart-recharge-icon{
    box-shadow:0 0 25px rgba(0,185,255,.24),inset 0 0 14px rgba(0,185,255,.08);
}

.cymart-recharge-transfer:hover .cymart-recharge-arrow{
    color:#5bd2ff;
    border-color:rgba(64,201,255,.42);
    background:rgba(0,171,255,.08);
}

@keyframes cymartRechargePanelSweep{
    0%,55%,100%{transform:translateX(-100%);opacity:0;}
    65%{opacity:1;}
    78%{transform:translateX(220%);opacity:0;}
}

@media (max-width:767.98px){
    .cymart-recharge-panel{
        padding:13px 12px 12px;
        margin-bottom:17px;
        border-radius:13px;
    }
    .cymart-recharge-panel-head{margin-bottom:11px;}
    .cymart-recharge-panel-title strong{font-size:12px;}
    .cymart-recharge-panel-title small{font-size:9px;}
    .cymart-imei-recharge-actions{grid-template-columns:1fr;gap:9px;}
    .cymart-imei-recharge-actions .cymart-recharge-action{min-height:76px;padding:11px 12px;}
    .cymart-recharge-action .cymart-recharge-icon{flex-basis:44px;width:44px;height:44px;border-radius:12px;}
    .cymart-recharge-action .cymart-recharge-icon svg{width:26px;height:26px;}
    .cymart-recharge-copy strong{font-size:13px;}
}

/* ============================================================
   CYMART V14 - RECARGAS AURORA / LOGO BINANCE REAL
   Solo afecta al panel de recarga.
   ============================================================ */
.cymart-recharge-panel{
    border:1px solid rgba(190,104,255,.38);
    background:
        radial-gradient(circle at 7% 8%, rgba(255,178,55,.16), transparent 25%),
        radial-gradient(circle at 93% 18%, rgba(255,56,178,.18), transparent 29%),
        radial-gradient(circle at 50% 120%, rgba(86,49,255,.22), transparent 45%),
        linear-gradient(125deg,#11132d 0%,#17102d 42%,#24112f 72%,#11172e 100%);
    box-shadow:0 14px 42px rgba(0,0,0,.28),0 0 28px rgba(168,66,255,.08),inset 0 1px 0 rgba(255,255,255,.055);
}

.cymart-recharge-panel::after{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    right:-145px;
    top:-170px;
    border-radius:50%;
    border:1px solid rgba(255,91,191,.12);
    box-shadow:0 0 0 22px rgba(255,91,191,.025),0 0 0 44px rgba(255,91,191,.018);
    pointer-events:none;
}

.cymart-recharge-panel-title strong{
    text-shadow:0 0 14px rgba(213,130,255,.18);
}

.cymart-recharge-panel-orb{
    border-color:rgba(210,117,255,.48);
    color:#e1a1ff;
    background:linear-gradient(145deg,rgba(177,72,255,.18),rgba(255,82,179,.08));
    box-shadow:0 0 18px rgba(191,71,255,.18),inset 0 0 12px rgba(255,255,255,.035);
}

.cymart-recharge-panel-line{
    background:linear-gradient(90deg,rgba(214,113,255,.42),rgba(255,81,183,.16),transparent);
}

.cymart-imei-recharge-actions .cymart-recharge-action{
    min-height:92px;
    border-color:rgba(167,126,255,.28);
    background:
        radial-gradient(circle at 8% 50%,rgba(255,179,50,.075),transparent 25%),
        linear-gradient(135deg,rgba(24,23,55,.98),rgba(13,19,45,.98));
    box-shadow:0 9px 25px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.045);
}

.cymart-imei-recharge-actions .cymart-recharge-action::before{
    background:
        radial-gradient(circle at 0% 50%,rgba(171,70,255,.18),transparent 44%),
        radial-gradient(circle at 100% 50%,rgba(255,68,174,.08),transparent 42%);
}

.cymart-recharge-action .cymart-recharge-icon{
    width:54px;
    height:54px;
    flex-basis:54px;
    border-radius:16px;
}

.cymart-recharge-binance .cymart-recharge-icon{
    color:#f3ba2f;
    border-color:rgba(243,186,47,.46);
    background:radial-gradient(circle,rgba(243,186,47,.13),rgba(243,186,47,.025) 70%);
    box-shadow:0 0 20px rgba(243,186,47,.11),inset 0 0 16px rgba(243,186,47,.045);
}

.cymart-recharge-binance .cymart-recharge-icon img{
    position:relative;
    z-index:2;
    width:38px;
    height:38px;
    object-fit:contain;
    display:block;
    transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s ease;
}

.cymart-binance-ring{
    position:absolute;
    inset:-5px;
    border:1px solid rgba(243,186,47,.20);
    border-radius:19px;
    opacity:.6;
    transition:transform .4s ease,opacity .4s ease;
}

.cymart-recharge-transfer .cymart-recharge-icon{
    border-color:rgba(76,208,255,.42);
    background:radial-gradient(circle,rgba(35,185,255,.14),rgba(35,185,255,.025) 70%);
    box-shadow:0 0 20px rgba(0,180,255,.12),inset 0 0 16px rgba(0,180,255,.045);
}

.cymart-recharge-action:hover{
    transform:translateY(-5px) scale(1.012) !important;
}

.cymart-recharge-binance:hover{
    border-color:rgba(243,186,47,.88) !important;
    background:
        radial-gradient(circle at 15% 50%,rgba(243,186,47,.15),transparent 30%),
        linear-gradient(135deg,rgba(47,36,16,.99),rgba(24,17,38,.99));
    box-shadow:0 15px 38px rgba(0,0,0,.30),0 0 34px rgba(243,186,47,.20),inset 0 0 26px rgba(243,186,47,.06) !important;
}

.cymart-recharge-binance:hover .cymart-recharge-icon img{
    transform:scale(1.13) rotate(-2deg);
    filter:drop-shadow(0 0 9px rgba(243,186,47,.45));
}

.cymart-recharge-binance:hover .cymart-binance-ring{
    transform:scale(1.12);
    opacity:1;
}

.cymart-recharge-transfer:hover{
    border-color:rgba(77,215,255,.88) !important;
    background:
        radial-gradient(circle at 15% 50%,rgba(0,196,255,.13),transparent 30%),
        linear-gradient(135deg,rgba(10,43,61,.99),rgba(17,17,43,.99));
    box-shadow:0 15px 38px rgba(0,0,0,.30),0 0 34px rgba(0,184,255,.19),inset 0 0 26px rgba(0,184,255,.06) !important;
}

.cymart-recharge-copy strong{font-size:15px;}
.cymart-recharge-copy small{font-size:10px;}

@media (max-width:767.98px){
    .cymart-recharge-action .cymart-recharge-icon{width:48px;height:48px;flex-basis:48px;}
    .cymart-recharge-binance .cymart-recharge-icon img{width:34px;height:34px;}
}

/* ============================================================
   CYMART V15 - HUD GAMING / NEON GREEN
   Referencia visual: marco angular, negro profundo y verde neon.
   Solo afecta al panel de recargas.
   ============================================================ */
.cymart-recharge-panel{
    position:relative;
    margin:0 auto 24px;
    padding:18px 18px 20px;
    border:1px solid rgba(70,255,0,.78) !important;
    border-radius:0 !important;
    overflow:hidden;
    isolation:isolate;
    background:
        radial-gradient(circle at 8% 40%,rgba(70,255,0,.12),transparent 27%),
        radial-gradient(circle at 92% 56%,rgba(23,180,0,.10),transparent 28%),
        linear-gradient(135deg,#020a04 0%,#041507 45%,#020a04 100%) !important;
    box-shadow:
        0 0 0 1px rgba(0,0,0,.9),
        0 12px 35px rgba(0,0,0,.48),
        0 0 22px rgba(54,255,0,.18),
        inset 0 0 28px rgba(54,255,0,.035) !important;
    clip-path:polygon(0 18px,18px 0,calc(100% - 18px) 0,100% 18px,100% calc(100% - 18px),calc(100% - 18px) 100%,18px 100%,0 calc(100% - 18px));
}

/* Angular neon frame */
.cymart-recharge-panel::before{
    content:"";
    position:absolute;
    inset:5px;
    z-index:-1;
    pointer-events:none;
    border:1px solid rgba(84,255,0,.42);
    clip-path:polygon(0 15px,15px 0,calc(100% - 15px) 0,100% 15px,100% calc(100% - 15px),calc(100% - 15px) 100%,15px 100%,0 calc(100% - 15px));
    background:
        linear-gradient(90deg,transparent 0 9%,rgba(86,255,0,.22) 9.2% 9.6%,transparent 9.8% 48%,rgba(86,255,0,.18) 48.2% 48.5%,transparent 48.7% 91%,rgba(86,255,0,.22) 91.2% 91.6%,transparent 91.8%);
    box-shadow:0 0 15px rgba(71,255,0,.24),inset 0 0 14px rgba(71,255,0,.06);
}

/* Moving green energy line */
.cymart-recharge-panel::after{
    content:"";
    position:absolute;
    top:0;
    left:-35%;
    width:32%;
    height:2px;
    z-index:5;
    pointer-events:none;
    background:linear-gradient(90deg,transparent,#b9ff7a,#38ff00,transparent);
    box-shadow:0 0 10px #58ff00,0 0 24px rgba(72,255,0,.7);
    animation:cymartV15PanelSweep 5.5s linear infinite;
}

@keyframes cymartV15PanelSweep{
    0%{transform:translateX(0);opacity:0;}
    8%{opacity:1;}
    72%{opacity:1;}
    100%{transform:translateX(430%);opacity:0;}
}

.cymart-recharge-panel-head{
    margin:0 3px 15px;
    gap:14px;
}

.cymart-recharge-panel-title{
    gap:11px;
}

.cymart-recharge-panel-title strong{
    color:#f2fff0 !important;
    font-size:16px;
    font-weight:900;
    letter-spacing:.45px;
    text-shadow:0 0 12px rgba(81,255,0,.35);
}

.cymart-recharge-panel-title small{
    color:#c8eec1 !important;
    font-size:10px;
    margin-top:4px;
}

.cymart-recharge-panel-orb{
    width:34px;
    height:34px;
    flex-basis:34px;
    border-radius:9px !important;
    border:1px solid rgba(73,255,0,.78) !important;
    color:#aaff70 !important;
    background:linear-gradient(145deg,rgba(61,255,0,.18),rgba(5,45,7,.65)) !important;
    box-shadow:0 0 12px rgba(71,255,0,.34),inset 0 0 13px rgba(71,255,0,.08) !important;
}

.cymart-recharge-panel-orb i{font-size:16px;}

.cymart-recharge-panel-line{
    background:linear-gradient(90deg,rgba(74,255,0,.50),rgba(74,255,0,.16),transparent) !important;
    box-shadow:0 0 7px rgba(75,255,0,.22);
}

.cymart-imei-recharge-actions{
    gap:16px;
}

.cymart-imei-recharge-actions .cymart-recharge-action{
    min-height:104px;
    padding:15px 18px;
    border:1px solid rgba(74,255,0,.78) !important;
    border-radius:0 !important;
    background:
        radial-gradient(circle at 18% 50%,rgba(71,255,0,.10),transparent 29%),
        linear-gradient(120deg,#06170a 0%,#020b05 58%,#061408 100%) !important;
    box-shadow:
        0 9px 22px rgba(0,0,0,.38),
        0 0 11px rgba(58,255,0,.12),
        inset 0 0 18px rgba(58,255,0,.045) !important;
    clip-path:polygon(0 14px,14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px));
    transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease,filter .32s ease !important;
}

/* Inner angular frame on each method */
.cymart-imei-recharge-actions .cymart-recharge-action::before{
    inset:4px !important;
    z-index:-2 !important;
    opacity:1 !important;
    border:1px solid rgba(65,255,0,.23);
    clip-path:polygon(0 9px,9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px));
    background:
        linear-gradient(120deg,transparent 0 16%,rgba(72,255,0,.045) 16.2% 34%,transparent 34.2% 100%);
}

.cymart-imei-recharge-actions .cymart-recharge-action::after{
    top:0;
    bottom:0;
    left:-70%;
    width:38%;
    background:linear-gradient(90deg,transparent,rgba(164,255,125,.20),rgba(86,255,0,.55),transparent);
    transform:skewX(-20deg);
    transition:left .72s ease;
    z-index:3;
}

.cymart-recharge-action .cymart-recharge-shine{
    width:180px;
    height:180px;
    right:-105px;
    top:-85px;
    opacity:.22;
    background:radial-gradient(circle,rgba(69,255,0,.22),transparent 68%);
}

.cymart-recharge-action .cymart-recharge-icon{
    width:66px;
    height:66px;
    flex-basis:66px;
    border-radius:50% !important;
    z-index:2;
}

.cymart-recharge-binance .cymart-recharge-icon{
    border:1px solid rgba(255,215,52,.80) !important;
    background:radial-gradient(circle at 35% 30%,rgba(255,225,78,.18),rgba(36,36,4,.55) 72%) !important;
    box-shadow:0 0 0 4px rgba(82,255,0,.08),0 0 19px rgba(255,194,25,.24),inset 0 0 15px rgba(255,210,44,.10) !important;
}

.cymart-recharge-binance .cymart-recharge-icon img{
    width:47px;
    height:47px;
    object-fit:contain;
    filter:drop-shadow(0 0 6px rgba(255,190,0,.30));
}

.cymart-binance-ring{
    inset:-7px;
    border:1px solid rgba(75,255,0,.42) !important;
    border-radius:50%;
    box-shadow:0 0 12px rgba(72,255,0,.18);
}

.cymart-recharge-transfer .cymart-recharge-icon{
    border:1px solid rgba(29,188,255,.92) !important;
    background:radial-gradient(circle at 35% 30%,rgba(48,205,255,.28),rgba(2,37,59,.62) 72%) !important;
    box-shadow:0 0 0 4px rgba(0,177,255,.08),0 0 20px rgba(0,185,255,.28),inset 0 0 15px rgba(0,184,255,.10) !important;
}

.cymart-recharge-transfer .cymart-recharge-icon svg{
    width:34px;
    height:34px;
    color:#6bdcff;
    filter:drop-shadow(0 0 6px rgba(0,190,255,.38));
}

.cymart-recharge-copy .cymart-recharge-kicker{
    color:#8cff61 !important;
    font-size:8px;
    letter-spacing:1.55px;
    text-shadow:0 0 8px rgba(75,255,0,.22);
}

.cymart-recharge-copy strong{
    color:#ffffff !important;
    font-size:17px;
    font-weight:900;
    letter-spacing:.1px;
    text-shadow:0 1px 3px rgba(0,0,0,.8);
}

.cymart-recharge-copy small{
    color:#b7d9b1 !important;
    font-size:10px;
    margin-top:5px;
}

.cymart-recharge-arrow{
    width:38px;
    height:38px;
    flex-basis:38px;
    border:1px solid rgba(76,255,0,.58) !important;
    border-radius:50% !important;
    color:#8cff61 !important;
    background:rgba(53,255,0,.055) !important;
    box-shadow:0 0 10px rgba(65,255,0,.10),inset 0 0 9px rgba(65,255,0,.04);
}

.cymart-recharge-arrow i{font-size:16px;}

.cymart-recharge-action:hover{
    transform:translateY(-6px) scale(1.012) !important;
    filter:saturate(1.08);
    box-shadow:
        0 16px 32px rgba(0,0,0,.45),
        0 0 18px rgba(62,255,0,.26),
        0 0 42px rgba(62,255,0,.10),
        inset 0 0 26px rgba(62,255,0,.07) !important;
}

.cymart-recharge-action:hover::after{left:135%;}

.cymart-recharge-action:hover .cymart-recharge-icon{
    transform:scale(1.10) !important;
}

.cymart-recharge-binance:hover .cymart-recharge-icon{
    border-color:#ffe45c !important;
    box-shadow:0 0 0 5px rgba(76,255,0,.10),0 0 28px rgba(255,200,20,.42),0 0 42px rgba(72,255,0,.12),inset 0 0 17px rgba(255,220,50,.12) !important;
}

.cymart-recharge-binance:hover .cymart-recharge-icon img{
    transform:scale(1.10) rotate(-2deg);
    filter:drop-shadow(0 0 11px rgba(255,205,25,.68));
}

.cymart-recharge-transfer:hover .cymart-recharge-icon{
    border-color:#7ce7ff !important;
    box-shadow:0 0 0 5px rgba(0,188,255,.10),0 0 30px rgba(0,190,255,.42),0 0 42px rgba(68,255,0,.10),inset 0 0 17px rgba(0,210,255,.13) !important;
}

.cymart-recharge-action:hover .cymart-recharge-arrow{
    transform:translateX(5px) !important;
    color:#d4ffbe !important;
    border-color:#7aff4f !important;
    background:rgba(64,255,0,.13) !important;
    box-shadow:0 0 14px rgba(72,255,0,.28);
}

.cymart-recharge-binance:hover .cymart-recharge-copy .cymart-recharge-kicker{color:#b4ff83 !important;}
.cymart-recharge-transfer:hover .cymart-recharge-copy .cymart-recharge-kicker{color:#7be8ff !important;}

@media (max-width:767.98px){
    .cymart-recharge-panel{
        padding:14px 12px 15px;
        clip-path:polygon(0 14px,14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px));
    }
    .cymart-recharge-panel-title strong{font-size:13px;}
    .cymart-recharge-panel-title small{font-size:9px;}
    .cymart-imei-recharge-actions{grid-template-columns:1fr;gap:11px;}
    .cymart-imei-recharge-actions .cymart-recharge-action{min-height:88px;padding:12px 13px;}
    .cymart-recharge-action .cymart-recharge-icon{width:54px;height:54px;flex-basis:54px;}
    .cymart-recharge-binance .cymart-recharge-icon img{width:39px;height:39px;}
    .cymart-recharge-copy strong{font-size:14px;}
    .cymart-recharge-arrow{width:34px;height:34px;flex-basis:34px;}
}

@media (prefers-reduced-motion: reduce){
    .cymart-recharge-panel::after{animation:none;}
}


/* V103 - transferencia con brillo más notorio */
.cymart-recharge-transfer{
    will-change:transform, box-shadow;
}

.cymart-recharge-transfer:hover,
.cymart-recharge-transfer:focus-visible{
    border-color:rgba(79,214,255,.92) !important;
    box-shadow:
        0 14px 36px rgba(0,0,0,.30),
        0 0 30px rgba(84,212,255,.26),
        0 0 54px rgba(84,212,255,.10),
        inset 0 0 26px rgba(0,171,255,.10) !important;
}

.cymart-recharge-transfer:hover .cymart-recharge-icon,
.cymart-recharge-transfer:focus-visible .cymart-recharge-icon{
    box-shadow:0 0 28px rgba(0,185,255,.28), inset 0 0 16px rgba(0,185,255,.10);
}

.cymart-recharge-transfer:hover .cymart-recharge-arrow,
.cymart-recharge-transfer:focus-visible .cymart-recharge-arrow{
    color:#dff8ff;
    border-color:rgba(95,220,255,.55);
    background:rgba(0,190,255,.16);
    box-shadow:0 0 20px rgba(84,212,255,.22);
}

.cymart-recharge-transfer:hover .cymart-recharge-shine,
.cymart-recharge-transfer:focus-visible .cymart-recharge-shine{
    opacity:.95;
    transform:scale(1.35);
}

/* ---- SOURCE: /templates/default/css/cymart-imei-reference-v27.css ---- */
/* ======================================================================
   CYMART IMEI REFERENCE VISUAL V23
   Visual-only override for the existing IMEI order page.
   - Keeps the original select/search/discount controls and event handlers.
   - Keeps loadItems(), searchService(), showdiscounted(), popupOrder(), AJAX.
   - No database/config/comm.php changes.
   - Loaded last from footer.tpl to win over legacy visual layers.
   ====================================================================== */

:root{
  --cymart-v23-blue:#0a94ee;
  --cymart-v23-title:#12378f;
  --cymart-v23-text:#4f638f;
  --cymart-v23-border:rgba(166,194,241,.62);
  --cymart-v23-glass:rgba(255,255,255,.80);
  --cymart-v23-shadow:0 18px 42px rgba(71,113,188,.10), inset 0 1px 0 rgba(255,255,255,.96);
}

/* The approved reference uses almost the full viewport width. */
html body .cymart-imei-page > .container{
  width:calc(100% - 40px) !important;
  max-width:none !important;
  margin-left:20px !important;
  margin-right:16px !important;
  padding-left:0 !important;
  padding-right:0 !important;
}
html body .cymart-imei-page > .container > .page-container{
  width:100% !important;
  max-width:none !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

/* ---------------- FILTER / SEARCH GLASS BAR ---------------- */
html body .cymart-imei-page .card.card-search{
  position:relative !important;
  z-index:5 !important;
  min-height:84px !important;
  height:auto !important;
  margin:16px 0 30px 0 !important;
  padding:16px 22px !important;
  border:1px solid rgba(255,255,255,.88) !important;
  border-radius:21px !important;
  background:linear-gradient(100deg,rgba(255,255,255,.82),rgba(247,251,255,.72)) !important;
  box-shadow:var(--cymart-v23-shadow) !important;
  backdrop-filter:blur(18px) saturate(118%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(118%) !important;
  overflow:visible !important;
}

html body .cymart-imei-page .card.card-search > .form-inline{
  display:grid !important;
  grid-template-columns:40px minmax(190px,260px) minmax(250px,360px) minmax(12px,1fr) auto !important;
  column-gap:16px !important;
  row-gap:0 !important;
  align-items:center !important;
  width:100% !important;
  min-height:50px !important;
  margin:0 !important;
}

/* search glyph */
html body .cymart-imei-page .card.card-search > .form-inline > .form-group.pr-3{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:40px !important;
  height:50px !important;
  min-width:40px !important;
  margin:0 !important;
  padding:0 !important;
}
html body .cymart-imei-page .card.card-search > .form-inline > .form-group.pr-3 > i{
  display:block !important;
  margin:0 !important;
  color:var(--cymart-v23-blue) !important;
  font-size:32px !important;
  font-weight:400 !important;
  line-height:1 !important;
  text-shadow:none !important;
  filter:none !important;
}

/* ---------------- ALL GROUP ---------------- */
html body .cymart-imei-page .card.card-search .cymart-group-filter-wrap{
  position:relative !important;
  grid-column:2 !important;
  display:block !important;
  flex:none !important;
  width:100% !important;
  min-width:0 !important;
  max-width:260px !important;
  height:44px !important;
  min-height:44px !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
}

html body .cymart-imei-page .card.card-search select.cymart-group-filter.cymart-group-filter-native-overlay,
html body .cymart-imei-page .card.card-search select.cymart-group-filter{
  position:absolute !important;
  inset:0 !important;
  z-index:6 !important;
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:44px !important;
  min-height:44px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:10px !important;
  outline:0 !important;
  background:transparent !important;
  background-image:none !important;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  box-shadow:none !important;
  opacity:.001 !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;
  cursor:pointer !important;
}

html body .cymart-imei-page .card.card-search .cymart-group-filter-face{
  position:relative !important;
  z-index:2 !important;
  display:flex !important;
  align-items:center !important;
  width:100% !important;
  height:44px !important;
  min-height:44px !important;
  box-sizing:border-box !important;
  margin:0 !important;
  padding:0 42px 0 16px !important;
  overflow:hidden !important;
  white-space:nowrap !important;
  text-overflow:ellipsis !important;
  border:1px solid var(--cymart-v23-border) !important;
  border-radius:10px !important;
  background:rgba(255,255,255,.72) !important;
  color:var(--cymart-v23-text) !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.94) !important;
  font-family:inherit !important;
  font-size:17px !important;
  font-weight:500 !important;
  line-height:1 !important;
  text-align:left !important;
  pointer-events:none !important;
}
/* restore the elegant chevron intentionally removed by the older cleanup */
html body .cymart-imei-page .card.card-search .cymart-group-filter-face::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  top:50% !important;
  right:18px !important;
  width:10px !important;
  height:10px !important;
  margin-top:-7px !important;
  border-right:2px solid #60739e !important;
  border-bottom:2px solid #60739e !important;
  transform:rotate(45deg) !important;
  transform-origin:center !important;
  opacity:.95 !important;
}

html body .cymart-imei-page .card.card-search select.cymart-group-filter option,
html body .cymart-imei-page .card.card-search select.cymart-group-filter.cymart-group-filter-native-overlay option{
  color:#243a63 !important;
  -webkit-text-fill-color:#243a63 !important;
  background:#ffffff !important;
  font-size:15px !important;
}


html body .cymart-imei-page .card.card-search select.cymart-group-filter:focus,
html body .cymart-imei-page .card.card-search select.cymart-group-filter.cymart-group-filter-native-overlay:focus{
  opacity:1 !important;
  color:#243a63 !important;
  -webkit-text-fill-color:#243a63 !important;
  background:#ffffff !important;
}
html body .cymart-imei-page .card.card-search .cymart-group-filter-wrap.cymart-group-filter-focus .cymart-group-filter-face{
  opacity:0 !important;
}
html body .cymart-imei-page .card.card-search .cymart-group-filter-wrap.cymart-group-filter-focus .cymart-group-filter-face{
  border-color:rgba(49,145,248,.72) !important;
  box-shadow:0 0 0 3px rgba(49,145,248,.10), inset 0 1px 1px rgba(255,255,255,.96) !important;
  outline:0 !important;
}

/* ---------------- SEARCH SERVICE ---------------- */
html body .cymart-imei-page .card.card-search > .form-inline > .form-group.mb-0{
  grid-column:3 !important;
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:360px !important;
  height:50px !important;
  margin:0 !important;
  padding:0 !important;
}
html body .cymart-imei-page .card.card-search #searchservicebox2.form-control{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:50px !important;
  min-height:50px !important;
  margin:0 !important;
  padding:0 18px !important;
  border:1px solid var(--cymart-v23-border) !important;
  border-radius:10px !important;
  outline:0 !important;
  background:rgba(255,255,255,.72) !important;
  color:#43577f !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.94) !important;
  font-family:inherit !important;
  font-size:17px !important;
  font-weight:400 !important;
  line-height:50px !important;
}
html body .cymart-imei-page .card.card-search #searchservicebox2.form-control::placeholder{
  color:#687da8 !important;
  opacity:.95 !important;
}
html body .cymart-imei-page .card.card-search #searchservicebox2.form-control:focus{
  border-color:rgba(49,145,248,.72) !important;
  box-shadow:0 0 0 3px rgba(49,145,248,.10), inset 0 1px 1px rgba(255,255,255,.96) !important;
}

/* ---------------- DISCOUNTED SWITCH ---------------- */
html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox{
  grid-column:5 !important;
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  width:auto !important;
  min-width:168px !important;
  min-height:28px !important;
  margin:0 4px 0 0 !important;
  padding-left:80px !important;
  padding-right:0 !important;
}
html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-input{
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:58px !important;
  height:28px !important;
  margin:0 !important;
  opacity:0 !important;
  z-index:4 !important;
  cursor:pointer !important;
}
html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  min-height:28px !important;
  margin:0 !important;
  padding:0 !important;
  color:#0d111c !important;
  font-family:inherit !important;
  font-size:16px !important;
  font-weight:600 !important;
  line-height:28px !important;
  white-space:nowrap !important;
  cursor:pointer !important;
}
html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:-80px !important;
  top:0 !important;
  width:58px !important;
  height:28px !important;
  border:1px solid rgba(151,172,215,.50) !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#eef3fb,#c8d3e8) !important;
  box-shadow:inset 0 1px 3px rgba(73,98,147,.08) !important;
  transition:background .2s ease,border-color .2s ease !important;
}
html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:-70px !important;
  top:3px !important;
  width:28px !important;
  height:28px !important;
  border-radius:50% !important;
  background:#f8fbff !important;
  background-image:none !important;
  box-shadow:0 2px 6px rgba(44,68,112,.14), inset 0 1px 0 rgba(255,255,255,1) !important;
  transform:none !important;
  transition:transform .2s ease !important;
}
html body .cymart-imei-page .card.card-search .custom-control-input:checked ~ .custom-control-label::before{
  background:linear-gradient(90deg,#2f99ff,#2678ed) !important;
  border-color:#2b85f2 !important;
}
html body .cymart-imei-page .card.card-search .custom-control-input:checked ~ .custom-control-label::after{
  transform:translateX(20px) !important;
  background:#fff !important;
}
html body .cymart-imei-page .card.card-search .custom-control-input:focus ~ .custom-control-label::before{
  box-shadow:0 0 0 3px rgba(49,145,248,.12), inset 0 1px 3px rgba(73,98,147,.08) !important;
}

/* ---------------- GROUP TITLE GLASS BANNER ---------------- */
html body .cymart-imei-page .service-list .row.group > .col-12{
  width:100% !important;
  flex:0 0 100% !important;
  max-width:100% !important;
  padding-left:15px !important;
  padding-right:15px !important;
}
html body .cymart-imei-page .service-list .row.group h3.title{
  display:flex !important;
  align-items:center !important;
  width:100% !important;
  min-height:70px !important;
  margin:0 0 18px 0 !important;
  padding:12px 18px !important;
  overflow:visible !important;
  height:auto !important;
  border:1px solid rgba(255,255,255,.88) !important;
  border-radius:16px !important;
  background:linear-gradient(100deg,rgba(255,255,255,.78),rgba(247,251,255,.67)) !important;
  box-shadow:0 16px 36px rgba(70,111,184,.08), inset 0 1px 0 rgba(255,255,255,.96) !important;
  backdrop-filter:blur(16px) saturate(116%) !important;
  -webkit-backdrop-filter:blur(16px) saturate(116%) !important;
  color:var(--cymart-v23-title) !important;
  text-shadow:none !important;
}
html body .cymart-imei-page .service-list .row.group h3.title > span{
  display:block !important;
  width:100% !important;
  overflow:visible !important;
  word-break:break-word !important;
  color:var(--cymart-v23-title) !important;
  font-family:inherit !important;
  font-size:clamp(14px,1.28vw,21px) !important;
  font-weight:800 !important;
  line-height:1.15 !important;
  letter-spacing:-.2px !important;
  white-space:normal !important;
  text-overflow:clip !important;
  text-shadow:none !important;
}
html body .cymart-imei-page .service-list .row.group h3.title .cymart-unicode-emoji{
  display:inline !important;
  font-size:1em !important;
  line-height:1 !important;
  vertical-align:-.08em !important;
}

/* Keep cards/functionality below untouched. Only normalize accidental dark paints
   inside these two new reference surfaces. */
html body.cymart-theme-dark .cymart-imei-page .card.card-search,
html body.cymart-theme-dark .cymart-imei-page .service-list .row.group h3.title{
  background:linear-gradient(100deg,rgba(255,255,255,.86),rgba(244,249,255,.78)) !important;
  border-color:rgba(255,255,255,.88) !important;
}
html body.cymart-theme-dark .cymart-imei-page .card.card-search .cymart-group-filter-face,
html body.cymart-theme-dark .cymart-imei-page .card.card-search #searchservicebox2.form-control{
  background:rgba(255,255,255,.82) !important;
  color:#43577f !important;
  border-color:var(--cymart-v23-border) !important;
}
html body.cymart-theme-dark .cymart-imei-page .service-list .row.group h3.title > span{
  color:var(--cymart-v23-title) !important;
}

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:1199.98px){
  html body .cymart-imei-page .card.card-search > .form-inline{
    grid-template-columns:44px minmax(235px,1fr) minmax(270px,1.25fr) 8px auto !important;
    column-gap:14px !important;
  }
  html body .cymart-imei-page .card.card-search .cymart-group-filter-wrap,
  html body .cymart-imei-page .card.card-search > .form-inline > .form-group.mb-0{
    max-width:none !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox{
    min-width:185px !important;
    margin-right:4px !important;
    padding-left:84px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::before{
    left:-84px !important;
    width:66px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::after{
    left:-80px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control-input:checked ~ .custom-control-label::after{
    transform:translateX(20px) !important;
  }
}

@media (max-width:991.98px){
  html body .cymart-imei-page > .container{
    width:calc(100% - 24px) !important;
    margin-left:12px !important;
    margin-right:12px !important;
  }
  html body .cymart-imei-page .card.card-search{
    margin-top:12px !important;
    margin-bottom:20px !important;
    padding:14px !important;
    border-radius:21px !important;
  }
  html body .cymart-imei-page .card.card-search > .form-inline{
    grid-template-columns:38px minmax(0,1fr) !important;
    grid-template-rows:50px 50px 42px !important;
    column-gap:12px !important;
    row-gap:12px !important;
  }
  html body .cymart-imei-page .card.card-search > .form-inline > .form-group.pr-3{
    grid-column:1 !important;
    grid-row:1 !important;
    display:flex !important;
    width:38px !important;
    min-width:38px !important;
    height:50px !important;
  }
  html body .cymart-imei-page .card.card-search > .form-inline > .form-group.pr-3 > i{
    font-size:28px !important;
  }
  html body .cymart-imei-page .card.card-search .cymart-group-filter-wrap{
    grid-column:2 !important;
    grid-row:1 !important;
    width:100% !important;
    height:50px !important;
    min-height:50px !important;
  }
  html body .cymart-imei-page .card.card-search select.cymart-group-filter.cymart-group-filter-native-overlay,
  html body .cymart-imei-page .card.card-search .cymart-group-filter-face{
    height:50px !important;
    min-height:50px !important;
    font-size:17px !important;
  }
  html body .cymart-imei-page .card.card-search > .form-inline > .form-group.mb-0{
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    width:100% !important;
    height:50px !important;
  }
  html body .cymart-imei-page .card.card-search #searchservicebox2.form-control{
    height:50px !important;
    min-height:50px !important;
    font-size:17px !important;
    line-height:50px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox{
    grid-column:1 / -1 !important;
    grid-row:3 !important;
    justify-self:end !important;
    min-width:160px !important;
    padding-left:70px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label{
    font-size:17px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::before{
    left:-70px !important;
    width:56px !important;
    height:34px !important;
    top:3px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::after{
    left:-66px !important;
    width:28px !important;
    height:28px !important;
    top:7px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control-input:checked ~ .custom-control-label::after{
    transform:translateX(20px) !important;
  }
  html body .cymart-imei-page .service-list .row.group h3.title{
    min-height:64px !important;
    margin-bottom:20px !important;
    padding:12px 16px !important;
    border-radius:16px !important;
  }
  html body .cymart-imei-page .service-list .row.group h3.title > span{
    font-size:clamp(14px,3.7vw,18px) !important;
    white-space:normal !important;
    text-overflow:clip !important;
  }
}

@media (max-width:575.98px){
  html body .cymart-imei-page > .container{
    width:calc(100% - 20px) !important;
    margin-left:10px !important;
    margin-right:10px !important;
  }
  html body .cymart-imei-page .card.card-search{
    padding:14px !important;
    border-radius:16px !important;
  }
  html body .cymart-imei-page .service-list .row.group h3.title{
    min-height:58px !important;
    padding:10px 12px !important;
    border-radius:16px !important;
  }
}


/* ======================================================================
   CYMART IMEI REFERENCE VISUAL V26
   Fixes requested after V25:
   - load flash mitigation via head load + pending class
   - smaller All Group / Search Service controls
   - visible white dropdown with readable options
   - cleaner/smaller discounted switch
   - smaller full-width group title without ellipsis
   ====================================================================== */

html body .cymart-imei-page > .container{
  margin-right:20px !important;
}
html body .cymart-imei-page .card.card-search{
  min-height:72px !important;
  margin:14px 0 22px 0 !important;
  padding:12px 18px !important;
  border-radius:18px !important;
}
html body .cymart-imei-page .card.card-search > .form-inline{
  grid-template-columns:34px minmax(165px,225px) minmax(190px,300px) minmax(10px,1fr) auto !important;
  column-gap:14px !important;
  min-height:42px !important;
}
html body .cymart-imei-page .card.card-search > .form-inline > .form-group.pr-3{
  width:34px !important;
  height:42px !important;
  min-width:34px !important;
}
html body .cymart-imei-page .card.card-search > .form-inline > .form-group.pr-3 > i{
  font-size:28px !important;
}

/* Use the native select directly so the opened list is readable. */
html body .cymart-imei-page .card.card-search .cymart-group-filter-wrap{
  max-width:225px !important;
  height:38px !important;
  min-height:38px !important;
}
html body .cymart-imei-page .card.card-search .cymart-group-filter-wrap::after{
  content:"" !important;
  position:absolute !important;
  right:14px !important;
  top:50% !important;
  width:8px !important;
  height:8px !important;
  margin-top:-5px !important;
  border-right:2px solid #60739e !important;
  border-bottom:2px solid #60739e !important;
  transform:rotate(45deg) !important;
  pointer-events:none !important;
  z-index:5 !important;
}
html body .cymart-imei-page .card.card-search .cymart-group-filter-face,
html body .cymart-imei-page .card.card-search .cymart-group-filter-face::after{
  display:none !important;
  content:none !important;
}
html body .cymart-imei-page .card.card-search select.cymart-group-filter,
html body .cymart-imei-page .card.card-search select.cymart-group-filter.cymart-group-filter-native-overlay{
  position:relative !important;
  inset:auto !important;
  z-index:4 !important;
  display:block !important;
  width:100% !important;
  max-width:none !important;
  height:38px !important;
  min-height:38px !important;
  margin:0 !important;
  padding:0 36px 0 14px !important;
  border:1px solid var(--cymart-v23-border) !important;
  border-radius:10px !important;
  outline:0 !important;
  background:rgba(255,255,255,.74) !important;
  color:var(--cymart-v23-text) !important;
  -webkit-text-fill-color:var(--cymart-v23-text) !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.94) !important;
  opacity:1 !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;
  font-size:14px !important;
  font-weight:500 !important;
  line-height:38px !important;
  cursor:pointer !important;
}
html body .cymart-imei-page .card.card-search select.cymart-group-filter option,
html body .cymart-imei-page .card.card-search select.cymart-group-filter.cymart-group-filter-native-overlay option{
  color:#243a63 !important;
  -webkit-text-fill-color:#243a63 !important;
  background:#ffffff !important;
  font-size:14px !important;
}
html body .cymart-imei-page .card.card-search select.cymart-group-filter:focus,
html body .cymart-imei-page .card.card-search select.cymart-group-filter.cymart-group-filter-native-overlay:focus{
  border-color:rgba(49,145,248,.72) !important;
  box-shadow:0 0 0 3px rgba(49,145,248,.10), inset 0 1px 1px rgba(255,255,255,.96) !important;
}

html body .cymart-imei-page .card.card-search > .form-inline > .form-group.mb-0{
  max-width:300px !important;
  height:38px !important;
}
html body .cymart-imei-page .card.card-search #searchservicebox2.form-control{
  height:38px !important;
  min-height:38px !important;
  padding:0 14px !important;
  border-radius:10px !important;
  font-size:14px !important;
  line-height:38px !important;
}

html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox{
  min-width:138px !important;
  min-height:30px !important;
  margin:0 !important;
  padding-left:66px !important;
  justify-content:flex-start !important;
  overflow:visible !important;
}
html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-input{
  left:0 !important;
  top:0 !important;
  width:50px !important;
  height:30px !important;
}
html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label{
  min-height:30px !important;
  font-size:14px !important;
  line-height:30px !important;
}
html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::before{
  left:-66px !important;
  top:1px !important;
  width:50px !important;
  height:28px !important;
}
html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::after{
  left:-63px !important;
  top:3px !important;
  width:24px !important;
  height:24px !important;
}
html body .cymart-imei-page .card.card-search .custom-control-input:checked ~ .custom-control-label::after{
  transform:translateX(20px) !important;
}

html body .cymart-imei-page .service-list .row.group h3.title{
  display:block !important;
  min-height:58px !important;
  margin:0 0 16px 0 !important;
  padding:10px 16px !important;
  border-radius:15px !important;
  overflow:visible !important;
  height:auto !important;
}
html body .cymart-imei-page .service-list .row.group h3.title > span{
  display:block !important;
  width:100% !important;
  overflow:visible !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  font-size:clamp(14px,1.18vw,20px) !important;
  font-weight:800 !important;
  line-height:1.22 !important;
  white-space:normal !important;
  text-overflow:clip !important;
}

@media (max-width:991.98px){
  html body .cymart-imei-page .card.card-search{
    min-height:auto !important;
    padding:12px 14px !important;
    margin:12px 0 18px 0 !important;
  }
  html body .cymart-imei-page .card.card-search > .form-inline{
    grid-template-columns:34px minmax(140px,1fr) minmax(0,1fr) !important;
    grid-template-rows:38px 38px 34px !important;
    column-gap:12px !important;
    row-gap:10px !important;
  }
  html body .cymart-imei-page .card.card-search .cymart-group-filter-wrap,
  html body .cymart-imei-page .card.card-search > .form-inline > .form-group.mb-0,
  html body .cymart-imei-page .card.card-search #searchservicebox2.form-control{
    height:38px !important;
    min-height:38px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox{
    min-width:124px !important;
    padding-left:60px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::before{
    left:-60px !important;
  }
  html body .cymart-imei-page .card.card-search .custom-control.custom-checkbox .custom-control-label::after{
    left:-57px !important;
  }
  html body .cymart-imei-page .service-list .row.group h3.title{
    min-height:54px !important;
    padding:10px 14px !important;
  }
  html body .cymart-imei-page .service-list .row.group h3.title > span{
    font-size:clamp(13px,3.8vw,17px) !important;
    line-height:1.2 !important;
  }
}