/* General */

body{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity));
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.dark body{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

p{
  padding-bottom: 1.25rem
}

a, .btn-link{
  --tw-text-opacity: 1;
  color: rgb(11 59 97 / var(--tw-text-opacity))
}

a:hover, .btn-link:hover{
  --tw-text-opacity: 1;
  color: rgb(11 59 97 / var(--tw-text-opacity))
}

.dark a,.dark  .btn-link{
  --tw-text-opacity: 1;
  color: rgb(129 140 248 / var(--tw-text-opacity))
}

.dark a:hover,.dark  .btn-link:hover{
  --tw-text-opacity: 1;
  color: rgb(165 180 252 / var(--tw-text-opacity))
}

hr{
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(36 38 47 / var(--tw-text-opacity))
}

.dark hr{
  --tw-border-opacity: 1;
  border-color: rgb(36 38 47 / var(--tw-border-opacity))
}

h1, h2, h3, h4, h5, h6{
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  --tw-text-opacity: 1;
  color: rgb(78 82 103 / var(--tw-text-opacity))
}

.dark h1,.dark  h2,.dark  h3,.dark  h4,.dark  h5,.dark  h6{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

h4{
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem
}

#bodyTable{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.dark #bodyTable{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.hexa-logo{
  --tw-text-opacity: 1;
  color: rgb(9 10 15 / var(--tw-text-opacity))
}

.dark .hexa-logo{
  --tw-text-opacity: 1;
  color: rgb(250 250 251 / var(--tw-text-opacity))
}

.info-box{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  /*background-color: rgb(247 247 249 / var(--tw-bg-opacity))*/
  font-size:14px;
}

.dark .info-box{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity));
  font-size:14px;
}

.info-box-support{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.dark .info-box-support{
  --tw-bg-opacity: 1;
  background-color: rgb(11 59 97 / var(--tw-bg-opacity))
}

ul li.active>a{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.dark ul li.active>a{
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity))
}

.panel-addon .icheckbox_square-blue, .panel-addons .icheckbox_square-blue, .tos .icheckbox_square-blue{
  position: absolute;
  top: 1.25rem;
  left: 1.25rem;
  display: flex
}

.department-panels .department-content{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity))
}

.dark .department-panels .department-content{
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity))
}

.norecords{
  padding: 1.25rem
}

.form-ticket{
  margin-left: 1.25rem
}

.ticket-close{
  text-decoration-line: underline
}

.quote-page, .invoice-page{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .quote-page,.dark  .invoice-page{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

/* Announcements and KB */

.standard-post-date{
  --tw-bg-opacity: 1;
  background-color: rgb(113 119 147 / var(--tw-bg-opacity))
}

.kb-search{
  margin-left: 1.25rem
}

.download-search{
  margin-left: 1.25rem
}

.kb-title, .kb-tags,  .kb-breadcrumbs{
  margin-left: 1.25rem
}

/* Hexa Structure */

.box-holder{
  background-color: transparent
}

.hexa-container{
  display: none
}

.main-grid{
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 1.25rem
}

@media (min-width: 640px){
  .main-cart-grid{
    margin-left: 1.25rem
  }

  .whmcs-clientareahome .info-panels{
    margin-left: 1.25rem
  }

  .whmcs-homepage .info-panels{
    margin-left: 1.25rem
  }

  .site-horizontal .info-panels{
    margin-left: 0px
  }

  .whmcs-serverstatus .info-panels{
    margin-left: 1.25rem
  }

  .whmcs-affiliates .info-panels{
    margin-left: 1.25rem
  }

  .whmcs-knowledgebasecat .category-panels{
    margin-left: 1.25rem
  }

  .whmcs-knowledgebase .category-panels{
    margin-left: 1.25rem
  }

  .whmcs-downloads .category-panels{
    margin-left: 1.25rem
  }

  .whmcs-downloadscat .category-panels{
    margin-left: 1.25rem
  }

  .tasks-list, .tasks-files{
    margin-left: 1.25rem
  }

  .activate-affiliate{
    margin-left: 1.25rem
  }
}

.mini-sidebar .feather-chevron{
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.hexa-content{
  grid-column: span 20 / span 20;
  margin:5px;
  /* background: #fafafb; */
  padding: 15px;
  border-radius: 8px;
}

.mini-sidebar .hexa-content{
  grid-column: span 23 / span 23
}

.site-horizontal .hexa-content{
  grid-column: span 24 / span 24
}

.site-horizontal.mini-sidebar .hexa-content{
  grid-column: span 24 / span 24
}

.mini-sidebar .left-sidebar{
  display: flex
}

@media (min-width: 768px){
  .mini-sidebar .left-sidebar{
    justify-content: center
  }
}

.sub-header{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dark .sub-header{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

@media (min-width: 640px){
  .invoice-grid{
    margin-left: 1.25rem
  }
}

/* Page Header */

.page-header {
  @apply pl-4 m-0 mt-2 normal-case border-b 
}

.page-header-2{
  margin: 0px;
  margin-top: 0.25rem;
  padding-bottom: 0.5rem;
  padding-left: 1rem;
  text-transform: none
}

.hexa-page-header{
  margin-left: 1.25rem;
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity))
}

.dark .hexa-page-header{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.site-horizontal .hexa-page-header{
  margin-left: 0px
}

blockquote.page-information{
  background-color: transparent;
  font-size: 0.875rem;
  line-height: 1.25rem
}

blockquote.page-information p{
  margin: 0px;
  padding: 0px
}

.header-text{
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

/* Buttons */

.btn{
  border-radius: 0.125rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity));
  text-decoration-line: none
}

.btn:active{
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.dark .btn{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-sm{
  font-size: 0.75rem;
  line-height: 1rem
}

.btn-xs{
  font-size: 0.75rem;
  line-height: 1rem
}

.btn-lg{
  font-size: 1rem;
  line-height: 1.5rem
}

.btn-base{
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 1.75rem;
  padding-right: 1.75rem
}

.btn-default, .suggested-domains .btn:not(.domain-contact-support){
  border-width: 1px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(78 82 103 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-default:hover, .suggested-domains .btn:not(.domain-contact-support):hover{
  --tw-bg-opacity: 1;
  background-color: rgb(61 65 81 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-default:focus, .suggested-domains .btn:not(.domain-contact-support):focus{
  --tw-bg-opacity: 1;
  background-color: rgb(180 183 198 / var(--tw-bg-opacity));
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(95 100 125 / var(--tw-ring-opacity));
  --tw-ring-offset-width: 2px
}

.btn-default:active, .suggested-domains .btn:not(.domain-contact-support):active{
  --tw-bg-opacity: 1;
  background-color: rgb(180 183 198 / var(--tw-bg-opacity))
}

.btn-default:focus:active, .suggested-domains .btn:not(.domain-contact-support):focus:active{
  --tw-bg-opacity: 1;
  background-color: rgb(180 183 198 / var(--tw-bg-opacity))
}


.btn-primary{
  border-width: 1px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(11 59 97 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-primary:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(41 77 106 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-primary:focus{
  --tw-bg-opacity: 1;
  background-color: rgb(41 77 106 / var(--tw-bg-opacity));
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(11 59 97 / var(--tw-ring-opacity));
  --tw-ring-offset-width: 2px
}

.btn-primary:active{
  --tw-bg-opacity: 1;
  background-color: rgb(41 77 106 / var(--tw-bg-opacity))
}

.btn-primary:focus:active{
  --tw-bg-opacity: 1;
  background-color: rgb(41 77 106 / var(--tw-bg-opacity))
}

.btn-primary[disabled]:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(11 59 97 / var(--tw-bg-opacity))
}

.btn-success{
  border-width: 1px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(22 163 74 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-success:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(21 128 61 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-success:focus{
  --tw-bg-opacity: 1;
  background-color: rgb(134 239 172 / var(--tw-bg-opacity));
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(199 225 209 / var(--tw-ring-opacity));
  --tw-ring-offset-width: 2px
}

.btn-success:active{
  --tw-bg-opacity: 1;
  background-color: rgb(134 239 172 / var(--tw-bg-opacity))
}

.btn-success:focus:active{
  --tw-bg-opacity: 1;
  background-color: rgb(134 239 172 / var(--tw-bg-opacity))
}

.btn-danger{
  border-width: 1px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-danger:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(185 28 28 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-danger:focus{
  --tw-bg-opacity: 1;
  background-color: rgb(252 165 165 / var(--tw-bg-opacity));
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity));
  --tw-ring-offset-width: 2px
}

.btn-danger:active{
  --tw-bg-opacity: 1;
  background-color: rgb(252 165 165 / var(--tw-bg-opacity))
}

.btn-danger:focus:active{
  --tw-bg-opacity: 1;
  background-color: rgb(252 165 165 / var(--tw-bg-opacity))
}

.btn-warning{
  border-width: 1px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(202 138 4 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-warning:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(161 98 7 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-warning:focus{
  --tw-bg-opacity: 1;
  background-color: rgb(253 224 71 / var(--tw-bg-opacity));
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(234 179 8 / var(--tw-ring-opacity));
  --tw-ring-offset-width: 2px
}

.btn-warning:active{
  --tw-bg-opacity: 1;
  background-color: rgb(253 224 71 / var(--tw-bg-opacity))
}

.btn-warning:focus:active{
  --tw-bg-opacity: 1;
  background-color: rgb(253 224 71 / var(--tw-bg-opacity))
}

.btn-info{
  border-width: 1px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(96 165 250 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-info:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(59 130 246 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.btn-info:focus{
  --tw-bg-opacity: 1;
  background-color: rgb(147 197 253 / var(--tw-bg-opacity));
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(147 197 253 / var(--tw-ring-opacity));
  --tw-ring-offset-width: 2px
}

.btn-info:active{
  --tw-bg-opacity: 1;
  background-color: rgb(147 197 253 / var(--tw-bg-opacity))
}

.btn-info:focus:active{
  --tw-bg-opacity: 1;
  background-color: rgb(147 197 253 / var(--tw-bg-opacity))
}

.btn-outlined{
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(135 140 164 / var(--tw-border-opacity));
  background-color: transparent;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  --tw-text-opacity: 1;
  color: rgb(61 65 81 / var(--tw-text-opacity))
}

.btn-outlined:hover{
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.dark .btn-outlined{
  --tw-border-opacity: 1;
  border-color: rgb(61 65 81 / var(--tw-border-opacity))
}

.btn-featured{
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(250 250 251 / var(--tw-border-opacity));
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(250 250 251 / var(--tw-text-opacity))
}

.btn-featured:hover{
  --tw-text-opacity: 1;
  color: rgb(235 236 240 / var(--tw-text-opacity))
}

.dark .btn-featured{
  --tw-border-opacity: 1;
  border-color: rgb(9 10 15 / var(--tw-border-opacity))
}

.btn-delete{
  border-width: 0px;
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(185 28 28 / var(--tw-text-opacity))
}

.btn-edit{
  border-width: 0px;
  background-color: transparent
}

.md-editor .btn-default, .md-editor .btn-primary{
  border-width: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  font-size: 0.75rem;
  line-height: 1rem;
  line-height: 1;
  --tw-text-opacity: 1;
  color: rgb(61 65 81 / var(--tw-text-opacity))
}

.dark .md-editor .btn-default,.dark  .md-editor .btn-primary{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.md-editor .btn-primary.active, .md-editor .btn-primary.focus{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.dark .md-editor .btn-primary.active,.dark  .md-editor .btn-primary.focus{
  --tw-bg-opacity: 1;
  background-color: rgb(61 65 81 / var(--tw-bg-opacity))
}

.sidebar-holder .nav li.nav-toggle .btn-nav-toggle{
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.sidebar-holder .nav li.nav-toggle .btn-nav-toggle:hover{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

.sidebar-holder .nav li.nav-toggle .btn-nav-toggle:focus{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

/* Bootstrap Misc Components */

.progress{
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity))
}

.dark .progress{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.text-success{
  --tw-text-opacity: 1;
  color: rgb(199 225 209 / var(--tw-text-opacity))
}

.d-block{
  display: block
}

.list-group{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dark .list-group{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

dd{
  margin-bottom: 0.75rem
}

.nav .nav-divider{
  --tw-bg-opacity: 1;
  background-color: rgb(180 183 198 / var(--tw-bg-opacity))
}

.dark .nav .nav-divider{
  --tw-bg-opacity: 1;
  background-color: rgb(61 65 81 / var(--tw-bg-opacity))
}

.suggested-domains .list-group-item, .list-group-item{
  --tw-border-opacity: 1;
  border-color: rgb(250 250 251 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity))
}

.dark .suggested-domains .list-group-item,.dark  .list-group-item{
  --tw-border-opacity: 1;
  border-color: rgb(27 29 36 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

a.list-group-item, button.list-group-item{
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

/* Modal */

.modal-title{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(213 215 223 / var(--tw-text-opacity))
}

.modal-content{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(78 82 103 / var(--tw-text-opacity))
}

.dark .modal-content{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.modal-body, .modal-body pre{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.dark .modal-body,.dark  .modal-body pre{
  --tw-border-opacity: 1;
  border-color: rgb(61 65 81 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.modal-header, .modal-footer{
  --tw-border-opacity: 1;
  border-color: rgb(235 236 240 / var(--tw-border-opacity))
}

.dark .modal-header,.dark  .modal-footer{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.close{
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

/* Dropdown */

.dropdown-menu{
  --tw-bg-opacity: 1;
  background-color: rgb(247 247 249 / var(--tw-bg-opacity));
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.dark .dropdown-menu{
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity))
}

.dropdown-menu>li>a{
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.dropdown-menu .divider{
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity))
}

.dark .dropdown-menu .divider{
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity))
}

.dropdown-menu>.disabled>a, .dropdown-menu>.disabled>a:focus, .dropdown-menu>.disabled>a:hover{
  --tw-text-opacity: 1;
  color: rgb(61 65 81 / var(--tw-text-opacity))
}

.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(11 59 97 / var(--tw-text-opacity))
}

/* Panels and Wells */

.panel{
  background-color: transparent
}

.panel-default{
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity))
}

.dark .panel-default{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.panel-default>.panel-heading{
  border-width: 0px;
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.panel-primary>.panel-heading{
  border-width: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(11 59 97 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(224 231 255 / var(--tw-text-opacity))
}

.panel-primary button.close{
  --tw-text-opacity: 1;
  color: rgb(238 242 255 / var(--tw-text-opacity))
}

.panel-datatable{
  padding-top: 1.25rem;
  padding-bottom: 0.75rem
}

.panel-datatable>.panel-heading{
  border-width: 0px;
  border-bottom-width: 1px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-color: rgb(235 236 240 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(78 82 103 / var(--tw-text-opacity))
}

.dark .panel-datatable>.panel-heading{
  --tw-border-opacity: 1;
  border-color: rgb(27 29 36 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.panel-datatable>.panel-heading a, .panel-datatable>.panel-heading a:hover{
  --tw-text-opacity: 1;
  color: rgb(61 65 81 / var(--tw-text-opacity))
}

.dark .panel-datatable>.panel-heading a,.dark  .panel-datatable>.panel-heading a:hover{
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.panel, .well{
  border-radius: 0px
}

.panel-heading{
  border-radius: 0px
}

.panel-footer{
  --tw-border-opacity: 1;
  border-color: rgb(235 236 240 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .panel-footer{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.panel-tickets>.adminheader, .panel-tickets>.adminheader h4{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.dark .panel-tickets>.adminheader,.dark  .panel-tickets>.adminheader h4{
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity))
}

.panel-tickets>.adminmsg{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dark .panel-tickets>.adminmsg{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.panel-tickets>.adminheader .badge{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(27 29 36 / var(--tw-text-opacity))
}

.panel-tickets>.clientheader, .panel-tickets>.clientheader h4{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.dark .panel-tickets>.clientheader,.dark  .panel-tickets>.clientheader h4{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.panel-tickets>.clientmsg{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.ticket-reply{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dark .ticket-reply{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.ticket-reply-body{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .ticket-reply-body{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.well{
  border-width: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.dark .well{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.panel-info>.panel-heading{
  border-width: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

/* Labels and Badges */

.label{
  --tw-text-opacity: 1;
  color: rgb(235 236 240 / var(--tw-text-opacity))
}

.dark .label{
  --tw-text-opacity: 1;
  color: rgb(235 236 240 / var(--tw-text-opacity))
}

.label-pending, .label.pending, .label-warning, .label.pendingtransfer, .label-customer-reply, .label.collections .label-collections{
  border-bottom-width: 0px;
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity))
}

.label-active, .label.active, .label-paid, .label.paid, .label-in, .label-open, .label-inprogress{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(21 128 61 / var(--tw-text-opacity))
}

.label-suspended, .label.suspended{
  --tw-bg-opacity: 1;
  background-color: rgb(95 100 125 / var(--tw-bg-opacity))
}

.label-terminated, .label.terminated, .label-unpaid, .label.unpaid{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity))
}

.label-cancelled, .label-expired, .label-closed, .label.cancelled, .label.expired{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.label-fraud, .label.fraud{
  --tw-bg-opacity: 1;
  background-color: rgb(61 65 81 / var(--tw-bg-opacity))
}

.label-completed{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(250 204 21 / var(--tw-text-opacity))
}

.label-refunded, .label.refunded, .label-answered{
  --tw-bg-opacity: 1;
  background-color: rgb(147 197 253 / var(--tw-bg-opacity))
}

.label-success{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(21 128 61 / var(--tw-text-opacity))
}

.dark .label-success{
  --tw-text-opacity: 1;
  color: rgb(199 225 209 / var(--tw-text-opacity))
}

.label-info, .label-primary{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(11 59 97 / var(--tw-text-opacity))
}

.status-pending, .status-pending-transfer{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(250 204 21 / var(--tw-text-opacity))
}

.status-active, .status-open, .status.completed, .status-inprogress, .status-accepted, .status-paid{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(21 128 61 / var(--tw-text-opacity))
}

.dark .status-active,.dark  .status-open,.dark  .status.completed,.dark  .status-inprogress,.dark  .status-accepted,.dark  .status-paid{
  --tw-text-opacity: 1;
  color: rgb(199 225 209 / var(--tw-text-opacity))
}

.status-customer-reply, .status-suspended, .status-grace{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(250 204 21 / var(--tw-text-opacity))
}

.status-answered, .status-fraud, .status-cancelled, .status-expired, .status-terminated, .status-transferred.away{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

.status-pending-registration, .status-redemption, .status-grace{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(250 204 21 / var(--tw-text-opacity))
}

.status-closed{
  --tw-bg-opacity: 1;
  background-color: rgb(95 100 125 / var(--tw-bg-opacity))
}

.status-collections, .status-unpaid{
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity))
}

.status-refunded, .status-delivered, .status-onhold{
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(11 59 97 / var(--tw-text-opacity))
}

.status-dead, .status-lost{
  --tw-bg-opacity: 1;
  background-color: rgb(61 65 81 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.product-status-pending{
  --tw-bg-opacity: 1;
  background-color: rgb(250 204 21 / var(--tw-bg-opacity))
}

.product-status-active{
  --tw-bg-opacity: 1;
  background-color: rgb(199 225 209 / var(--tw-bg-opacity))
}

.product-status-suspended{
  --tw-bg-opacity: 1;
  background-color: rgb(95 100 125 / var(--tw-bg-opacity))
}

.product-status-cancelled, .product-status-terminated, .product-status-fraud, .product-status-text{
  --tw-bg-opacity: 1;
  background-color: rgb(61 65 81 / var(--tw-bg-opacity))
}

.badge-success{
  --tw-bg-opacity: 1;
  background-color: rgb(22 163 74 / var(--tw-bg-opacity))
}

.dark .badge-success{
  --tw-bg-opacity: 1;
  background-color: rgb(74 222 128 / var(--tw-bg-opacity))
}

.badge-important{
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity))
}

.badge-warning{
  --tw-bg-opacity: 1;
  background-color: rgb(250 204 21 / var(--tw-bg-opacity))
}

/* Top Header */

.logo{
  --tw-text-opacity: 1;
  color: rgb(11 59 97 / var(--tw-text-opacity))
}

.minimal .logo{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.navbar .btn-nav-toggle-responsive{
  --tw-text-opacity: 1;
  color: rgb(27 29 36 / var(--tw-text-opacity))
}

.dark .navbar .btn-nav-toggle-responsive{
  --tw-text-opacity: 1;
  color: rgb(235 236 240 / var(--tw-text-opacity))
}

.hx-settings{
  position: relative
}

.cart-items{
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.navbar-nav>li>a:hover{
  text-decoration-line: none
}

.hx-top-header{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .hx-top-header{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.hx-top-header .navbar-brand{
  --tw-text-opacity: 1;
  color: rgb(11 59 97 / var(--tw-text-opacity))
}

.hx-top-header .hx-top-nav{
  margin-left: auto;
  display: flex
}

@media (min-width: 768px){
  .hx-top-header .hx-top-nav{
    flex-grow: 1
  }
}

.hx-top-header .content .desc{
  --tw-text-opacity: 1;
  color: rgb(113 119 147 / var(--tw-text-opacity))
}

.hx-top-header .hx-icons-nav>.nav-item.dropdown>.nav-link .indicator{
  --tw-bg-opacity: 1;
  background-color: rgb(199 225 209 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(21 128 61 / var(--tw-text-opacity))
}

.hx-top-header .hx-icons-nav>.nav-item.dropdown>.nav-link .icon, .hx-top-header .hx-icons-nav>.nav-item>.nav-link .icon{
  --tw-text-opacity: 1;
  color: rgb(113 119 147 / var(--tw-text-opacity))
}

.hx-icons-nav, .hx-user-nav{
  background-color: transparent
}

.hx-top-header .navbar-nav>.nav-item.dropdown .dropdown-menu{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity));
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.dark .hx-top-header .navbar-nav>.nav-item.dropdown .dropdown-menu{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li, .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li{
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity))
}

.dark .hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li,.dark  .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li>a .icon, .hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li>a .img{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li>a .icon,.dark  .hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li>a .img{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li>a .icon, .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li>a .img{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li>a .icon,.dark  .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li>a .img{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.hx-top-header .hx-icons-nav .hx-messages>.dropdown-menu .footer a, .hx-top-header .hx-icons-nav .hx-notifications>.dropdown-menu .footer a, .hx-top-header .hx-icons-nav .hx-settings>.dropdown-menu .footer a{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .hx-top-header .hx-icons-nav .hx-messages>.dropdown-menu .footer a,.dark  .hx-top-header .hx-icons-nav .hx-notifications>.dropdown-menu .footer a,.dark  .hx-top-header .hx-icons-nav .hx-settings>.dropdown-menu .footer a{
  --tw-bg-opacity: 1;
  background-color: rgb(36 38 47 / var(--tw-bg-opacity))
}

.hx-top-header .hx-icons-nav .hx-messages>.dropdown-menu .title, .hx-top-header .hx-icons-nav .hx-notifications>.dropdown-menu .title, .hx-top-header .hx-icons-nav .hx-settings>.dropdown-menu .title{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.dark .hx-top-header .hx-icons-nav .hx-messages>.dropdown-menu .title,.dark  .hx-top-header .hx-icons-nav .hx-notifications>.dropdown-menu .title,.dark  .hx-top-header .hx-icons-nav .hx-settings>.dropdown-menu .title{
  --tw-bg-opacity: 1;
  background-color: rgb(36 38 47 / var(--tw-bg-opacity))
}

.hx-top-header .hx-icons-nav>.nav-item.dropdown.open>a:after{
  --tw-border-opacity: 1;
  border-color: rgb(250 250 251 / var(--tw-border-opacity))
}

.dark .hx-top-header .hx-icons-nav>.nav-item.dropdown.open>a:after{
  --tw-border-opacity: 1;
  border-color: rgb(36 38 47 / var(--tw-border-opacity))
}

.hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li:hover, .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dark .hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li:hover,.dark  .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(36 38 47 / var(--tw-bg-opacity))
}

.hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li>a .img>span{
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li:hover>a,.hx-top-header .hx-icons-nav .hx-messages .hx-scroller>.content>ul>li:hover>a .icon>span,.hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li:hover>a,.hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li:hover>a .icon>span{
  --tw-text-opacity: 1;
  color: rgb(213 215 223 / var(--tw-text-opacity))
}

.hx-top-header .navbar-nav>.nav-item.dropdown .dropdown-menu>.dropdown-item:hover{
  text-decoration-line: none
}

.hx-user-nav>.nav-item.dropdown>.nav-link{
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.hx-top-header .hx-icons-nav .hx-notifications .hx-scroller>.content>ul>li>a .icon>i.fas{
  font-size: 0.875rem;
  line-height: 2rem
}

.hx-top-header .fa-exclamation-triangle, .hx-top-header .fa-exclamation-circle{
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity))
}

.fa-exclamation-triangle:hover, .fa-exclamation-circle:hover{
  --tw-text-opacity: 1;
  color: rgb(185 28 28 / var(--tw-text-opacity))
}

.content .date{
  font-style: normal;
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.hx-top-header a.dropdown-toggle{
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.hx-top-header a{
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

/* Forms and Form Elements */

.form-control{
  border-radius: 0px;
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.form-control::-moz-placeholder{
  --tw-placeholder-opacity: 1;
  color: rgb(95 100 125 / var(--tw-placeholder-opacity))
}

.form-control::placeholder{
  --tw-placeholder-opacity: 30%;
  color: rgb(95 100 125 / var(--tw-placeholder-opacity))
}

.dark .form-control{
  --tw-border-opacity: 1;
  border-color: rgb(9 10 15 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.form-control:focus{
  --tw-border-opacity: 1;
  border-color: rgb(11 59 97 / var(--tw-border-opacity));
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  outline: 2px solid transparent;
  outline-offset: 2px
}

.dark .form-control:focus{
  --tw-border-opacity: 1;
  border-color: rgb(165 180 252 / var(--tw-border-opacity))
}

.form-control.StripeElement{
  --tw-bg-opacity: 1;
  background-color: rgb(247 247 249 / var(--tw-bg-opacity))
}

input[type=checkbox], input[type=radio]{
  margin-right: 0.5rem
}

.checkbox label, .radio label{
  padding-bottom: 0.25rem
}

.help-block{
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

input.input_search:focus{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.dark input.input_search:focus{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

#pwstrengthbox{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.dark #pwstrengthbox{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.form-mydetails, .form-addcontact, .form-contacts, .form-domaindetails{
  padding-top: 2.5rem;
  padding-left: 1.25rem
}

.md-editor{
  --tw-border-opacity: 1;
  border-color: rgb(250 250 251 / var(--tw-border-opacity))
}

.dark .md-editor{
  --tw-border-opacity: 1;
  border-color: rgb(9 10 15 / var(--tw-border-opacity))
}

.md-editor>textarea, .md-editor>.md-preview{
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.dark .md-editor>textarea,.dark  .md-editor>.md-preview{
  --tw-border-opacity: 1;
  border-color: rgb(19 20 25 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.md-editor.active{
  --tw-border-opacity: 1;
  border-color: rgb(19 20 25 / var(--tw-border-opacity));
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.md-editor>textarea:focus{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .md-editor>textarea:focus{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.md-editor .md-footer, .md-editor>.md-header{
  --tw-border-opacity: 1;
  border-color: rgb(235 236 240 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.dark .md-editor .md-footer,.dark  .md-editor>.md-header{
  --tw-border-opacity: 1;
  border-color: rgb(19 20 25 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.input-group-addon{
  border-width: 0px;
  --tw-bg-opacity: 1;
    border-width: 0px;
  background-color: rgb(235 236 240);
  color: rgb(135 140 164 / var(--tw-text-opacity))
 /* background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity)) */
}

.dark .input-group-addon{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

#fileuploads input[readonly], .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control{
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.dark #fileuploads input[readonly],.dark  .form-control[disabled],.dark  .form-control[readonly],.dark  fieldset[disabled] .form-control{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity))
}

.panel-payment .select-inline{
  width: 100%
}

.payment-btn-container{
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  padding-bottom: 0.75rem
}

label{
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  /* Hexa default — trial: sin mayúsculas ni tracking ancho en labels
  text-transform: uppercase;
  letter-spacing: 0.1em;
  */
  text-transform: none;
  letter-spacing: normal;
  --tw-text-opacity: 1;
  color: rgb(44 47 58 / var(--tw-text-opacity))
}

.dark label{
  --tw-text-opacity: 1;
  color: rgb(213 215 223 / var(--tw-text-opacity))
}

/* Sidebar */

.left-sidebar{
  grid-column: span 4 / span 4;
  border-width: 0px;
  border-right-width: 1px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity));
  background-color: transparent;
  /*background-color: #0B3B61;*/
}

/* Estilo para el hover de todos los elementos del menú */
.sidebar-holder .nav li a:hover {
    background-color: #fff !important;
    color: #0B3B61 !important;
}

/* Estilo para mantener el color del elemento padre cuando un hijo está activo */
.sidebar-holder .nav > li.submenu > a {
    transition: background-color 0.3s, color 0.3s;
}

.sidebar-holder .nav > li.submenu:hover > a,
.sidebar-holder .nav > li.submenu.open > a {
    background-color: #fff !important;
    color: #0B3B61 !important;
}

/* Estilo para el elemento activo */
/*.sidebar-holder .nav li.active > a {
    background-color: #0B3B61 !important;
    color: white !important;
}*/

/* Estilo para el elemento activo */
.sidebar-holder .nav li.active > a {
    background-color: #fff !important;
    color: #0B3B61 !important;
}

/* Estilo para los elementos hijos */
.sidebar-holder .nav li.submenu ul li a {
    background-color: transparent !important;
    color: inherit !important;
}

/* Estilo para el hover de los elementos hijos */
.sidebar-holder .nav li.submenu ul li a:hover {
    background-color: #fff !important;
    color: #0B3B61 !important;
}

/* Estilo para el elemento hijo activo */
.sidebar-holder .nav li.submenu ul li.active > a {
    background-color: #fff !important;
    color: #0B3B61 !important;
}

.sidebar-holder .nav li a:hover i, .sidebar-holder .nav li.active > a i {color:#0B3B61 !important;}


.dark .left-sidebar{
  --tw-border-opacity: 1;
  border-color: rgb(36 38 47 / var(--tw-border-opacity))
}

.mini-sidebar .left-sidebar{
  grid-column: span 1 / span 1 !important
}

.left-sidebar.show-fullsidebar{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dark .left-sidebar.show-fullsidebar{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.site-holder.mini-sidebar li.submenu ul{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dark .site-holder.mini-sidebar li.submenu ul{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.sidebar-holder{
  padding-top: 2rem;
  padding-bottom: 2rem
}

.sidebar-holder .badge-default{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .sidebar-holder .badge-default{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.sidebar-holder .nav li.active .badge-default{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dark .sidebar-holder .nav li.active .badge-default{
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity))
}

.sidebar-holder .nav li.nav-toggle{
  /* background-color: transparent*/
  background-color:#0B3B61;
}

.sidebar-holder .nav li a{
  --tw-text-opacity: 1;
  color: rgb(113 119 147 / var(--tw-text-opacity))
}

.sidebar-holder .nav > li ul{
  background-color: transparent
}

.sidebar-holder .nav li.active > a{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(10 32 56 / var(--tw-text-opacity))
}

.dark .sidebar-holder .nav li.active > a{
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.submenu ul li{
  font-size: 0.875rem;
  line-height: 1.25rem
}

/* Nav */

.nav-material{
  margin-bottom: 1.75rem;
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity));
  padding-top: 1.25rem
}

.dark .nav-material{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.nav-material .badge{
  display: none
}

.nav-material>li.active>a{
  border-width: 0px;
  border-bottom-width: 1px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-color: rgb(180 183 198 / var(--tw-border-opacity));
  padding-left: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(27 29 36 / var(--tw-text-opacity))
}

.dark .nav-material>li.active>a{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

.nav-material>li.active>a:hover, .nav-material>li.active>a:focus{
  border-bottom-width: 1px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-color: rgb(180 183 198 / var(--tw-border-opacity));
  background-color: transparent;
  padding-left: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(27 29 36 / var(--tw-text-opacity))
}

.dark .nav-material>li.active>a:hover,.dark  .nav-material>li.active>a:focus{
  --tw-border-opacity: 1;
  border-color: rgb(27 29 36 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

.nav-material > li > a{
  background-color: transparent;
  padding-left: 1rem;
  padding-right: 1rem;
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

/* Horizontal Menu */

.navbar-default{
  border-width: 0px;
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(235 236 240 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(247 247 249 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.dark .navbar-default{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.navbar-default .navbar-nav{
  margin-left: -0.5rem;
  margin-right: -0.5rem;
  margin-top: 0.375rem;
  margin-bottom: 0.375rem
}

.navbar-default .navbar-collapse, .navbar-default .navbar-form{
  --tw-border-opacity: 1;
  border-color: rgb(235 236 240 / var(--tw-border-opacity))
}

.dark .navbar-default .navbar-collapse,.dark  .navbar-default .navbar-form{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.navbar-default .navbar-toggle{
  --tw-border-opacity: 1;
  border-color: rgb(235 236 240 / var(--tw-border-opacity))
}

.dark .navbar-default .navbar-toggle{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity))
}

.dark .navbar-default .navbar-toggle:focus,.dark  .navbar-default .navbar-toggle:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(61 65 81 / var(--tw-bg-opacity))
}

.navbar-default .nav>li>a{
  padding-left: 1.5rem;
  padding-right: 1.5rem
}

.navbar-default .nav>li>a:hover{
  --tw-text-opacity: 1;
  color: rgb(27 29 36 / var(--tw-text-opacity))
}

.navbar-default .nav>li>a:focus{
  --tw-text-opacity: 1;
  color: rgb(27 29 36 / var(--tw-text-opacity))
}

.dark .navbar-default .nav>li>a:hover{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

.dark .navbar-default .nav>li>a:focus{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover{
  background-color: transparent
}

.navbar-default .nav>li>a{
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

@media (min-width: 640px){
  .navbar-default .nav>li>a:first-child{
    padding-left: 0px
  }
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{
  background-color: transparent
}

/* Table */

.table{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .table{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th{
  margin: 0px;
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(250 250 251 / var(--tw-border-opacity));
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 1.25rem;
  padding-bottom: 0.75rem;
  line-height: 1.25rem
}

.table > tbody > tr > td:focus, .table > tbody > tr > th:focus, .table > tfoot > tr > td:focus, .table > tfoot > tr > th:focus, .table > thead > tr > td:focus, .table > thead > tr > th:focus{
  outline: 2px solid transparent;
  outline-offset: 2px
}

.dark .table > tbody > tr > td,.dark  .table > tbody > tr > th,.dark  .table > tfoot > tr > td,.dark  .table > tfoot > tr > th,.dark  .table > thead > tr > td,.dark  .table > thead > tr > th{
  --tw-border-opacity: 1;
  border-color: rgb(27 29 36 / var(--tw-border-opacity))
}

.table > thead > tr > th{
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(235 236 240 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.75rem;
  line-height: 1rem;
  letter-spacing: 0.05em;
  --tw-text-opacity: 1;
  color: rgb(78 82 103 / var(--tw-text-opacity))
}

.dark .table > thead > tr > th{
  --tw-border-opacity: 1;
  border-color: rgb(27 29 36 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

.table-hover>tbody>tr:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity))
}

.dark .table-hover>tbody>tr:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(36 38 47 / var(--tw-bg-opacity))
}

.table-striped>tbody>tr:nth-of-type(odd){
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .table-striped>tbody>tr:nth-of-type(odd){
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity))
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th:first-child:before,
table.dtr-inline.collapsed>thead>tr>th:first-child .btn-table-collapse.expanded{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity));
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

table.dataTable>tbody>tr.child ul li{
  --tw-border-opacity: 1;
  border-color: rgb(61 65 81 / var(--tw-border-opacity))
}

.ssl img{
  margin-right: 0.25rem;
  /*height: 0.75rem;
  width: 0.75rem;*/
  width:50%;
  vertical-align: baseline
}

/* Homepage Files */

.files-section{
  padding-top: 1.25rem;
  padding-left: 1.25rem
}

.file{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .file{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

/* Panel News */

.panel-news{
  border-radius: 0px
}

.panel-news>.panel-body{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.75rem
}

.dark .panel-news>.panel-body{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.panel-news>.panel-body a{
  --tw-text-opacity: 1;
  color: rgb(78 82 103 / var(--tw-text-opacity))
}

.panel-news>.panel-heading{
  border-radius: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.dark .panel-news>.panel-heading{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.item a.date{
  margin-left: 0.25rem;
  margin-right: 0.25rem;
  --tw-text-opacity: 1;
  color: rgb(61 65 81 / var(--tw-text-opacity))
}

.dark .item a.date{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

/* Breadcrumbs */

.breadcrumb>li+li:before{
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

/* Alert Boxes */

.alert{
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity))
}

.alert h4{
  padding-left: 0px
}

.alert a{
  text-decoration-line: underline
}

.alert-watermark .fas{
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity));
  opacity: 0.75
}

.alert-warning, .alert-pending{
  --tw-bg-opacity: 1;
  background-color: rgb(250 204 21 / var(--tw-bg-opacity))
}

.alert-danger, .alert-terminated{
  --tw-bg-opacity: 1;
  background-color: rgb(248 113 113 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(44 47 58 / var(--tw-text-opacity))
}

.alert-success, .alert-active{
  --tw-bg-opacity: 1;
  background-color: rgb(199 225 209 / var(--tw-bg-opacity))
}

.alert-inprogress, .alert-active{
  --tw-bg-opacity: 1;
  background-color: rgb(204 225 213 / var(--tw-bg-opacity))
}
}

.alert-info{
  --tw-bg-opacity: 1;
  background-color: rgb(147 197 253 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(195 195 195 / var(--tw-text-opacity))
}

.alert-info {color: #c3c3c3 !important;}

.alert-primary{
  --tw-bg-opacity: 1;
  background-color: rgb(11 59 97 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(224 231 255 / var(--tw-text-opacity))
}

.alert-primary a{
  --tw-text-opacity: 1;
  color: rgb(224 231 255 / var(--tw-text-opacity))
}

.alert-white{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity))
}

.alert-neutral, .alert-default, .alert-cancelled, .alert-suspended{
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(61 65 81 / var(--tw-text-opacity))
}

.dark .alert-neutral,.dark  .alert-default,.dark  .alert-cancelled,.dark  .alert-suspended{
  --tw-bg-opacity: 1;
  background-color: rgb(78 82 103 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(213 215 223 / var(--tw-text-opacity))
}

.alert-dark, .alert-fraud{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(235 236 240 / var(--tw-text-opacity))
}

/* Pagination */

.pagination > li > a, .pagination > li > span{
  border-width: 0px;
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(95 100 125 / var(--tw-text-opacity))
}

.pagination > li:first-child > a, .pagination > li:first-child > span{
  border-radius: 0px
}

.pagination > li:last-child > a, .pagination > li:last-child > span{
  border-radius: 0px
}

.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity))
}

.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity))
}

.dark .pagination > .active > a,.dark  .pagination > .active > a:focus,.dark  .pagination > .active > a:hover,.dark  .pagination > .active > span,.dark  .pagination > .active > span:focus,.dark  .pagination > .active > span:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(61 65 81 / var(--tw-bg-opacity))
}

.pagination > li:first-child, .pagination > li:last-child {
  i {
    color: $primary-text
  }
}

.pagination > .disabled > a{
  border-width: 0px;
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(61 65 81 / var(--tw-text-opacity))
}

.dark .pagination > .disabled > a{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

.paginate_disabled_next:before, .paginate_disabled_previous:before, .paginate_enabled_next:before, .paginate_enabled_previous:before, .sorting:before, .sorting_asc:before, .sorting_desc:before{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

/* Search Box */

.search-box .form-control:focus{
  background-color: transparent;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  outline: 2px solid transparent;
  outline-offset: 2px
}

/* Featured Domains */

h2.find-domain{
  margin-top: 2.5rem;
  margin-bottom: 1.25rem;
  text-align: center;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 400;
  text-transform: none
}

.featured-tlds{
  margin-top: 1rem;
  display: block;
  justify-content: center;
  font-size: 1.125rem;
  line-height: 1.75rem
}

@media (min-width: 768px){
  .featured-tlds{
    display: flex;
    flex-wrap: wrap
  }
}

.featured-col{
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 1.25rem;
  padding-right: 1.25rem
}

.featured-col .domain{
  margin-left: 0.75rem;
  margin-right: 0.75rem;
  display: inline-block;
  font-weight: 900
}

.featured-col .price{
  display: inline-block
}

.featured-col .domain span{
  margin-right: 0.25rem;
  --tw-text-opacity: 1;
  color: rgb(11 59 97 / var(--tw-text-opacity))
}

/* Login */

.login-wrapper  .input-group-addon{
  border-style: none;
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.login-wrapper .box{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.logo-page{
  margin-bottom: 1.25rem
}

.signup-text{
  padding-left: 0.75rem;
  padding-right: 0.75rem
}

.login-wrapper .box a.forgot{
  padding-left: 0.5rem;
  padding-right: 0.5rem
}

.login-wrapper .box .rememberme{
  padding-left: 0.5rem;
  padding-right: 0.5rem
}

/* Bootstrap Switch */

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success{
  --tw-bg-opacity: 1;
  background-color: rgb(41 77 106 / var(--tw-bg-opacity))
}

.bootstrap-switch .bootstrap-switch-label{
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity))
}

.dark .bootstrap-switch .bootstrap-switch-label{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.bootstrap-switch{
  --tw-border-opacity: 1;
  border-color: rgb(180 183 198 / var(--tw-border-opacity))
}

.dark .bootstrap-switch{
  --tw-border-opacity: 1;
  border-color: rgb(9 10 15 / var(--tw-border-opacity))
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default{
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

.dark .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default,.dark  .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

/* Flowcart */

@media (min-width: 640px){
  .domain-input-group{
    margin-left: 2rem
  }
}

#flow-menu li.dashboard, #stepbar li.dashboard{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity))
}

#flow-menu>li>a:hover {background:#0b3b61; color:#fff;}

.dark #flow-menu li.dashboard,.dark  #stepbar li.dashboard{
  --tw-bg-opacity: 1;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity))
}

#flow-menu>li>a, #stepbar>li>a, ul.nav-wizard li{
  --tw-text-opacity: 1;
  color: rgb(61 65 81 / var(--tw-text-opacity))
}

.dark #flow-menu>li>a,.dark  #stepbar>li>a,.dark  ul.nav-wizard li{
  --tw-text-opacity: 1;
  color: rgb(135 140 164 / var(--tw-text-opacity))
}

#stepbar > li.active > a, #stepbar > li.active > span, #flow-menu > li.active > a, ul.nav-wizard li.active{
  --tw-bg-opacity: 1;
  background-color: rgb(11 59 97 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

ul.nav-wizard li:after{
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity))
}

.dark ul.nav-wizard li:after{
  --tw-border-opacity: 1;
  border-color: rgb(9 10 15 / var(--tw-border-opacity))
}

ul.nav-wizard li:before{
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity))
}

.dark ul.nav-wizard li:before{
  --tw-border-opacity: 1;
  border-color: rgb(9 10 15 / var(--tw-border-opacity))
}

ul.nav-wizard li.active:after, ul.nav-wizard li.active:before{
  --tw-border-opacity: 1;
  border-color: rgb(11 59 97 / var(--tw-border-opacity))
}

.spotlight-tld{
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .spotlight-tld{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.cal, .curr{
  --tw-text-opacity: 1;
  color: rgb(78 82 103 / var(--tw-text-opacity))
}

.dark .cal,.dark  .curr{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

input.cycle-1:checked+label.radio i, input.cycle-curr:checked+label.radio i, input.cycle-1:checked+label.radio i{
  --tw-text-opacity: 1;
  color: rgb(11 59 97 / var(--tw-text-opacity))
}

#order-standard_cart h4{
  padding-left: 0px
}

.view-cart-items, .order-summary .subtotal, .order-summary .total-due-today-padded, .promo-summary{
  border-width: 0px;
  border-bottom-width: 1px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-color: rgb(235 236 240 / var(--tw-border-opacity))
}

.dark .view-cart-items,.dark  .order-summary .subtotal,.dark  .order-summary .total-due-today-padded,.dark  .promo-summary{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.view-cart-items .item{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  padding: 1.25rem
}

.dark .view-cart-items .item{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.view-cart-items .item:nth-child(even){
  --tw-bg-opacity: 1;
  background-color: rgb(247 247 249 / var(--tw-bg-opacity))
}

.dark .view-cart-items .item:nth-child(even){
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.promo-summary{
  --tw-bg-opacity: 1;
  background-color: rgb(247 247 249 / var(--tw-bg-opacity));
  padding-top: 1.25rem;
  padding-bottom: 1.25rem
}

.dark .promo-summary{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.recurring-totals, .subtotal{
  padding: 1.25rem
}

.order-summary h2{
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 700
}

.feature-value{
  font-weight: 700
}

.suggested-domains .domain-lookup-suggestions-loader{
  --tw-bg-opacity: 1;
  background-color: rgb(213 215 223 / var(--tw-bg-opacity))
}

.dark .suggested-domains .domain-lookup-suggestions-loader{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.featured-tld{
  background-color: rgb(19 20 25 / var(--tw-bg-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.featured-tld .price{
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(78 82 103 / var(--tw-text-opacity))
}

.dark .featured-tld .price{
  --tw-bg-opacity: 1;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity))
}

.domain-pricing .tld-row.highlighted{
  border-width: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity))
}

.dark .domain-pricing .tld-row.highlighted{
  --tw-bg-opacity: 1;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity))
}

.tld-pricing-header{
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity))
}

.dark .tld-pricing-header{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

.tld-filters .label-success{
  --tw-bg-opacity: 1;
  background-color: rgb(165 180 252 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(250 250 251 / var(--tw-text-opacity))
}

.tld-filters .label-success[href]:focus, .tld-filters .label-success[href]:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(165 180 252 / var(--tw-bg-opacity))
}

.fa-money-bill-alt{
  --tw-text-opacity: 1;
  color: rgb(78 82 103 / var(--tw-text-opacity))
}

.dark .fa-money-bill-alt{
  --tw-text-opacity: 1;
  color: rgb(180 183 198 / var(--tw-text-opacity))
}

.featured-tld .img-container{
  height: 8rem;
  padding: 2.5rem;
  text-align: center
}

.domain-lookup-loader{
  padding-left: 1.25rem;
  padding-right: 1.25rem
}

.headline-line h4{
  --tw-bg-opacity: 1;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity));
  /* background:#fafafb;*/
}

.dark .headline-line h4{
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity))
}

.promo-code{
  --tw-border-opacity: 1;
  border-color: rgb(213 215 223 / var(--tw-border-opacity))
}

.dark .promo-code{
  --tw-border-opacity: 1;
  border-color: rgb(44 47 58 / var(--tw-border-opacity))
}

#order-flow_slider .irs--round .irs-handle{
  --tw-border-opacity: 1;
  border-color: rgb(11 71 118 / var(--tw-border-opacity))
}

#order-flow_slider .irs--round .irs-from, .irs--round .irs-to, .irs--round .irs-single{
  --tw-bg-opacity: 1;
  background-color: rgb(165 180 252 / var(--tw-bg-opacity))
}

#order-flow_slider .irs--round .irs-bar{
  --tw-bg-opacity: 1;
  background-color: rgb(11 71 118 / var(--tw-bg-opacity))
}

#order-flow_slider .feature-container .progress.small-progress .progress-bar{
  --tw-bg-opacity: 1;
  background-color: rgb(165 180 252 / var(--tw-bg-opacity))
}

@media (min-width: 640px){
  .alert-product-name{
    margin-left: -1.25rem
  }
}

.sr-only{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border-width: 0 !important
}

.static{
  position: static !important
}

.fixed{
  position: fixed !important
}

.absolute{
  position: absolute !important
}

.\!relative{
  position: relative !important
}

.relative{
  position: relative !important
}

.bottom-0{
  bottom: 0px !important
}

.left-4{
  left: 1rem !important
}

.left-5{
  left: 1.25rem !important
}

.right-0{
  right: 0px !important
}

.top-0{
  top: 0px !important
}

.top-4{
  top: 1rem !important
}

.top-6{
  top: 1.5rem !important
}

.col-span-12{
  grid-column: span 12 / span 12 !important
}

.col-span-2{
  grid-column: span 2 / span 2 !important
}

.col-span-3{
  grid-column: span 3 / span 3 !important
}

.col-span-6{
  grid-column: span 6 / span 6 !important
}

.float-right{
  float: right !important
}

.float-left{
  float: left !important
}

.-m-3{
  margin: -0.75rem !important
}

.m-0{
  margin: 0px !important
}

.m-1{
  margin: 0.25rem !important
}

.m-2{
  margin: 0.5rem !important
}

.m-5{
  margin: 1.25rem !important
}

.mx-1{
  margin-left: 0.25rem !important;
  margin-right: 0.25rem !important
}

.mx-1\.5{
  margin-left: 0.375rem !important;
  margin-right: 0.375rem !important
}

.mx-10{
  margin-left: 2.5rem !important;
  margin-right: 2.5rem !important
}

.mx-2{
  margin-left: 0.5rem !important;
  margin-right: 0.5rem !important
}

.mx-3{
  margin-left: 0.75rem !important;
  margin-right: 0.75rem !important
}

.mx-5{
  margin-left: 1.25rem !important;
  margin-right: 1.25rem !important
}

.mx-auto{
  margin-left: auto !important;
  margin-right: auto !important
}

.my-0{
  margin-top: 0px !important;
  margin-bottom: 0px !important
}

.my-10{
  margin-top: 2.5rem !important;
  margin-bottom: 2.5rem !important
}

.my-2{
  margin-top: 0.5rem !important;
  margin-bottom: 0.5rem !important
}

.my-3{
  margin-top: 0.75rem !important;
  margin-bottom: 0.75rem !important
}

.my-5{
  margin-top: 1.25rem !important;
  margin-bottom: 1.25rem !important
}

.\!mb-5{
  margin-bottom: 1.25rem !important
}

.-mb-8{
  margin-bottom: -2rem !important
}

.-mb-px{
  margin-bottom: -1px !important
}

.-ml-0{
  margin-left: -0px !important
}

.-ml-0\.5{
  margin-left: -0.125rem !important
}

.-ml-1{
  margin-left: -0.25rem !important
}

.-ml-1\.5{
  margin-left: -0.375rem !important
}

.-ml-4{
  margin-left: -1rem !important
}

.-ml-px{
  margin-left: -1px !important
}

.-mr-1{
  margin-right: -0.25rem !important
}

.-mt-1{
  margin-top: -0.25rem !important
}

.-mt-4{
  margin-top: -1rem !important
}

.-mt-6{
  margin-top: -1.5rem !important
}

.mb-0{
  margin-bottom: 0px !important
}

.mb-1{
  margin-bottom: 0.25rem !important
}

.mb-10{
  margin-bottom: 2.5rem !important
}

.mb-2{
  margin-bottom: 0.5rem !important
}

.mb-3{
  margin-bottom: 0.75rem !important
}

.mb-4{
  margin-bottom: 1rem !important
}

.mb-5{
  margin-bottom: 1.25rem !important
}

.ml-1{
  margin-left: 0.25rem !important
}

.ml-10{
  margin-left: 2.5rem !important
}

.ml-2{
  margin-left: 0.5rem !important
}

.ml-3{
  margin-left: 0.75rem !important
}

.ml-4{
  margin-left: 1rem !important
}

.ml-5{
  margin-left: 1.25rem !important
}

.ml-6{
  margin-left: 1.5rem !important
}

.ml-8{
  margin-left: 2rem !important
}

.ml-auto{
  margin-left: auto !important
}

.mr-0{
  margin-right: 0px !important
}

.mr-0\.5{
  margin-right: 0.125rem !important
}

.mr-1{
  margin-right: 0.25rem !important
}

.mr-2{
  margin-right: 0.5rem !important
}

.mr-3{
  margin-right: 0.75rem !important
}

.mr-4{
  margin-right: 1rem !important
}

.mr-auto{
  margin-right: auto !important
}

.mt-0{
  margin-top: 0px !important
}

.mt-0\.5{
  margin-top: 0.125rem !important
}

.mt-1{
  margin-top: 0.25rem !important
}

.mt-10{
  margin-top: 2.5rem !important
}

.mt-2{
  margin-top: 0.5rem !important
}

.mt-3{
  margin-top: 0.75rem !important
}

.mt-4{
  margin-top: 1rem !important
}

.mt-5{
  margin-top: 1.25rem !important
}

.mt-6{
  margin-top: 1.5rem !important
}

.mt-8{
  margin-top: 2rem !important
}

.block{
  display: block !important
}

.inline-block{
  display: inline-block !important
}

.inline{
  display: inline !important
}

.flex{
  display: flex !important
}

.inline-flex{
  display: inline-flex !important
}

.table{
  display: table !important
}

.\!grid{
  display: grid !important
}

.grid{
  display: grid !important
}

.contents{
  display: contents !important
}

.\!hidden{
  display: none !important
}

.hidden{
  display: none !important
}

.h-10{
  height: 2.5rem !important
}

.h-12{
  height: 3rem !important
}

.h-16{
  height: 4rem !important
}

.h-2{
  height: 0.5rem !important
}

.h-20{
  height: 5rem !important
}

.h-4{
  height: 1rem !important
}

.h-5{
  height: 1.25rem !important
}

.h-7{
  height: 1.75rem !important
}

.h-8{
  height: 2rem !important
}

.h-full{
  height: 100% !important
}

.h-screen{
  height: 100vh !important
}

.min-h-full{
  min-height: 100% !important
}

.w-0{
  width: 0px !important
}

.w-0\.5{
  width: 0.125rem !important
}

.w-1\/2{
  width: 50% !important
}

.w-1\/3{
  width: 33.333333% !important
}

.w-10{
  width: 2.5rem !important
}

.w-12{
  width: 3rem !important
}

.w-16{
  width: 4rem !important
}

.w-2\/3{
  width: 66.666667% !important
}

.w-2\/5{
  width: 40% !important
}

.w-20{
  width: 5rem !important
}

.w-24{
  width: 6rem !important
}

.w-32{
  width: 8rem !important
}

.w-4{
  width: 1rem !important
}

.w-5{
  width: 1.25rem !important
}

.w-7{
  width: 1.75rem !important
}

.w-8{
  width: 2rem !important
}

.w-full{
  width: 100% !important
}

.w-px{
  width: 1px !important
}

.min-w-0{
  min-width: 0px !important
}

.min-w-full{
  min-width: 100% !important
}

.max-w-2xl{
  max-width: 42rem !important
}

.max-w-3xl{
  max-width: 48rem !important
}

.max-w-lg{
  max-width: 32rem !important
}

.max-w-screen-2xl{
  max-width: 1536px !important
}

.max-w-screen-sm{
  max-width: 640px !important
}

.max-w-xl{
  max-width: 36rem !important
}

.flex-1{
  flex: 1 1 0% !important
}

.flex-auto{
  flex: 1 1 auto !important
}

.flex-shrink-0{
  flex-shrink: 0 !important
}

.flex-grow{
  flex-grow: 1 !important
}

.transform{
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important
}

.cursor-pointer{
  cursor: pointer !important
}

.select-none{
  -webkit-user-select: none !important;
     -moz-user-select: none !important;
          user-select: none !important
}

.resize{
  resize: both !important
}

.list-none{
  list-style-type: none !important
}

.\!grid-cols-1{
  grid-template-columns: repeat(1, minmax(0, 1fr)) !important
}

.grid-cols-1{
  grid-template-columns: repeat(1, minmax(0, 1fr)) !important
}

.grid-cols-12{
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important
}

.grid-cols-2{
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important
}

.flex-row{
  flex-direction: row !important
}

.flex-col{
  flex-direction: column !important
}

.flex-wrap{
  flex-wrap: wrap !important
}

.items-start{
  align-items: flex-start !important
}

.items-end{
  align-items: flex-end !important
}

.items-center{
  align-items: center !important
}

.items-stretch{
  align-items: stretch !important
}

.justify-end{
  justify-content: flex-end !important
}

.justify-center{
  justify-content: center !important
}

.justify-between{
  justify-content: space-between !important
}

.gap-2{
  gap: 0.5rem !important
}

.gap-5{
  gap: 1.25rem !important
}

.gap-6{
  gap: 1.5rem !important
}

.\!gap-x-5{
  -moz-column-gap: 1.25rem !important;
       column-gap: 1.25rem !important
}

.\!gap-y-1{
  row-gap: 0.25rem !important
}

.\!gap-y-2{
  row-gap: 0.5rem !important
}

.gap-x-10{
  -moz-column-gap: 2.5rem !important;
       column-gap: 2.5rem !important
}

.gap-x-4{
  -moz-column-gap: 1rem !important;
       column-gap: 1rem !important
}

.gap-x-8{
  -moz-column-gap: 2rem !important;
       column-gap: 2rem !important
}

.gap-y-10{
  row-gap: 2.5rem !important
}

.gap-y-6{
  row-gap: 1.5rem !important
}

.space-x-2 > :not([hidden]) ~ :not([hidden]){
  --tw-space-x-reverse: 0 !important;
  margin-right: calc(0.5rem * var(--tw-space-x-reverse)) !important;
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))) !important
}

.space-x-3 > :not([hidden]) ~ :not([hidden]){
  --tw-space-x-reverse: 0 !important;
  margin-right: calc(0.75rem * var(--tw-space-x-reverse)) !important;
  margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse))) !important
}

.space-x-4 > :not([hidden]) ~ :not([hidden]){
  --tw-space-x-reverse: 0 !important;
  margin-right: calc(1rem * var(--tw-space-x-reverse)) !important;
  margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))) !important
}

.space-x-8 > :not([hidden]) ~ :not([hidden]){
  --tw-space-x-reverse: 0 !important;
  margin-right: calc(2rem * var(--tw-space-x-reverse)) !important;
  margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse))) !important
}

.space-x-9 > :not([hidden]) ~ :not([hidden]){
  --tw-space-x-reverse: 0 !important;
  margin-right: calc(2.25rem * var(--tw-space-x-reverse)) !important;
  margin-left: calc(2.25rem * calc(1 - var(--tw-space-x-reverse))) !important
}

.space-y-2 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0 !important;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))) !important;
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)) !important
}

.space-y-5 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0 !important;
  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse))) !important;
  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse)) !important
}

.space-y-6 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0 !important;
  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse))) !important;
  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse)) !important
}

.divide-y > :not([hidden]) ~ :not([hidden]){
  --tw-divide-y-reverse: 0 !important;
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))) !important;
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse)) !important
}

.divide-gray-100 > :not([hidden]) ~ :not([hidden]){
  --tw-divide-opacity: 1 !important;
  border-color: rgb(235 236 240 / var(--tw-divide-opacity)) !important
}

.divide-gray-200 > :not([hidden]) ~ :not([hidden]){
  --tw-divide-opacity: 1 !important;
  border-color: rgb(213 215 223 / var(--tw-divide-opacity)) !important
}

.overflow-auto{
  overflow: auto !important
}

.overflow-hidden{
  overflow: hidden !important
}

.truncate{
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important
}

.whitespace-nowrap{
  white-space: nowrap !important
}

.rounded{
  border-radius: 0.25rem !important
}

.rounded-full{
  border-radius: 9999px !important
}

.rounded-lg{
  border-radius: 0.5rem !important
}

.rounded-md{
  border-radius: 0.375rem !important
}

.rounded-none{
  border-radius: 0px !important
}

.rounded-sm{
  border-radius: 0.125rem !important
}

.rounded-l-md{
  border-top-left-radius: 0.375rem !important;
  border-bottom-left-radius: 0.375rem !important
}

.rounded-r-md{
  border-top-right-radius: 0.375rem !important;
  border-bottom-right-radius: 0.375rem !important
}

.\!border{
  border-width: 1px !important
}

.border{
  border-width: 1px !important
}

.border-0{
  border-width: 0px !important
}

.border-b{
  border-bottom-width: 1px !important
}

.border-b-2{
  border-bottom-width: 2px !important
}

.border-l{
  border-left-width: 1px !important
}

.border-l-2{
  border-left-width: 2px !important
}

.border-r-0{
  border-right-width: 0px !important
}

.border-t{
  border-top-width: 1px !important
}

.border-t-2{
  border-top-width: 2px !important
}

.border-solid{
  border-style: solid !important
}

.border-gray-100{
  --tw-border-opacity: 1 !important;
  border-color: rgb(235 236 240 / var(--tw-border-opacity)) !important
}

.border-gray-200{
  --tw-border-opacity: 1 !important;
  border-color: rgb(213 215 223 / var(--tw-border-opacity)) !important
}

.border-gray-300{
  --tw-border-opacity: 1 !important;
  border-color: rgb(180 183 198 / var(--tw-border-opacity)) !important
}

.border-gray-800{
  --tw-border-opacity: 1 !important;
  border-color: rgb(44 47 58 / var(--tw-border-opacity)) !important
}

.border-primary-500{
  --tw-border-opacity: 1 !important;
  border-color: rgb(11 59 97 / var(--tw-border-opacity)) !important
}

.border-transparent{
  border-color: transparent !important
}

.bg-black{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity)) !important
}

.bg-gray-10{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(250 250 251 / var(--tw-bg-opacity)) !important
}

.bg-gray-100{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity)) !important
}

.bg-gray-200{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important
}

.bg-gray-400{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(135 140 164 / var(--tw-bg-opacity)) !important
}

.bg-gray-50{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(247 247 249 / var(--tw-bg-opacity)) !important
}

.bg-gray-700{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(61 65 81 / var(--tw-bg-opacity)) !important
}

.bg-gray-900{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity)) !important
}

.bg-gray-950{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity)) !important
}

.bg-gray-990{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity)) !important
}

.bg-indigo-600{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(11 59 97 / var(--tw-bg-opacity)) !important
}

.bg-primary-200{
  --tw-bg-opacity: 10% !important;
  background-color: rgb(27 160 218 / var(--tw-bg-opacity)) !important
}

.bg-primary-400{
  --tw-bg-opacity: 10% !important;
  background-color: rgb(27 160 218 / var(--tw-bg-opacity)) !important
}

.bg-primary-500{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(11 59 97 / var(--tw-bg-opacity)) !important
}

.bg-primary-600{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(11 59 97 / var(--tw-bg-opacity)) !important
}

.bg-red-600{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity)) !important
}

.bg-hosting506-600{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(30 162 219 / var(--tw-bg-opacity)) !important
}

.bg-transparent{
  background-color: transparent !important
}

.bg-white{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important
}

.bg-yellow-100{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(254 249 195 / var(--tw-bg-opacity)) !important
}

.bg-yellow-600{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(202 138 4 / var(--tw-bg-opacity)) !important
}

.bg-gradient-to-r{
  background-image: linear-gradient(to right, var(--tw-gradient-stops)) !important
}

.from-purple-400{
  --tw-gradient-from: #021d33 !important;
  --tw-gradient-to: rgb(192 132 252 / 0) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important
}

.via-pink-500{
  --tw-gradient-to: rgb(236 72 153 / 0) !important;
  --tw-gradient-stops: var(--tw-gradient-from), #0b3b61, var(--tw-gradient-to) !important
}

.to-red-500{
  --tw-gradient-to: #39556b !important
}

.object-cover{
  -o-object-fit: cover !important;
     object-fit: cover !important
}

.object-center{
  -o-object-position: center !important;
     object-position: center !important
}

.\!p-0{
  padding: 0px !important
}

.\!p-1{
  padding: 0.25rem !important
}

.\!p-10{
  padding: 2.5rem !important
}

.\!p-5{
  padding: 1.25rem !important
}

.p-0{
  padding: 0px !important
}

.p-2{
  padding: 0.5rem !important
}

.p-3{
  padding: 0.75rem !important
}

.p-4{
  padding: 1rem !important
}

.p-5{
  padding: 1.25rem !important
}

.p-6{
  padding: 1.5rem !important
}

.\!px-1{
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important
}

.\!px-10{
  padding-left: 2.5rem !important;
  padding-right: 2.5rem !important
}

.\!px-2{
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important
}

.\!px-3{
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important
}

.\!px-4{
  padding-left: 1rem !important;
  padding-right: 1rem !important
}

.\!px-5{
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important
}

.\!py-1{
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important
}

.\!py-10{
  padding-top: 2.5rem !important;
  padding-bottom: 2.5rem !important
}

.\!py-16{
  padding-top: 4rem !important;
  padding-bottom: 4rem !important
}

.\!py-2{
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important
}

.\!py-3{
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important
}

.\!py-5{
  padding-top: 1.25rem !important;
  padding-bottom: 1.25rem !important
}

.\!py-6{
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important
}

.px-0{
  padding-left: 0px !important;
  padding-right: 0px !important
}

.px-1{
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important
}

.px-1\.5{
  padding-left: 0.375rem !important;
  padding-right: 0.375rem !important
}

.px-10{
  padding-left: 2.5rem !important;
  padding-right: 2.5rem !important
}

.px-16{
  padding-left: 4rem !important;
  padding-right: 4rem !important
}

.px-2{
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important
}

.px-3{
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important
}

.px-4{
  padding-left: 1rem !important;
  padding-right: 1rem !important
}

.px-5{
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important
}

.px-6{
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important
}

.py-0{
  padding-top: 0px !important;
  padding-bottom: 0px !important
}

.py-0\.5{
  padding-top: 0.125rem !important;
  padding-bottom: 0.125rem !important
}

.py-1{
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important
}

.py-10{
  padding-top: 2.5rem !important;
  padding-bottom: 2.5rem !important
}

.py-12{
  padding-top: 3rem !important;
  padding-bottom: 3rem !important
}

.py-2{
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important
}

.py-3{
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important
}

.py-4{
  padding-top: 1rem !important;
  padding-bottom: 1rem !important
}

.py-5{
  padding-top: 1.25rem !important;
  padding-bottom: 1.25rem !important
}

.py-6{
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important
}

.py-8{
  padding-top: 2rem !important;
  padding-bottom: 2rem !important
}

.\!pb-1{
  padding-bottom: 0.25rem !important
}

.\!pb-2{
  padding-bottom: 0.5rem !important
}

.\!pb-5{
  padding-bottom: 1.25rem !important
}

.\!pl-0{
  padding-left: 0px !important
}

.\!pl-4{
  padding-left: 1rem !important
}

.\!pl-5{
  padding-left: 1.25rem !important
}

.\!pr-1{
  padding-right: 0.25rem !important
}

.\!pr-3{
  padding-right: 0.75rem !important
}

.\!pr-4{
  padding-right: 1rem !important
}

.pb-0{
  padding-bottom: 0px !important
}

.pb-1{
  padding-bottom: 0.25rem !important
}

.pb-2{
  padding-bottom: 0.5rem !important
}

.pb-3{
  padding-bottom: 0.75rem !important
}

.pb-5{
  padding-bottom: 1.25rem !important
}

.pb-8{
  padding-bottom: 2rem !important
}

.pl-0{
  padding-left: 0px !important
}

.pl-0\.5{
  padding-left: 0.125rem !important
}

.pl-1{
  padding-left: 0.25rem !important
}

.pl-1\.5{
  padding-left: 0.375rem !important
}

.pl-10{
  padding-left: 2.5rem !important
}

.pl-12{
  padding-left: 3rem !important
}

.pl-3{
  padding-left: 0.75rem !important
}

.pl-5{
  padding-left: 1.25rem !important
}

.pl-8{
  padding-left: 2rem !important
}

.pr-0{
  padding-right: 0px !important
}

.pr-0\.5{
  padding-right: 0.125rem !important
}

.pr-1{
  padding-right: 0.25rem !important
}

.pr-2{
  padding-right: 0.5rem !important
}

.pr-4{
  padding-right: 1rem !important
}

.pr-8{
  padding-right: 2rem !important
}

.pt-0{
  padding-top: 0px !important
}

.pt-0\.5{
  padding-top: 0.125rem !important
}

.pt-1{
  padding-top: 0.25rem !important
}

.pt-1\.5{
  padding-top: 0.375rem !important
}

.pt-10{
  padding-top: 2.5rem !important
}

.pt-2{
  padding-top: 0.5rem !important
}

.pt-3{
  padding-top: 0.75rem !important
}

.pt-5{
  padding-top: 1.25rem !important
}

.pt-6{
  padding-top: 1.5rem !important
}

.pt-8{
  padding-top: 2rem !important
}

.text-left{
  text-align: left !important
}

.text-center{
  text-align: center !important
}

.text-right{
  text-align: right !important
}

.text-justify{
  text-align: justify !important
}

.align-middle{
  vertical-align: middle !important
}

.text-2xl{
  font-size: 1.5rem !important;
  line-height: 2rem !important
}

.text-3xl{
  font-size: 1.875rem !important;
  line-height: 2.25rem !important
}

.text-4xl{
  font-size: 2.25rem !important;
  line-height: 2.5rem !important
}

.text-5xl{
  font-size: 3rem !important;
  line-height: 1 !important
}

.text-base{
  font-size: 1rem !important;
  line-height: 1.5rem !important
}

.text-lg{
  font-size: 1.125rem !important;
  line-height: 1.75rem !important
}

.text-sm{
  font-size: 0.875rem !important;
  line-height: 1.25rem !important
}

.text-xl{
  font-size: 1.25rem !important;
  line-height: 1.75rem !important
}

.text-xs{
  font-size: 0.75rem !important;
  line-height: 1rem !important
}

.font-bold{
  font-weight: 700 !important
}

.font-medium{
  font-weight: 500 !important
}

.font-normal{
  font-weight: 400 !important
}

.font-semibold{
  font-weight: 600 !important
}

.font-thin{
  font-weight: 100 !important
}

.uppercase{
  text-transform: uppercase !important
}

.capitalize{
  text-transform: capitalize !important
}

.normal-case{
  text-transform: none !important
}

.leading-4{
  line-height: 1rem !important
}

.leading-5{
  line-height: 1.25rem !important
}

.leading-6{
  line-height: 1.5rem !important
}

.tracking-normal{
  letter-spacing: 0em !important
}

.tracking-wider{
  letter-spacing: 0.05em !important
}

.tracking-widest{
  letter-spacing: 0.1em !important
}

.text-black{
  --tw-text-opacity: 1 !important;
  color: rgb(0 0 0 / var(--tw-text-opacity)) !important
}

.text-blue-600{
  --tw-text-opacity: 1 !important;
  color: rgb(37 99 235 / var(--tw-text-opacity)) !important
}

.text-gray-10{
  --tw-text-opacity: 1 !important;
  color: rgb(250 250 251 / var(--tw-text-opacity)) !important
}

.text-gray-100{
  --tw-text-opacity: 1 !important;
  color: rgb(235 236 240 / var(--tw-text-opacity)) !important
}

.text-gray-300{
  --tw-text-opacity: 1 !important;
  color: rgb(180 183 198 / var(--tw-text-opacity)) !important
}

.text-gray-400{
  --tw-text-opacity: 1 !important;
  color: rgb(135 140 164 / var(--tw-text-opacity)) !important
}

.text-gray-50{
  --tw-text-opacity: 1 !important;
  color: rgb(247 247 249 / var(--tw-text-opacity)) !important
}

.text-gray-500{
  --tw-text-opacity: 1 !important;
  color: rgb(95 100 125 / var(--tw-text-opacity)) !important
}

.text-gray-600{
  --tw-text-opacity: 1 !important;
  color: rgb(78 82 103 / var(--tw-text-opacity)) !important
}

.text-gray-700{
  --tw-text-opacity: 1 !important;
  color: rgb(61 65 81 / var(--tw-text-opacity)) !important
}

.text-gray-800{
  --tw-text-opacity: 1 !important;
  color: rgb(44 47 58 / var(--tw-text-opacity)) !important
}

.text-gray-900{
  --tw-text-opacity: 1 !important;
  color: rgb(27 29 36 / var(--tw-text-opacity)) !important
}

.text-gray-990{
  --tw-text-opacity: 1 !important;
  color: rgb(9 10 15 / var(--tw-text-opacity)) !important
}

.text-green-600{
  --tw-text-opacity: 1 !important;
  color: rgb(22 163 74 / var(--tw-text-opacity)) !important
}

.text-green-700{
  --tw-text-opacity: 1 !important;
  color: rgb(21 128 61 / var(--tw-text-opacity)) !important
}

.text-orange-600{
  --tw-text-opacity: 1 !important;
  color: rgb(234 88 12 / var(--tw-text-opacity)) !important
}

.text-primary-100{
  --tw-text-opacity: 1 !important;
  color: rgb(224 231 255 / var(--tw-text-opacity)) !important
}

.text-primary-500{
  --tw-text-opacity: 1 !important;
  color: rgb(11 59 97 / var(--tw-text-opacity)) !important
}

.text-primary-600{
  --tw-text-opacity: 1 !important;
  color: rgb(11 59 97 / var(--tw-text-opacity)) !important
}

.text-primary-700{
  --tw-text-opacity: 1 !important;
  color: rgb(41 77 106 / var(--tw-text-opacity)) !important
}

.text-red-600{
  --tw-text-opacity: 1 !important;
  color: rgb(220 38 38 / var(--tw-text-opacity)) !important
}

.text-white{
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}

.text-yellow-400{
  --tw-text-opacity: 1 !important;
  color: rgb(250 204 21 / var(--tw-text-opacity)) !important
}

.text-yellow-700{
  --tw-text-opacity: 1 !important;
  color: rgb(161 98 7 / var(--tw-text-opacity)) !important
}

.underline{
  text-decoration-line: underline !important
}

.no-underline{
  text-decoration-line: none !important
}

.underline-offset-1{
  text-underline-offset: 1px !important
}

.opacity-25{
  opacity: 0.25 !important
}

.shadow{
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1) !important;
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.shadow-lg{
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) !important;
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.shadow-md{
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1) !important;
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.shadow-none{
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.shadow-sm{
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05) !important;
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.outline-none{
  outline: 2px solid transparent !important;
  outline-offset: 2px !important
}

.ring-1{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important
}

.ring-8{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(8px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important
}

.ring-black{
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity)) !important
}

.ring-gray-100{
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(235 236 240 / var(--tw-ring-opacity)) !important
}

.ring-opacity-5{
  --tw-ring-opacity: 0.05 !important
}

.blur{
  --tw-blur: blur(8px) !important;
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important
}

.filter{
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important
}

.transition{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter !important;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter !important;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter !important;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition-duration: 150ms !important
}

.transition-all{
  transition-property: all !important;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition-duration: 150ms !important
}

.delay-150{
  transition-delay: 150ms !important
}

.duration-150{
  transition-duration: 150ms !important
}

.duration-300{
  transition-duration: 300ms !important
}

.ease-in-out{
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important
}

.placeholder\:text-gray-700::-moz-placeholder{
  --tw-text-opacity: 1 !important;
  color: rgb(61 65 81 / var(--tw-text-opacity)) !important
}

.placeholder\:text-gray-700::placeholder{
  --tw-text-opacity: 1 !important;
  color: rgb(61 65 81 / var(--tw-text-opacity)) !important
}

.invalid\:hidden:invalid{
  display: none !important
}

.focus-within\:z-10:focus-within{
  z-index: 10 !important
}

.hover\:border-gray-300:hover{
  --tw-border-opacity: 1 !important;
  border-color: rgb(180 183 198 / var(--tw-border-opacity)) !important
}

.hover\:bg-gray-100:hover{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(235 236 240 / var(--tw-bg-opacity)) !important
}

.hover\:bg-gray-50:hover{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(247 247 249 / var(--tw-bg-opacity)) !important
}

.hover\:bg-indigo-700:hover{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(41 77 106 / var(--tw-bg-opacity)) !important
}

.hover\:bg-transparent:hover{
  background-color: transparent !important
}

.hover\:text-gray-100:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(235 236 240 / var(--tw-text-opacity)) !important
}

.hover\:text-gray-300:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(180 183 198 / var(--tw-text-opacity)) !important
}

.hover\:text-gray-600:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(78 82 103 / var(--tw-text-opacity)) !important
}

.hover\:text-gray-700:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(61 65 81 / var(--tw-text-opacity)) !important
}

.hover\:text-gray-900:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(27 29 36 / var(--tw-text-opacity)) !important
}

.hover\:text-gray-990:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(9 10 15 / var(--tw-text-opacity)) !important
}

.hover\:text-white:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}

.hover\:text-yellow-600:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(202 138 4 / var(--tw-text-opacity)) !important
}

.hover\:underline:hover{
  text-decoration-line: underline !important
}

.hover\:no-underline:hover{
  text-decoration-line: none !important
}

.focus\:border-indigo-500:focus{
  --tw-border-opacity: 1 !important;
  border-color: rgb(11 59 97 / var(--tw-border-opacity)) !important
}

.focus\:border-primary-500:focus{
  --tw-border-opacity: 1 !important;
  border-color: rgb(11 59 97 / var(--tw-border-opacity)) !important
}

.focus\:no-underline:focus{
  text-decoration-line: none !important
}

.focus\:outline-none:focus{
  outline: 2px solid transparent !important;
  outline-offset: 2px !important
}

.focus\:ring-1:focus{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important
}

.focus\:ring-2:focus{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important
}

.focus\:ring-indigo-500:focus{
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(11 59 97 / var(--tw-ring-opacity)) !important
}

.focus\:ring-primary-500:focus{
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(11 59 97 / var(--tw-ring-opacity)) !important
}

.focus\:ring-offset-2:focus{
  --tw-ring-offset-width: 2px !important
}

.group:hover .group-hover\:text-gray-500{
  --tw-text-opacity: 1 !important;
  color: rgb(95 100 125 / var(--tw-text-opacity)) !important
}

.peer:checked ~ .peer-checked\:border-transparent{
  border-color: transparent !important
}

.peer:checked ~ .peer-checked\:bg-indigo-700{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(41 77 106 / var(--tw-bg-opacity)) !important
}

.peer:checked ~ .peer-checked\:ring-2{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important
}

.peer:checked ~ .peer-checked\:ring-indigo-500{
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(11 59 97 / var(--tw-ring-opacity)) !important
}

.dark .dark\:divide-gray-800 > :not([hidden]) ~ :not([hidden]){
  --tw-divide-opacity: 1 !important;
  border-color: rgb(44 47 58 / var(--tw-divide-opacity)) !important
}

.dark .dark\:divide-gray-900 > :not([hidden]) ~ :not([hidden]){
  --tw-divide-opacity: 1 !important;
  border-color: rgb(27 29 36 / var(--tw-divide-opacity)) !important
}

.dark .dark\:border-gray-600{
  --tw-border-opacity: 1 !important;
  border-color: rgb(78 82 103 / var(--tw-border-opacity)) !important
}

.dark .dark\:border-gray-700{
  --tw-border-opacity: 1 !important;
  border-color: rgb(61 65 81 / var(--tw-border-opacity)) !important
}

.dark .dark\:border-gray-800{
  --tw-border-opacity: 1 !important;
  border-color: rgb(44 47 58 / var(--tw-border-opacity)) !important
}

.dark .dark\:border-gray-990{
  --tw-border-opacity: 1 !important;
  border-color: rgb(9 10 15 / var(--tw-border-opacity)) !important
}

.dark .dark\:bg-black{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity)) !important
}

.dark .dark\:bg-gray-800{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity)) !important
}

.dark .dark\:bg-gray-900{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(27 29 36 / var(--tw-bg-opacity)) !important
}

.dark .dark\:bg-gray-950{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity)) !important
}

.dark .dark\:bg-gray-990{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(9 10 15 / var(--tw-bg-opacity)) !important
}

.dark .dark\:bg-primary-300{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(165 180 252 / var(--tw-bg-opacity)) !important
}

.dark .dark\:bg-primary-400{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(129 140 248 / var(--tw-bg-opacity)) !important
}

.dark .dark\:bg-transparent{
  background-color: transparent !important
}

.dark .dark\:text-gray-100{
  --tw-text-opacity: 1 !important;
  color: rgb(235 236 240 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-gray-200{
  --tw-text-opacity: 1 !important;
  color: rgb(213 215 223 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-gray-300{
  --tw-text-opacity: 1 !important;
  color: rgb(180 183 198 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-gray-400{
  --tw-text-opacity: 1 !important;
  color: rgb(135 140 164 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-gray-600{
  --tw-text-opacity: 1 !important;
  color: rgb(78 82 103 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-gray-900{
  --tw-text-opacity: 1 !important;
  color: rgb(27 29 36 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-primary-100{
  --tw-text-opacity: 1 !important;
  color: rgb(224 231 255 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-primary-300{
  --tw-text-opacity: 1 !important;
  color: rgb(165 180 252 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-primary-900{
  --tw-text-opacity: 1 !important;
  color: rgb(49 46 129 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-white{
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-yellow-500{
  --tw-text-opacity: 1 !important;
  color: rgb(234 179 8 / var(--tw-text-opacity)) !important
}

.dark .dark\:text-yellow-600{
  --tw-text-opacity: 1 !important;
  color: rgb(202 138 4 / var(--tw-text-opacity)) !important
}

.dark .dark\:ring-gray-900{
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(27 29 36 / var(--tw-ring-opacity)) !important
}

.dark .dark\:hover\:bg-gray-950:hover{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(19 20 25 / var(--tw-bg-opacity)) !important
}

.dark .hover\:dark\:bg-gray-800:hover{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(44 47 58 / var(--tw-bg-opacity)) !important
}

.dark .dark\:hover\:text-gray-100:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(235 236 240 / var(--tw-text-opacity)) !important
}

.dark .dark\:hover\:text-gray-700:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(61 65 81 / var(--tw-text-opacity)) !important
}

@media (min-width: 640px){
  .sm\:not-sr-only{
    position: static !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important
  }

  .sm\:col-span-10{
    grid-column: span 10 / span 10 !important
  }

  .sm\:col-span-2{
    grid-column: span 2 / span 2 !important
  }

  .sm\:col-span-4{
    grid-column: span 4 / span 4 !important
  }

  .sm\:col-span-6{
    grid-column: span 6 / span 6 !important
  }

  .sm\:col-span-8{
    grid-column: span 8 / span 8 !important
  }

  .sm\:mx-5{
    margin-left: 1.25rem !important;
    margin-right: 1.25rem !important
  }

  .sm\:ml-3{
    margin-left: 0.75rem !important
  }

  .sm\:ml-5{
    margin-left: 1.25rem !important
  }

  .sm\:ml-8{
    margin-left: 2rem !important
  }

  .sm\:mr-10{
    margin-right: 2.5rem !important
  }

  .sm\:mr-3{
    margin-right: 0.75rem !important
  }

  .sm\:mt-0{
    margin-top: 0px !important
  }

  .sm\:mt-1{
    margin-top: 0.25rem !important
  }

  .sm\:mt-6{
    margin-top: 1.5rem !important
  }

  .sm\:block{
    display: block !important
  }

  .sm\:flex{
    display: flex !important
  }

  .sm\:table-cell{
    display: table-cell !important
  }

  .sm\:\!grid{
    display: grid !important
  }

  .sm\:grid{
    display: grid !important
  }

  .sm\:hidden{
    display: none !important
  }

  .sm\:h-10{
    height: 2.5rem !important
  }

  .sm\:h-16{
    height: 4rem !important
  }

  .sm\:h-20{
    height: 5rem !important
  }

  .sm\:w-16{
    width: 4rem !important
  }

  .sm\:w-2\/5{
    width: 40% !important
  }

  .sm\:flex-shrink-0{
    flex-shrink: 0 !important
  }

  .sm\:\!grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important
  }

  .sm\:grid-cols-1{
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important
  }

  .sm\:grid-cols-12{
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important
  }

  .sm\:grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important
  }

  .sm\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important
  }

  .sm\:grid-cols-4{
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important
  }

  .sm\:flex-row{
    flex-direction: row !important
  }

  .sm\:flex-wrap{
    flex-wrap: wrap !important
  }

  .sm\:items-center{
    align-items: center !important
  }

  .sm\:justify-center{
    justify-content: center !important
  }

  .sm\:justify-between{
    justify-content: space-between !important
  }

  .sm\:\!gap-x-4{
    -moz-column-gap: 1rem !important;
         column-gap: 1rem !important
  }

  .sm\:\!gap-x-6{
    -moz-column-gap: 1.5rem !important;
         column-gap: 1.5rem !important
  }

  .sm\:gap-x-6{
    -moz-column-gap: 1.5rem !important;
         column-gap: 1.5rem !important
  }

  .sm\:space-x-6 > :not([hidden]) ~ :not([hidden]){
    --tw-space-x-reverse: 0 !important;
    margin-right: calc(1.5rem * var(--tw-space-x-reverse)) !important;
    margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse))) !important
  }

  .sm\:space-y-0 > :not([hidden]) ~ :not([hidden]){
    --tw-space-y-reverse: 0 !important;
    margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))) !important;
    margin-bottom: calc(0px * var(--tw-space-y-reverse)) !important
  }

  .sm\:rounded-lg{
    border-radius: 0.5rem !important
  }

  .sm\:rounded-b-lg{
    border-bottom-right-radius: 0.5rem !important;
    border-bottom-left-radius: 0.5rem !important
  }

  .sm\:border-b-0{
    border-bottom-width: 0px !important
  }

  .sm\:border-t{
    border-top-width: 1px !important
  }

  .sm\:p-6{
    padding: 1.5rem !important
  }

  .sm\:px-0{
    padding-left: 0px !important;
    padding-right: 0px !important
  }

  .sm\:px-5{
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important
  }

  .sm\:px-6{
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important
  }

  .sm\:px-8{
    padding-left: 2rem !important;
    padding-right: 2rem !important
  }

  .sm\:pt-0{
    padding-top: 0px !important
  }

  .sm\:text-sm{
    font-size: 0.875rem !important;
    line-height: 1.25rem !important
  }
}

@media (min-width: 768px){
  .md\:col-span-3{
    grid-column: span 3 / span 3 !important
  }

  .md\:col-span-6{
    grid-column: span 6 / span 6 !important
  }

  .md\:ml-6{
    margin-left: 1.5rem !important
  }

  .md\:ml-auto{
    margin-left: auto !important
  }

  .md\:mt-0{
    margin-top: 0px !important
  }

  .md\:\!block{
    display: block !important
  }

  .md\:\!inline{
    display: inline !important
  }

  .md\:flex{
    display: flex !important
  }

  .md\:grid{
    display: grid !important
  }

  .md\:hidden{
    display: none !important
  }

  .md\:max-w-screen-2xl{
    max-width: 1536px !important
  }

  .md\:grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important
  }

  .md\:grid-cols-24{
    grid-template-columns: repeat(24, minmax(0, 1fr)) !important
  }

  .md\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important
  }

  .md\:justify-between{
    justify-content: space-between !important
  }
}

@media (min-width: 1024px){
  .lg\:col-span-1{
    grid-column: span 1 / span 1 !important
  }

  .lg\:col-span-2{
    grid-column: span 2 / span 2 !important
  }

  .lg\:col-span-4{
    grid-column: span 4 / span 4 !important
  }

  .lg\:col-span-8{
    grid-column: span 8 / span 8 !important
  }

  .lg\:col-start-1{
    grid-column-start: 1 !important
  }

  .lg\:mt-0{
    margin-top: 0px !important
  }

  .lg\:inline-flex{
    display: inline-flex !important
  }

  .lg\:table-cell{
    display: table-cell !important
  }

  .lg\:grid{
    display: grid !important
  }

  .lg\:hidden{
    display: none !important
  }

  .lg\:w-1\/3{
    width: 33.333333% !important
  }

  .lg\:w-2\/3{
    width: 66.666667% !important
  }

  .lg\:flex-none{
    flex: none !important
  }

  .lg\:auto-rows-min{
    grid-auto-rows: min-content !important
  }

  .lg\:grid-cols-1{
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important
  }

  .lg\:grid-cols-12{
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important
  }

  .lg\:grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important
  }

  .lg\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important
  }

  .lg\:grid-cols-4{
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important
  }

  .lg\:grid-cols-5{
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important
  }

  .lg\:gap-6{
    gap: 1.5rem !important
  }

  .lg\:gap-8{
    gap: 2rem !important
  }

  .lg\:gap-x-8{
    -moz-column-gap: 2rem !important;
         column-gap: 2rem !important
  }

  .lg\:space-x-8 > :not([hidden]) ~ :not([hidden]){
    --tw-space-x-reverse: 0 !important;
    margin-right: calc(2rem * var(--tw-space-x-reverse)) !important;
    margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse))) !important
  }

  .lg\:px-8{
    padding-left: 2rem !important;
    padding-right: 2rem !important
  }
}

@media (min-width: 1280px){
  .xl\:table-cell{
    display: table-cell !important
  }

  .xl\:grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important
  }

  .xl\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important
  }

  .xl\:grid-cols-4{
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important
  }

  .xl\:grid-cols-5{
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important
  }
}

@media (min-width: 1536px){
  .\32xl\:col-span-2{
    grid-column: span 2 / span 2 !important
  }

  .\32xl\:col-span-3{
    grid-column: span 3 / span 3 !important
  }

  .\32xl\:col-span-4{
    grid-column: span 4 / span 4 !important
  }

  .\32xl\:col-span-6{
    grid-column: span 6 / span 6 !important
  }

  .\32xl\:grid-cols-4{
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important
  }

  .\32xl\:grid-cols-6{
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important
  }
}

.tickets a:hover {
    text-decoration:none !important;
}

.help-block {
   font-size: 10px !important;
   font-style: italic !important;
}

blockquote {
	border-left: 5px solid #d5d7df !important; 
	margin-bottom:10px !important; 
	margin-top:10px !important;
}

.hexa-content .container {width:100% !important;}

.store-promoted-product .btn {font-size: 0.75em !important;}
.store-order-container .btn {font-size: 0.75em !important;}




/* Estilos del acordeón */
.card {
  border: 1px solid #ddd;
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 5px;
  background: #fff;
}

.card-header-custom {
  background-color: #f7f7f7;
  color: #333;
  font-weight: bold;
  padding: 15px;
  border-bottom: 1px solid #ddd;
  cursor: pointer;
  transition: background-color 0.3s ease;
  position: relative; /* Necesario para posicionar el ícono a la derecha */
}

.card-header-custom:hover {
  background-color: #eaeaea; /* Color gris más claro al hacer hover */
}

.card-header-custom h3 {
  margin: 0;
  font-size: 1.1em;
}

.card-header-custom .toggle-icon {
  position: absolute;
  right: 15px;
  bottom: 18px;
  font-size: 1.2em;
  color: #0b3b61;
  transition: transform 0.3s ease; /* Animación para rotación */
}

.card-header-custom.collapsed .toggle-icon {
  transform: rotate(0deg); /* Ícono cuando el panel está cerrado */
}

.card-header-custom .toggle-icon {
  transform: rotate(180deg); /* Ícono cuando el panel está abierto */
}

.card-body-custom {
  background-color: #ffffff; /* Fondo blanco */
  color: #555;
  padding: 20px;
  font-size: 0.95em;
  border-top: 1px solid #ddd;
}

/* Estilo para la tabla de soporte */
.panel-support {
  background-color: #ffffff;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 15px;
}

.panel-support h3 {
  font-size: 1.2em;
  color: #333;
  margin-bottom: 15px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
}

#mySupport th {
  background-color: #f7f7f7;
  color: #555;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.85em;
  padding: 12px;
  border-bottom: 2px solid #ddd;
}

#mySupport td {
  padding: 12px;
  color: #333;
  font-size: 0.9em;
  border-bottom: 1px solid #eee;
}

#mySupport tr:hover {
  background-color: #f5f5f5; /* Color al hacer hover en la fila */
}

.label {
  padding: 4px 8px;
  border-radius: 3px;
  font-size: 0.85em;
  font-weight: 600;
}


/* Estilo para el contenedor de la tabla de facturas */
.panel-invoices {
  background-color: #ffffff;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 15px;
}

.panel-invoices h3 {
  font-size: 1.2em;
  color: #333;
  margin-bottom: 15px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
}

/* Estilos de la tabla de facturas */
#myInvoices {
  width: 100%;
  margin-bottom: 1rem;
  color: #333;
  border-collapse: collapse; /* Asegura que el borde se vea uniforme */
}

#myInvoices th, #myInvoices td {
  padding: 12px;
  vertical-align: middle;
  border-bottom: 1px solid #eee;
}

#myInvoices th {
  background-color: #f7f7f7;
  color: #555;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.85em;
  border-bottom: 2px solid #ddd;
}

#myInvoices tbody tr:hover {
  background-color: #f5f5f5; /* Color al hacer hover en la fila */
}

/* Etiquetas de estado para las facturas */
#myInvoices .label {
  padding: 4px 8px;
  border-radius: 3px;
  font-size: 0.85em;
  font-weight: 600;
}

#myInvoices .label-danger {
  color: #dc3545;
  background-color: #f8d7da;
}

#myInvoices .label-success {
  color: #28a745;
  background-color: #d4edda;
}

#myInvoices .label-warning {
  color: #ffc107;
  background-color: #fff3cd;
}

/* Estilos de botones en el pie de la tabla */
#myInvoices tfoot .btn {
  padding: 8px 16px;
  font-size: 0.9em;
  border-radius: 3px;
}




/* Estilos para el contenedor de anuncios */
.panel-announcements {
  background-color: #ffffff;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 15px;
}

.panel-announcements .panel-heading {
  font-size: 1.2em;
  color: #333;
  font-weight: bold;
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.panel-announcements .panel-heading .flip {
  display: flex;
}

.panel-announcements .panel-heading .flip a {
  color: #555;
  font-size: 1.1em;
  margin: 0 5px;
  transition: color 0.3s;
}

.panel-announcements .panel-heading .flip a:hover {
  color: #333;
}

.panel-announcements .panel-body {
  padding: 15px 0;
}

.panel-announcements .item {
  font-size: 0.95em;
  line-height: 1.5;
  color: #333;
  padding: 10px 20px;
  border-radius: 5px;
  background-color: #f9f9f9;
  margin-bottom: 10px;
}

.panel-announcements .item:hover {
  background-color: #f5f5f5;
}

.panel-announcements .item i {
  color: #0b3b61;
  margin-right: 8px;
  font-size: 1em;
}

.panel-announcements .date {
  color: #007bff;
  font-weight: bold;
  margin-right: 8px;
  text-decoration: none;
}

.panel-announcements .date:hover {
  color: #0056b3;
  text-decoration: underline;
}

/* Estilos del contenedor de servicios */
.panel-services {
  background-color: #ffffff !important;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 15px;
}

.panel-services h3 {
  font-size: 1.2em;
  color: #333;
  margin-bottom: 15px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
  display: flex;
  align-items: center;
}

.panel-services .icon-layers {
  color: #0b3b61;
  margin-right: 8px;
  font-size: 1.2em;
}

.panel-services .panel-body {
  padding: 15px !important;
  background-color: #f9f9f9 !important;
  border-radius: 5px !important;
  margin-bottom: 10px !important;
}

.panel-services .panel-footer {
  padding: 10px !important;
  background-color: #f7f7f7 !important;
  border-top: 1px solid #ddd !important;
  border-radius: 0 0 5px 5px !important;
  text-align: right !important;
}

.panel-services .bg-gray-50 {background:#fff !important;}
.panel-services div div:hover {background:#f5f5f5 !important;}


/* Estilos para el panel de dominio */
.panel-domain {
  background-color: #ffffff;
  padding: 5px;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 15px;
}

.panel-domain h3 {
  font-size: 1.2em;
  color: #333;
  margin-bottom: 15px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
  display: flex;
  align-items: center;
}

.panel-domain .icon-globe {
  color: #0b3b61;
  margin-right: 8px;
  font-size: 1.2em;
}

/* Estilos para el panel de FAQ */
.panel-faq {
  background-color: #ffffff;
  padding: 5px;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 15px;
}

.panel-faq h3 {
  font-size: 1.2em;
  color: #333;
  margin-bottom: 15px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
  display: flex;
  align-items: center;
}

.panel-faq .icon-book-open {
  color: #0b3b61;
  margin-right: 8px;
  font-size: 1.2em;
}


/* Estilos para el panel de accesos rápidos al servidor */
.panel-server-access {
  background-color: #ffffff;
  padding: 5px;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 15px;
}

.panel-server-access h3 {
  font-size: 1.2em;
  color: #333;
  margin-bottom: 15px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.panel-server-access .icon-rocket {
  color: #0b3b61;
  margin-right: 8px;
  font-size: 1.2em;
}

.progress-bar {background-color: #294054;}
.progress-mini, .progress-mini .progress-bar {height: 5px; margin-bottom: 0px;}
.server-actions {text-align: right;vertical-align: middle;}
.server-title a {font-size: 14px; color: #676a6c; font-weight: 600;}
.server-actions ul.dropdown-menu {z-index: 100000;}
.panel-title .bg-color-blue {color: #fff;border: 0;}
.server-actions input[type="submit"], .server-list input[type="button"]{font-family:FontAwesome, 'Abel', 'Open Sans', sans-serif !important;}

/* Estilos de la tabla de proyectos */
#myProjects th {
    background-color: #f7f7f7;
    color: #555;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85em;
    padding: 12px;
    border-bottom: 2px solid #ddd;
}

#myProjects td {
    padding: 12px;
    color: #333;
    font-size: 0.9em;
    border-bottom: 1px solid #eee;
}

#myProjects tr:hover {
    background-color: #f5f5f5;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    #myProjects th, #myProjects td {
        padding: 8px;
        font-size: 0.85em;
    }
}

/* Contenedor principal de la promoción */
.promo-container {
    position: relative;
    overflow: hidden;
    transition: max-height 0.5s ease, opacity 0.5s ease;
    max-height: 1000px; /* Ajusta esto a la altura máxima del contenedor */
    opacity: 1;
}

/* Controles del slider y botón de cierre */
.promotions-slider-control a {
    color: #333;
    margin-left: 10px;
    font-size: 18px;
    text-decoration: none;
}

/* Botón de cierre */
.promotions-slider-control .close-btn {
    color: #ff5f5f;
    font-size: 18px;
    cursor: pointer;
}

/* Tooltip personalizado */
.promotions-slider-control .close-btn:hover {
    color: #ff1a1a;
}

/* Animación de ocultación */
.promo-container.hide {
    max-height: 0; /* Colapsa el contenedor verticalmente */
    opacity: 0; /* Desvanece el contenedor */
    padding: 0; /* Quita el espacio extra */
}




/* Estilos para el botón de envío en el formulario .cyberpanel dentro de .module-client-area */
.module-client-area .cyberpanel input[type="submit"] {
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background-color: #007bff;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.3s ease;
    width: 100%;
    box-sizing: border-box;
    margin-top: 10px;
}

/* Hover para el botón del formulario .cyberpanel */
.module-client-area .cyberpanel input[type="submit"]:hover {
    background-color: #0056b3;
}

/* Estilos para los botones en el div.buttons */
.buttons .btn {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background-color: #28a745; /* Color verde para los botones de administración */
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.3s ease;
    margin-top: 5px;
    margin-right: 5px;
}

/* Hover para los botones en .buttons */
.buttons .btn:hover {
    background-color: #218838; /* Verde más oscuro en hover */
}

/* Icono dentro de los botones */
.buttons .btn i {
    margin-right: 8px; /* Espacio entre el icono y el texto */
    font-size: 16px; /* Ajuste de tamaño del icono si es necesario */
    color: #fff; /* Color del icono */
}

/* Ajustes de botones en pantallas móviles */
@media (max-width: 768px) {
    .module-client-area .cyberpanel input[type="submit"],
    .buttons .btn {
        font-size: 16px;
        padding: 12px 24px;
        width: 100%;
        margin-right: 0;
    }
}



.panel-footer {
    /*background-color: #f7f7f7;*/
    padding: 10px 15px;
    border-top: 1px solid #ddd;
    text-align: center;
    margin-top: 10px;
}

.card-body-custom .panel-body {padding: 5px;}




/**** CHECK ****/

/* General styles for the table */
.table-data {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 15px;
}

.table-data th,
.table-data td {
    padding: 12px 15px;
    border-bottom: 1px solid #ddd;
    vertical-align: middle;
    text-align: left;
    font-size: 0.9em;
}

/* Header row styles */
.table-data th {
    background-color: #f7f7f7;
    color: #555;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85em;
}

/* Row hover effect */
.table-data tr:hover {
    background-color: #f5f5f5;
}


/* Styles for specific columns */
.server-title a {
    font-weight: bold;
    color: #0b3b61;
    text-decoration: none;
}

.server-title a:hover {
    text-decoration: underline;
}

.server-actions .btn {
    font-size: 0.8em;
    padding: 4px 8px;
    margin-right: 4px;
}

.server-actions .btn-default {
    background-color: #e7e7e7;
    color: #333;
    border: 1px solid #ddd;
}

.server-actions .btn-info {
    background-color: #5bc0de;
    color: #fff;
}

.server-actions .btn-danger {
    background-color: #d9534f;
    color: #fff;
}

.progress-bar {background-color: #294054;}
.progress-mini, .progress-mini .progress-bar {height: 5px; margin-bottom: 0px;}
.server-actions {text-align: right;vertical-align: middle;}
.server-title a {font-size: 14px; color: #676a6c; font-weight: 600;}
.server-actions ul.dropdown-menu {z-index: 100000;}
.panel-title .bg-color-blue {color: #fff;border: 0;}
.server-actions input[type="submit"], .server-list input[type="button"]{font-family:FontAwesome, 'Abel', 'Open Sans', sans-serif !important;}


.btn-default {
    background: #6f7e8c !important;
    color: #fff !important;
    border-style: none !important;
}

.btn-xs, .btn-group-xs>.btn {
    padding: 3px 8px !important;
    font-size: 14px !important;
}

.footer506 {
    color: #b1b1b1;
}


/* Estilos para el botón de envío dentro de .cyberpanel */
.cyberpanel input[type="submit"] {
    background-color: #0b74de; /* Color de fondo */
    color: #ffffff; /* Color de texto */
    padding: 10px 20px; /* Espaciado interno */
    font-size: 0.9em; /* Tamaño de la fuente */
    font-weight: bold; /* Negrita */
    border: none; /* Sin borde */
    border-radius: 5px; /* Bordes redondeados */
    cursor: pointer; /* Cambia el cursor a pointer */
    transition: background-color 0.3s ease; /* Transición suave */
}

/* Efecto hover */
.cyberpanel input[type="submit"]:hover {
    background-color: #095bb5; /* Color de fondo al hacer hover */
}

/* Efecto activo */
.cyberpanel input[type="submit"]:active {
    background-color: #074b91; /* Color de fondo al hacer clic */
    transform: scale(0.98); /* Efecto de "presionado" */
}

/**** PANELES ****/

.swiper-container {
    width: 100%;
    height: auto;
}

.swiper-slide {
    display: flex;
    justify-content: center;
}


@media (min-width: 768px) {
    .swiper-container {
        display: none;
    }
}

@media (max-width: 767px) {
    .info-panels {
        display: none;
    }
}





/* Animation for Entrance */
@keyframes slideIn {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.alert {
    animation: slideIn 0.4s ease-out;
}


.well-sm {
    padding: 6px !important;
}


/* Telefonos */
.input-group .intl-tel-input,
.input-group .iti {
    display: flex;
    align-items: center;
    width: 100%;
    position: relative;
}

.input-group .intl-tel-input {
    z-index: 3; 
}

.intl-tel-input .country-list,
.iti .iti__country-list {
    position: absolute;
    z-index: 999;
    width: 300px;
    max-height: 200px;
    overflow-y: auto;
}

.intl-tel-input .flag-container,
.iti .iti__flag-container {
    position: absolute;
    z-index: 4;
}

.intl-tel-input input,
.iti input {
    position: relative;
    z-index: 2;
    height: 34px;
    line-height: 1.5;
    padding-left: 93px;
}

.intl-tel-input.separate-dial-code.iti-sdc-4 .selected-flag,
.iti.iti--separate-dial-code .iti__selected-flag {
    z-index: 4;
}

.input-group-addon .fas.fa-phone,
.input-group-addon .fab.fa-whatsapp {
    line-height: 1;
    vertical-align: middle;
    font-size: 18px;
    display: flex;
    align-items: center;
    z-index: 4;
}

.intl-tel-input .country-list.dropup,
.iti .iti__country-list.iti__dropup {
    bottom: 100%;
    top: auto;
}

.input-group-addon {
    position: relative;
    z-index: 4;
}