/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */
@font-face {
    font-family: 'Cairo';
    src: url('../fonts/Cairo-Regular.woff2') format('woff2'),
         url('../fonts/Cairo-Regular.woff') format('woff'),
         url('../fonts/Cairo-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Almarai';
    src: url('../fonts/Almarai-Regular.woff2') format('woff2'),
         url('../fonts/Almarai-Regular.woff') format('woff'),
         url('../fonts/Almarai-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

:root{
    /* Reeras brand tokens — Six structure, Reeras style */
    --theme-primary-color: #00a1d3;
    --theme-primary-hover: #0089b4;
    --theme-primary-pressed: #005674;
    --theme-primary-light-color: #effaff;
    --theme-primary-25: #f4fbff;
    --theme-primary-500: #00c1fb;
    --theme-secondary-color: #0089b4;
    --theme-white: #ffffff;
    --theme-black: #181a1a;
    --theme-headline: #003245;
    --theme-headline-secondary: #494e4f;
    --theme-body: #494e4f;
    --theme-body-secondary: #61686a;
    --theme-muted: #949b9d;
    --theme-border: #e4e6e7;
    --theme-border-soft: #f1f2f2;
    --theme-surface: #fafafa;
    --theme-surface-muted: #f7f8f8;
    --theme-page: #ffffff;
    --theme-success: #067647;
    --theme-warning: #b54708;
    --theme-error: #b42318;
    --theme-font: "Rubik", "Almarai", ui-sans-serif, system-ui, sans-serif;
    --theme-radius-btn: 20px;
    --theme-radius-card: 16px;
    --theme-fs-display: 24px;
    --theme-fs-title: 16px;
    --theme-fs-body: 14px;
    --theme-fs-secondary: 13px;
    --theme-fs-caption: 12px;
}

/* Global */

html {
    font-size: 16px !important;
}

body{
    font-family:var(--theme-font) !important;
    background:var(--theme-page);
    color: var(--theme-body);
    font-size: var(--theme-fs-body);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}
body, button, input, select, textarea,
.btn, .form-control, .panel, .table, .label, .badge,
.navbar, .dropdown-menu, .list-group, .modal {
  font-family: var(--theme-font) !important;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--theme-font) !important;
    font-weight: 600 !important;
    color: var(--theme-headline);
    text-transform: none !important;
    letter-spacing: 0;
}
.client-alerts{
      font-family: var(--theme-font);
}
.dropdown-toggle i, 
#accountNotifications i{
    font-size: 20px !important;
}



.navbar-header{
    display:none;
}

.primary-action a{
    text-align:right;
}
.row{
    margin-right:auto !important;
    margin-left:auto !important;
    
}
a {
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
    color:var(--theme-primary-color) ;
}
a:hover{
    color:var(--theme-black) !important;
}
.fs-14{
    font-size:14px !important;
}
.gap-15{
    gap:15px
}
.gap-7{
    gap:7px
}

.h-90{
    height:90%;
}
.w-full{
    width:100% !important;
}
.h-full{
    height:100% !important;
}
.text-white{
    color:white !important;
}
.mt-10{
    margin-top: 10px;
}
.d-none{
    display:none;
}
.d-block{
    display:block;
}
.mb-10{
    margin-bottom:10px !important;
}
.d-flex{
    display:flex !important;
}
.justify-content-evenly{
    
justify-content: space-evenly;
}

.flex-row{
    flex-direction :row !important;
}
.justify-content-between{
    
justify-content: space-between;
}
.justify-content-center{
    
justify-content: center;
}

.align-items-center{
    align-items: center;
}

.flex-column{
flex-direction: column;
}

.align-items-start{
    align-items: start;
}
.flex-wrap{
    flex-wrap: wrap;
}
.mb-0{
    margin-bottom: 0;
}
.py-15{
    padding-top: 15px;
    padding-bottom: 15px;
}
.py-12{
    padding-top: 12px;
    padding-bottom: 12px;
}
.p-25{
    padding:25px;
}
.p-0{
    padding:0 !important;
}
.px-0{
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.px-5{
    padding-left: 5px !important;
    padding-right: 5px !important;
}
.px-15{
    padding-left: 15px;
    padding-right: 15px;
}
.px-35{
    padding-left: 35px;
    padding-right: 35px;
}
.pr-15{

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

}
.px-30{
    padding-left: 30px;
    padding-right: 30px;
}
.px-20{
    padding-left: 20px;
    padding-right: 20px;
}

.p-10{
    padding:10px !important;
}

.rounded-10{
    border-radius:10px !important;
}

.bg-white{
    background:white !important;
}

.border-none{
    border:none;
}

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

.card-border{

    border: 1px solid #D9DDDC !important;
}

.cursor-pointer{
    cursor:pointer;
}
.mx-auto{
    margin-right:auto;
    margin-left:auto;
}

.min-h-200 .panel{
    min-height:200px;
}

.text-center{
    text-align:center !important;
}
.text-black{
    color:black !important;
}
.relative{
    position: relative;
}
.absolute{
    position: absolute;
}
i{
    color :var(--theme-primary-color) !important;
}
.btn{
    border-radius:4px !important;
}

.btn:focus{
    outline : none !important;
}
.btn i{
    color :var(--theme-white) !important;
}

.menu-btn{
    background:transparent;
}
.menu-btn i{
  color :var(--theme-primary-color) !important;
}
:root {
  --bs-breakpoint-sm: 576px;
  --bs-breakpoint-md: 768px;
  --bs-breakpoint-lg: 992px;
  --bs-breakpoint-xl: 1200px;
  --bs-breakpoint-xxl: 1400px;
}



[class^="col-"] {
  padding-right: 0px;
  padding-left: 0px;
  flex: 1;
}
@media(min-width:768px){
[class^="col-"] {
  padding-right: 15px;
  padding-left: 15px;
  flex: 1;
}
}
.col-1 { flex: 0 0 8.33%; max-width: 8.33%; }
.col-2 { flex: 0 0 16.66%; max-width: 16.66%; }
.col-3 { flex: 0 0 25%; max-width: 25%; }
.col-4 { flex: 0 0 33.33%; max-width: 33.33%; }
.col-5 { flex: 0 0 41.66%; max-width: 41.66%; }
.col-6 { flex: 0 0 50%; max-width: 50%; }
.col-7 { flex: 0 0 58.33%; max-width: 58.33%; }
.col-8 { flex: 0 0 66.66%; max-width: 66.66%; }
.col-9 { flex: 0 0 75%; max-width: 75%; }
.col-10 { flex: 0 0 83.33%; max-width: 83.33%; }
.col-11 { flex: 0 0 91.66%; max-width: 91.66%; }
.col-12 { flex: 0 0 100%; max-width: 100%; }

@media (min-width: 576px) { /* Small (sm) */
  .col-sm-1 { flex: 0 0 8.33%; max-width: 8.33%; }
  .col-sm-2 { flex: 0 0 16.66%; max-width: 16.66%; }
  .col-sm-3 { flex: 0 0 25%; max-width: 25%; }
  .col-sm-4 { flex: 0 0 33.33%; max-width: 33.33%; }
  .col-sm-5 { flex: 0 0 41.66%; max-width: 41.66%; }
  .col-sm-6 { flex: 0 0 50%; max-width: 50%; }
  .col-sm-7 { flex: 0 0 58.33%; max-width: 58.33%; }
  .col-sm-8 { flex: 0 0 66.66%; max-width: 66.66%; }
  .col-sm-9 { flex: 0 0 75%; max-width: 75%; }
  .col-sm-10 { flex: 0 0 83.33%; max-width: 83.33%; }
  .col-sm-11 { flex: 0 0 91.66%; max-width: 91.66%; }
  .col-sm-12 { flex: 0 0 100%; max-width: 100%; }
}

@media (min-width: 768px) { /* Medium (md) */
  .col-md-1 { flex: 0 0 8.33%; max-width: 8.33%; }
  .col-md-2 { flex: 0 0 16.66%; max-width: 16.66%; }
  .col-md-3 { flex: 0 0 25%; max-width: 25%; }
  .col-md-4 { flex: 0 0 33.33%; max-width: 33.33%; }
  .col-md-5 { flex: 0 0 41.66%; max-width: 41.66%; }
  .col-md-6 { flex: 0 0 50%; max-width: 50%; }
  .col-md-7 { flex: 0 0 58.33%; max-width: 58.33%; }
  .col-md-8 { flex: 0 0 66.66%; max-width: 66.66%; }
  .col-md-9 { flex: 0 0 75%; max-width: 75%; }
  .col-md-10 { flex: 0 0 83.33%; max-width: 83.33%; }
  .col-md-11 { flex: 0 0 91.66%; max-width: 91.66%; }
  .col-md-12 { flex: 0 0 100%; max-width: 100%; }
}

@media (min-width: 992px) { /* Large (lg) */
  .col-lg-1 { flex: 0 0 8.33%; max-width: 8.33%; }
  .col-lg-2 { flex: 0 0 16.66%; max-width: 16.66%; }
  .col-lg-3 { flex: 0 0 25%; max-width: 25%; }
  .col-lg-4 { flex: 0 0 33.33%; max-width: 33.33%; }
  .col-lg-5 { flex: 0 0 41.66%; max-width: 41.66%; }
  .col-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .col-lg-7 { flex: 0 0 58.33%; max-width: 58.33%; }
  .col-lg-8 { flex: 0 0 66.66%; max-width: 66.66%; }
  .col-lg-9 { flex: 0 0 75%; max-width: 75%; }
  .col-lg-10 { flex: 0 0 83.33%; max-width: 83.33%; }
  .col-lg-11 { flex: 0 0 91.66%; max-width: 91.66%; }
  .col-lg-12 { flex: 0 0 100%; max-width: 100%; }
}

.navbar-main{
    font-family: var(--theme-font)
}

.bg-primary{
    background-color: var(--theme-primary-color);
    color:var(--theme-white);
}
.breadcrumb{
    margin-bottom:0;    
}
/* Header css */
section#header{
    padding:15px 0;
}

.navbar{
    min-height: 0 !important;
    padding:0 !important;
}
.main-navbar{
        padding: 15px 0 !important;
    margin: 0;
    color: #000;
    background: white;
}

.main-navbar .navbar-nav>.active>a{
        color: #555 !important;
    background-color: white;
}

.main-navbar .navbar-nav>li>a{
    color:#111;
}
.main-navbar .navbar-nav>li>a:hover{
    background:#fff;
}

.main-navbar .navbar-nav{
    margin:0 30px !important;
}
.main-navbar .navbar-header{
    display:flex;
    justify-content:center;
    align-items:center;
}
.logo img{
    width:150px;
}



.open>.mega-dropdown{
    display:flex;
    flex-direction:column;
}

@media (min-width: 992px) {
    
.open>.mega-dropdown{
    display:flex;
    flex-direction:row;
}
}
.mega-dropdown{
    padding:20px;
}
.mega-dropdown li p{
    color :#006685;
    font-size: 20px;
    font-weight: 600;
    
}

@media (max-width: 768px) {
.mega-dropdown li p{
    font-size: 16px;
}
  
}
.mega-dropdown li ul{
        padding: 0;
    list-style: none;
}
.mega-dropdown li ul li {
    margin-bottom:7px;
    
}
.mega-dropdown li ul li a{
    color : #000;
    font-weight: 400;
}
.mega-dropdown li ul li:hover a{
    color : #006685 !important;
    text-decration : none !important
}

.mega-dropdown-item{
    min-width:250px;
}
.navbar-main .navbar-nav > .active > a, .navbar-main .navbar-nav > .active > a:focus, .navbar-main .navbar-nav > .active > a:hover, .navbar-main .navbar-nav > .open > a, .navbar-main .navbar-nav > .open > a:focus, .navbar-main .navbar-nav > .open > a:hover, .navbar-main .navbar-nav > li > a:focus, .navbar-main .navbar-nav > li > a:hover{
    background-color: var(--theme-secondary-color);
    color:var(--theme-white) !important;
}

.navbar-main .navbar-nav .dropdown-menu > .active > a, .navbar-main .navbar-nav .dropdown-menu > .active > a:focus, .navbar-main .navbar-nav .dropdown-menu > .active > a:hover, .navbar-main .navbar-nav .dropdown-menu > .open > a, .navbar-main .navbar-nav .dropdown-menu > .open > a:focus, .navbar-main .navbar-nav .dropdown-menu > .open > a:hover, .navbar-main .navbar-nav .dropdown-menu > li > a:focus, .navbar-main .navbar-nav .dropdown-menu > li > a:hover{
      background-color: var(--theme-primary-color);
    color:var(--theme-white) !important;
}

.main-menu{
    display:none;
}

.navbar-main li.account{
     background-color: var(--theme-secondary-color);
}
ul.top-nav{
    margin-top:5px;
}
ul.top-nav li a{
    font-weight: 500;
    color: var(--theme-black)000;
}
.ml-25{
    margin-left: 25px;
}

.navbar-main .navbar-nav > li > a{
    padding-top: 20px;
padding-bottom: 20px;
}


.popover-user-notifications{
    border:2px solid var(--theme-primary-color) 111;
}
.popover.bottom > .arrow::after {
    top:2px;
}
.popover.bottom > .arrow{
    border-bottom-color: var(--theme-primary-color) ;
}
.popover-user-notifications ul li{
    border-bottom:2px solid var(--theme-primary-color) ;
    
}
.popover-user-notifications{
    padding:0;
}
ul.top-nav > li.primary-action{
    padding-left: 0;
border-left: 0;
}
ul.top-nav > li.primary-action > a.btn{
    
    padding: 5px 20px;
color: var(--theme-black);
border: 2px solid var(--theme-primary-color) ;
background:var(--theme-white);
border-radius:10px;
}
ul.top-nav > li.primary-action > a.btn:hover{
    background:var(--theme-primary-color) ;
    color:var(--theme-white) !important;
}
.dropdown-menu{
    border:0px;
}
.language-popover .popover-content ul{
    margin:0;
}

.language-popover .popover-content li{
    float: none;
width: 100%;
display: block;
}
.language-popover{
    
    background:var(--theme-primary-color) ;
    max-width: 150px;
    text-align: center;
}

.language-popover.popover.bottom>.arrow:after{
    border-bottom-color:var(--theme-primary-color) ;
}
.language-popover .popover-content li{
    
    padding: 0 20px 0 ;
}
.popover-user-notifications ul li i.far.fa-exclamation-circle, .popover-user-notifications ul li i.fas.fa-exclamation-circle{
    color:#ec2d45 !important;
    
}

.services-drop-down h6{
     font-size: 20px !important;
    font-weight: 600 !important;
    color:#006685 !important;
}
@media (max-width: 768px) {
.services-drop-down h6{
     font-size: 16px !important;
}
  
}

.services-drop-down .dropdown-item:hover{
    text-decoration : none !important;
    color:#155F70 !important;
    
}
.logincontainer{
        background: white !important;
        max-width: 775px !important;
            padding: 20px 10px !important;
}

@media(min-width:768px){
.logincontainer{
     
        padding: 40px !important;
}

}
.logincontainer div.header-lined h1{
    border:none;
    color:var(--theme-primary-color) ;
    font-weight:800;
}

.login-flex{
    display:flex;
    flex-direction:row;
}
.login-logo-container , 
.login-logo-container-sm{
    width:150px;
    margin:auto;
    margin-bottom:15px;
}

@media(min-width:768px){
.login-logo-container-sm{
  display:none;
}
}
    
@media(max-width:768px){
.login-logo-container{
  display:none;
}
    
.login-flex{
    flex-direction:column;
}
}

.login-logo{
    width:100%;
}
/* Home Page */
#welcome div.header-lined h1{
    border:none;
    color:var(--theme-white) !important;
    font-weight:800;
}

.tiles .tile .highlight{
    display:none;
}
.tiles .tile {
    border: none;
    padding: 0 15px 15px;
    background: none;
    text-align: center;
    border-bottom : 0 !important;
}
.tiles .tile:hover{
    background:none
}
.tiles .tile a{
    background:var(--theme-white);
    text-align:center;
    padding: 40px 0;
    border-radius:25px;
    display:block;
}
.tiles .tile a:hover{
    
    background:var(--theme-primary-color) ;
}
.tiles .tile a:hover .stat,
.tiles .tile a:hover .title
{
    color:var(--theme-white);
}
.tile .stat{
 font-weight: 800;
margin: 0;
font-size: 25px;
color: var(--theme-black) ;
}

@media (max-width: 768px) {
    .tile .stat{
    font-size: 18px;
    }
}
.tile .title {
    font-size: 18px;
    font-weight: 800;
    color: #718EBF;
}

@media (max-width: 768px) {
    .tile .title {
        font-size: 16px;
    }
      
}

.tile .icon{
    width: 55px;
    height: 55px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.tile .icon i{
    font-size:20px;
}

.tiles .tile:nth-child(1) .icon{
    background: #DCFAF8;
}

.tiles .tile:nth-child(1) .icon i {
    color: #16DBCC !important;
}

.tiles .tile:nth-child(2) .icon{
    background: #FFE0EB;
}

.tiles .tile:nth-child(2) .icon i {
    color: #FF82AC !important;
}
.tiles .tile:nth-child(3) .icon{
    background: #E7EDFF;
}

.tiles .tile:nth-child(3) .icon i {
    color: #396AFF !important;
}
.tiles .tile:nth-child(4) .icon{
    background: #FFF5D9;
}

.tiles .tile:nth-child(4) .icon i {
    color: #FFBB38 !important;
}

.tiles {
    margin: 0 0 25px;
}
div.header-lined .breadcrumb li a{
     color: var(--theme-white) !important;
}

div.header-lined .breadcrumb > .active{
    color: var(--theme-white);
}

.panel-sidebar {
    border: var(--theme-primary-color) 2px solid;
}

.panel-sidebar .btn-success{
    border-radius:10px !important;
}
.panel-sidebar > .panel-heading{
    background:var(--theme-white);
    color:var(--theme-black);
    cursor: pointer;
    user-select: none;
}
 .panel-title{
     
    color:#232323 !important;
     
 }
.panel-sidebar .panel-title{
    color:var(--theme-primary-color) !important;
    font-weight:800;
}

.panel-sidebar > .panel-footer{
    background:var(--theme-white);
    color:var(--theme-black);
}

#servicesPanel{
    background-color: transparent;
    border:none;
    border-top:none !important;
    box-shadow:none !important;
}
#servicesPanel .list-group{
    max-height:350px;
    overflow-y:scroll;
}
#servicesPanel .list-group-item{
       background-color: white;
    border: none;
    border-radius: 20px;
    margin-bottom: 20px;
}
#servicesPanel .list-group-item .div-service-name{
    font-size:16px;
    margin-bottom:10px;
}

#servicesPanel .div-service-buttons{
    display:none !important;
}
#servicesPanel .div-service-item>div{
    width:100% !important;
}

@media (max-width: 768px) {
#servicesPanel .list-group-item .div-service-name{
    font-size:14px;

}
  
}
#servicesPanel .list-group-item .div-service-name span{
    display:block;
}
#servicesPanel .list-group-item .div-service-status .label{
    background-color:transparent !important;
    color:#16DBAA !important;
    font-size:16px !important;
    padding:0 !important;
}

@media (max-width: 768px) {
#servicesPanel .list-group-item .div-service-status .label{
    font-size:14px !important;
}
  
}
#servicesPanel .list-group-item .div-service-status .label-placeholder{
    display:none;
}
#servicesPanel .panel-footer{
    display: none;
}
#servicesPanel .panel-title{
    color: #333B69 !important;
    font-size:22px;
    font-weight:700;
}
@media (max-width: 768px) {
    #servicesPanel .panel-title{
        font-size:16px;
    }
  
}
#servicesPanel .panel-title .fa-cube{
    display:none;
}
#servicesPanel .panel-title .pull-right a{
     color: var(--theme-primary-color) !important;
    background: transparent;
    border: none;
    font-size: 14px;
    font-weight:400;
}

@media (max-width: 768px) {
#servicesPanel .panel-title .pull-right a{
  
    font-size: 12px;
 
}
  
}
#registerDomainPanel {
    padding: 0 !important;
    overflow: hidden;
}

#registerDomainPanel .panel-body,
#registerDomainPanel > form,
#registerDomainPanel .input-group {
    margin: 0 !important;
    padding: 16px !important;
}

#registerDomainPanel .input-group {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 10px;
    width: 100%;
}

#registerDomainPanel .input-group .form-control {
    float: none !important;
    flex: 1 1 180px;
    width: auto !important;
    max-width: none !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 10px 14px !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: none !important;
    color: var(--theme-black) !important;
    font-family: var(--theme-font) !important;
    font-size: 14px !important;
    text-align: start;
}

#registerDomainPanel .input-group .form-control::placeholder {
    color: var(--theme-muted) !important;
    opacity: 1;
}

#registerDomainPanel .input-group .form-control:focus {
    border-color: var(--theme-primary-color) !important;
    box-shadow: 0 0 0 3px rgba(0, 161, 211, 0.12) !important;
}

#registerDomainPanel .input-group-btn {
    float: none !important;
    display: flex !important;
    flex: 0 0 auto;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 8px;
    font-size: inherit !important;
}

#registerDomainPanel .input-group-btn .btn,
#registerDomainPanel .input-group-btn .btn-success,
#registerDomainPanel .input-group-btn .btn-default {
    float: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 88px;
    min-height: 44px;
    margin: 0 !important;
    padding: 8px 18px !important;
    border-radius: var(--theme-radius-btn) !important;
    border-style: solid !important;
    box-shadow: none !important;
    font-family: var(--theme-font) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-shadow: none !important;
}

#registerDomainPanel .input-group-btn .btn-success {
    background-color: var(--theme-primary-color) !important;
    border-width: 0 0 3px 0 !important;
    border-color: var(--theme-primary-500) !important;
    color: #fff !important;
}

#registerDomainPanel .input-group-btn .btn-success:hover {
    background-color: var(--theme-primary-hover) !important;
    color: #fff !important;
}

#registerDomainPanel .input-group-btn .btn-default {
    background-color: transparent !important;
    border-width: 1px 0 3px 0 !important;
    border-color: var(--theme-primary-500) !important;
    color: var(--theme-primary-color) !important;
}

#registerDomainPanel .input-group-btn .btn-default:hover {
    background-color: var(--theme-primary-light-color) !important;
    color: var(--theme-primary-hover) !important;
}

@media (max-width: 767px) {
    #registerDomainPanel .input-group {
        flex-direction: column !important;
    }

    #registerDomainPanel .input-group .form-control,
    #registerDomainPanel .input-group-btn,
    #registerDomainPanel .input-group-btn .btn {
        width: 100% !important;
    }

    #registerDomainPanel .input-group-btn {
        flex-direction: column;
    }
}


#ticketsPanel .list-group .label{
    background-color:transparent !important;
    color: #888 !important;
}
.btn-custom-action{
    transition:300ms;
}
.btn-custom-action:hover{
    color:white;
    background-color:var(--theme-primary-color);
}



section#welcome{
 background-image: linear-gradient(180deg, #155F70 0%, #4C9AB9 100%);
    padding: 20px;
    text-align:center;
}


/* Default styles for large screens (applies to large screens and up) */
section#main-body {
    padding-top: 60px !important;
    padding: 0px 80px;
    background-color: #ffffff;
}

/* Styles for small screens (smaller than 992px) */
@media (max-width: 991px) {
    section#main-body {
        padding: 20px; /* Reduce padding for better fit */
    }
}

/* Styles for extra-small screens (mobile devices) */
@media (max-width: 576px) {
    section#main-body {
            padding-top: 10px !important;
        padding: 10px; /* Even smaller padding for very small screens */
    }
}

.client-home-panels .panel{
    border:1px solid var(--theme-primary-light-color) ;
    border-radius:20px;
}

.client-home-panels .panel > .panel-heading .panel-title .btn{
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 32px;
    padding: 4px 12px !important;
    color: var(--theme-primary-color) !important;
    background-color: transparent !important;
    border-width: 1px 0 3px 0 !important;
    border-style: solid !important;
    border-color: var(--theme-primary-500) !important;
    border-radius: var(--theme-radius-btn) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

.client-home-panels .panel > .panel-heading .panel-title .btn[class*="bg-color-"] {
    background-color: transparent !important;
    background-image: none !important;
}

@media (max-width: 768px) {
    .client-home-panels .panel > .panel-heading .panel-title .btn{
        font-size: 11px !important;
        min-height: 30px;
        padding: 3px 10px !important;
    }
}
.client-home-panels .panel>.panel-body{
    color:#343C6A !important;
    font-size:15px;
}

@media (max-width: 768px) {
  
.client-home-panels .panel>.panel-body{
    font-size:12px;
}
}
.client-home-panels .panel > .panel-body p {
    padding: 20px;
}
.client-home-panels .panel > .panel-body p:last-child{
    margin-bottom:0;
}
.client-home-panels .panel > .list-group .list-group-item{
    padding: 4px 20px
}

.panel-title{
    font-weight:800;
    
}
.client-home-panels .panel > .panel-heading .panel-title .btn:hover{
    color: var(--theme-primary-hover) !important;
    background-color: var(--theme-primary-light-color) !important;
    border-color: var(--theme-primary-500) !important;
}

.client-home-panels .panel > .panel-heading .panel-title .btn i {
    color: var(--theme-primary-color) !important;
    margin: 0 !important;
}

.client-home-panels .panel > .panel-heading .panel-title .btn:hover i {
    color: var(--theme-primary-hover) !important;
}

.panel-sidebar{
    border-radius:20px;
}
.panel-heading,
.panel-body,
.panel-footer{
    padding: 20px;
    border-radius: 0;
}


.client-home-panels .panel > .panel-footer{
    display:none;
}


.home-kb-search .form-control{
    font-size:16px !important;
}
@media (max-width: 768px) {
  
.home-kb-search .form-control{
    font-size:12px !important;
}
}

.home-kb-search .form-control{
    border:2px solid var(--theme-primary-color) ;
    color:var(--theme-black);
        border: none !important;
    border-radius: 10px;
    background-color: #fff !important;
}
.panel-sidebar .panel-minimise{
    color: var(--theme-primary-color) ;
}

.home-kb-search .form-control:focus{
    border-color:var(--theme-primary-color);
}



section#footer{
    color:var(--theme-white);
    background-color:transparent;
    background-image: linear-gradient(180deg, #155F70 0%, #4C9AB9 100%);
    padding: 40px 0;
}
section#footer .mb-5{
    margin-bottom :15px;
}

section#footer .container{
    display:flex;
    justify-content: space-between;
    align-items:start;
    
}
section#footer .col-md-4{
    padding: 10px;
}

section#footer .col-md-4 ul{
    padding: 0;
     list-style-type: none;
}

section#footer .col-md-4 ul li{
    margin-top: 5px;
}

section#footer .col-md-4 ul li a{
    display: block;
    width : 100%;
    color: var(--theme-white);
    transition : 0.1s;
    font-size: 15px;
    font-weight: 500;
    text-decoration : none;
}

@media (max-width: 768px) {
section#footer .col-md-4 ul li a{
    font-size: 12px;
}
  
}

section#footer .col-md-4 ul li a i{
    font-size: 14px;
    width: 1.25em;
    color : var(--theme-white) !important;
}
@media (max-width: 768px) {
  
section#footer .col-md-4 ul li a i{
    font-size: 12px;

}
}


section#footer .title{
    font-size: 27px;
    font-weight: 600;
}
@media (max-width: 768px) {
section#footer .title{
    font-size: 18px;

}
  
}
.social-icons {
    gap: 20px
}
section#footer .social-icon{
    font-size: 18px !important;
    width: 1.25em;
    color : var(--theme-white) !important;
}

@media (max-width: 768px) {
section#footer .social-icon{
    font-size: 16px !important;

}
  
}

@media(min-width :768px){
    
    
.ticket-btn-wrapper{
    text-align:center;
}
}
.ticket-btn{
    border: 1px solid var(--theme-white);
    border-radius: 28px;
    padding: 10px 30px;
}

.ticket-btn:hover{
    background-color: #155F70;
    color: white !important;
}
.text-white{
    color:white;
}
.text-decoration-none{
        text-decoration : none;
}
.copy-rights{
    padding: 20px 0;
    color:var(--theme-primary-color);
}



.client-home-panels .panel > .panel-heading{
    background-color: var(--theme-white);
    color: var(--theme-black);
    overflow:hidden;
    border:none;
    border-radius: 0;
}
.client-home-panels .panel > .list-group{
border:none;
padding-bottom:20px;
}

.panel > .list-group .list-group-item, .panel > .panel-collapse > .list-group .list-group-item{
    border-width:  0;
}

a.list-group-item, button.list-group-item{
    color:var(--theme-black);
}

.panel-sidebar .list-group{
    padding-bottom:20px;
}


.list-group-item {
    padding: 7px 20px;
}


section#footer .back-to-top i{
    background:var(--theme-white);
    color:var(--theme-black);
    border-radius: 100px;
    opacity:1;
}

.client-home-panels .panel > .panel-body .margin-10 .btn-success{
    background:var(--theme-primary-color) ;
    border-color:var(--theme-primary-color) ;
}
.client-home-panels .panel > .panel-body .margin-10 .btn-success:hover{
    background:var(--theme-primary-color);
    border-color:var(--theme-primary-color);
}

.panel-sidebar a.list-group-item.active, .panel-sidebar a.list-group-item.active:focus, .panel-sidebar a.list-group-item.active:hover{
   background:var(--theme-primary-color) ;
   border-color:var(--theme-primary-color) ;
}

.panel-sidebar a.list-group-item.active:hover{
    color:white !important;
}
div.credit-card{
    border:2px solid var(--theme-primary-color) ;
    border-radius:0;
    background: var(--theme-white);
}
.alert{
    border-radius:0;
    border-width:0;
}
.progress{
    border-radius:100px;
    box-shadow: none;
}

.panel > .list-group:last-child .list-group-item:last-child, .panel > .panel-collapse > .list-group:last-child .list-group-item:last-child{
    border-radius:0;
}


.list-group-item .badge{
    color:var(--theme-primary-color) ;
}

.panel-sidebar.view-filter-btns .list-group-item.active, .panel-sidebar.view-filter-btns .list-group-item.active:focus, .panel-sidebar.view-filter-btns .list-group-item.active:hover{
    background:var(--theme-primary-color);
    color:var(--theme-white);
}
.badge{
    border-radius:100px;
}

.list-group-item.active > .badge, .nav-pills > .active > a > .badge{
    color:var(--theme-primary-color);
}
.sidebar .list-group-item .badge{
    margin-top:0;
}
.panel{
    border:1px solid var(--theme-primary-light-color) ;
    border-top :1px solid var(--theme-primary-light-color)  !important;
}
.panel-default > .panel-heading{
    background:none;
    border:none;
}

body #order-standard_cart .products .product{
     border:2px solid var(--theme-primary-color) ;
      padding:40px;
}
body #order-standard_cart .products .product header{
    padding: 0;
    background:none;
    border:none;
    text-align:center;
    margin-bottom:40px;
    
}
body #order-standard_cart .products .product header span{
    color:var(--theme-primary-color) ;
    font-weight:800;
}

body #order-standard_cart .products .product div.product-desc{
    float: none;
width: 100%;
padding: 8px 0;
text-align: center;
}
body #order-standard_cart .products .product footer{
    float: none;
width: 100%;
margin: 0;
padding:  0; 
}


body #order-standard_cart .view-cart-items-header{
    padding:8px 15px;
    background:var(--theme-black);
    border-radius:0;
}


#order-standard_cart .view-cart-items .item:nth-child(even){
    background:#fff !important;
    border-top:1px solid #EAEEF4 !important;
}

.register-page .sub-heading,
.checkout-page .sub-heading{
height: auto !important;
    border-top: none !important;
    text-align: left !important;
    margin-top: 0 !important;
    margin-bottom: 15px;
    border-bottom: 1px solid #ddd;
    padding: 10px;    
}

.register-page .sub-heading span,
.checkout-page .sub-heading span{
    padding:0 !important;
    top:0 !important;
}

.checkout-page #frmCheckout{
    display:flex;
    flex-wrap:wrap;
}

body #order-standard_cart .empty-cart .btn{
     border-radius: 0  0 ;
     background:var(--theme-black);
}
body #order-standard_cart .empty-cart{
    margin-bottom:40px;
}
body #order-standard_cart .view-cart-items .item{
    padding:10px;
    border-top: 1px solid #EAEEF4;
}
body .domain-promo-box p{
    font-size:14px;
    margin-top:10px;
}
@media (max-width: 768px) {
  
body .domain-promo-box p{
    font-size:12px;
}
}
body #order-standard_cart .order-summary{
    background:var(--theme-white);
    border:none ;
    border-radius:0;
    padding:15px;
}

@media (max-width: 768px) {
body #order-standard_cart .order-summary{
    padding:0px;
}
  
}
body #order-standard_cart .summary-container{
   border-radius: 6px;
    background: var(--theme-white);
    padding: 20px 15px;
    font-size: 16px !important;
    border: 1px solid #D9DDDC;
    margin: 20px 0;
}

@media (max-width: 768px) {
body #order-standard_cart .summary-container{
    font-size: 14px !important;
}
  
}
.total-due-today{
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}
.summary-totals span:nth-child(2){
        text-align: end !important;
        color:#2D2E2F !important;
}
.total-due-today span:nth-child(1){
        color:var(--theme-primary-color);
}
#order-standard_cart .order-summary .total-due-today span{
    display:inline !important;
    font-size:16px !important;
}
#order-standard_cart .order-summary .total-due-today .amt{
    font-size:16px;
}

@media (max-width: 768px) {
#order-standard_cart .order-summary .total-due-today span{
    font-size:14px !important;
}
#order-standard_cart .order-summary .total-due-today .amt{
    font-size:14px;
}
  
}
body #order-standard_cart .order-summary h1{
    font-weight:700;
    font-size:18px;
    color: var(--theme-black);
    margin-top:0;
}
@media (max-width: 768px) {
    body #order-standard_cart .order-summary h1{
        font-size:16px;
    }
}
body #order-standard_cart .order-summary h2{
    font-weight:400;
    font-size:16px;
    color: var(--theme-black);
    text-align:start;
    padding:0;
}

@media (max-width: 768px) {
body #order-standard_cart .order-summary h2{
    font-size:14px;
}
  
}
.addon-renewals .service-renewal, .domain-renewals, .service-renewals{
    background-color:transparent;
}
.domain-renewals .col-md-4 .domain-renewal {
    margin: 0;
    min-height: 175px;
    padding: 20px;
    margin-bottom: 10px;
}
.domain-renewals{
   border-top: none !important;
   background:transparent !important;
}
.domain-renewals .domain-renewal{
   border-bottom: none !important;
}
.domain-renewal{
    padding-bottom:0 !important;
}
.domain-renewal .label{
    color: var(--theme-primary-color) !important;
    background: var(--theme-primary-color)26;
    padding: 5px;
    margin-bottom: 10px;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    border-radius: .25em;
    font-size:11px;
}
.domain-renewal h3{
   margin-top:20px !important;
}
.domain-renewal p{
   font-size: 12px !important;
   font-weight:400;
   margin-top:10px;
   color:#727272 !important;
}
#order-standard_cart .font-size-16{
    font-size:16px;
font-weight:500;
}
@media (max-width: 768px) {
#order-standard_cart .font-size-16{
    font-size:14px;
font-weight:500;
}
  
}

.nav-tabs {
    border-bottom: 2px solid var(--theme-primary-color) ;
}
body #order-standard_cart .view-cart-tabs .nav-tabs > li.active > a{
    background:var(--theme-black);
    color:var(--theme-white);
    border-radius:0;
}
body #order-standard_cart .view-cart-tabs .tab-content{
    background:var(--theme-white);
    border:2px solid var(--theme-primary-color) ;
    border-top:0px;
}

body #order-standard_cart .field, body #order-standard_cart .form-control{
    border: 2px solid var(--theme-primary-color) ;
    border-radius:100px;
}

body #order-standard_cart .field:focus, body #order-standard_cart .form-control:focus{
    border-color:var(--theme-primary-color);
}
#order-standard_cart .domains-row .form-control {
    left: -15px;
}
.shared-domain-choose .domains-row .form-control {
    left: 0px;
    right: 0px !important;
}

.shared-domain-choose .sidebar-collapsed{
    padding:25px 0 !important;
}
#order-standard_cart .domains-row .input-group-addon ,
#order-standard_cart .domains-row .form-control-static{
   padding-right:20px;
    padding-left:20px;
}
.panel-footer{
    background:var(--theme-white);
    border:none;
}

table td .btn-group.btn-group-sm{
    display:flex;
}
body #order-standard_cart .input-group-lg > .form-control{
    border-color: var(--theme-primary-color);
    border-radius:0;
}

.domain-checker-container{
    border-radius:0;
}

.domain-checker-container .input-group-box{
    border-radius:0;
}

.domain-check-availability{
    border-radius:0 !important;
}

body .domain-promo-box{
    padding:20px;
    border:2px solid var(--theme-primary-color) ;
    border-radius:0;
}
.input-group-addon{
    border:2px solid var(--theme-primary-color) ;
    border-radius:100px;
}

body #order-standard_cart .domain-selection-options .option{
    border-radius:0;
    padding:0px;
    border:2px solid var(--theme-primary-color) ;
    background:transparent;
    border:none;
}
.md-editor .md-footer, .md-editor > .md-header{
    padding:20px;
}
.panel-primary > .panel-heading{
    background:var(--theme-white);
    border:0px;
}

pre{
    background:var(--theme-white);
    border:2px solid var(--theme-primary-color) ;
    border-radius:0;
}
.md-editor{
    border:1px solid #e4e6e7;
    border-radius: 12px;
    overflow: hidden;
}
body .md-editor > .md-preview, body .md-editor > textarea.markdown-editor{
    border-top:1px solid #e4e6e7 !important;
       border-bottom:1px solid #e4e6e7 !important;
       padding: 20px !important;
}

body .md-editor .md-footer, body .md-editor > .md-header{
    background: #f9fafb;
}

/* Markdown toolbar — neutral utility buttons (not site CTA style) */
.md-editor .btn,
.md-editor .btn-default,
.md-editor .btn-primary,
.md-editor .btn-sm,
.md-editor .btn-xs,
.md-editor .btn-group > .btn {
    min-height: 0 !important;
    height: auto !important;
    padding: 4px 10px !important;
    margin: 0 1px;
    border-radius: 6px !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-color: #d0d5dd !important;
    background-color: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #344054 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-shadow: none !important;
}

.md-editor .btn:hover,
.md-editor .btn:focus,
.md-editor .btn-default:hover,
.md-editor .btn-default:focus,
.md-editor .btn-primary:hover,
.md-editor .btn-primary:focus {
    background-color: #f2f4f7 !important;
    border-color: #98a2b3 !important;
    color: #101828 !important;
}

.md-editor .btn.active,
.md-editor .btn-primary.active,
.md-editor .btn-default.active,
.md-editor .btn:active {
    background-color: #e4e7ec !important;
    border-color: #98a2b3 !important;
    color: #101828 !important;
}

body .md-editor > .md-header {
    border-bottom: 1px solid #e4e6e7;
    padding: 6px 8px;
}
.ticket-number{
    color:var(--theme-primary-color);
    font-style: normal;
    font-weight:800;
}
div.header-lined small{
    display:block;
}

body .affiliate-stat{
    border-radius: 14px;
    background: var(--theme-white);
    color: var(--theme-black);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap:10px;
    align-items: center;
}

.affiliate-stat span{
    font-size: 28px !important;
    font-weight:700;
    color:#202224;
}
@media (max-width: 768px) {
    .affiliate-stat span{
        font-size: 18px !important;
        font-weight:700;
        color:#202224;
    }
  
}

.affiliate-stat-icon,
.affiliate-referral-icon{
    width:60px;
    height:60px;
    border-radius:23px;
    display:flex !important;
    justify-content:center;
    align-items:center;
}
.affiliate-referral-icon{
background:#e8eff1;
}
.affiliate-referral-icon i{
color:#287090 !important;
   font-size: 1em;
}
.affiliate-stat-container .affiliate-stat-wrapper:nth-child(1) .affiliate-stat-icon{
background:#fff3d6;
}
.affiliate-stat-container .affiliate-stat-wrapper:nth-child(1) .affiliate-stat-icon i{
color:#fec53d !important;
}
.affiliate-stat-container .affiliate-stat-wrapper:nth-child(2) .affiliate-stat-icon{
background:#d9f7e8;
}
.affiliate-stat-container .affiliate-stat-wrapper:nth-child(2) .affiliate-stat-icon i{
color:#55db98 !important;
}
.affiliate-stat-container .affiliate-stat-wrapper:nth-child(3) .affiliate-stat-icon{
background:#ffded1;
}
.affiliate-stat-container .affiliate-stat-wrapper:nth-child(3) .affiliate-stat-icon i{
color:#ff9a73 !important;
}
.affiliate-stat i{
    float: right;
    padding:0;
    font-size: 1em;
}
.affiliate-stat span.affiliate-stat-title{
    font-size: 16px !important;
    font-weight:700;
    color:#202224;
    opacity:70%;
}

@media (max-width: 768px) {
  
.affiliate-stat span.affiliate-stat-title{
    font-size: 14px !important;
}
}

.affiliate-referral-link h3{
    color:#151D48;
    font-size:16px;
    font-weight:700;
    margin:0;
}

@media (max-width: 768px) {
.affiliate-referral-link h3{
    font-size:14px;
}
  
}
.text-muted{
    color:#8BA3CB;
}
.affiliates-table-number{
        color: var(--theme-primary-color);
    font-size: 16px;
    text-align: end;
}

@media (max-width: 768px) {
.affiliates-table-number{
    font-size: 14px;
}
  
}
.affiliates-btn{
    border-radius:10px !important;
    margin-bottom:15px;
}
.affiliate-referral-link span{
       border: none;
    color: var(--theme-primary-color);
    font-size: 14px;
    font-weight: 400;
    padding:0;
}

@media (max-width: 768px) {
    .affiliate-referral-link span{
        font-size: 12px;
    }
  
}
.text-domain{
    color:var(--theme-primary-color);
}

div.announcement-single{
    padding:20px;
    border:2px solid var(--theme-primary-color) ;
    
}

div.announcement-single .label-warning{
    background:var(--theme-primary-color);
}
div.announcement-single .label-warning:hover{
     background:var(--theme-secondary-color);
}

.navbar-main .navbar-toggle:focus .icon-bar, .navbar-main .navbar-toggle:hover .icon-bar{
    background:var(--theme-black);
}

.domain-pricing .tld-pricing-header .col-sm-4, .domain-pricing .tld-pricing-header .col-xs-4{
    border:none !important;
    background:none !important;
}
.domain-pricing .tld-pricing-header{
    margin: 0;
    padding:20px;
}

.domain-pricing .tld-pricing-header div:nth-child(odd){
    background-color:transparent !important;
}


#accountNotifications .label-info{
    
    background-color: var(--theme-primary-color);
  border-radius:100px;
}


.panel-info>.panel-heading{
    background:var(--theme-white);
    color:var(--theme-black);
    border:0;
}


body #order-standard_cart .products .product div.product-desc{
    font-size:14px;
}

@media (max-width: 768px) {
body #order-standard_cart .products .product div.product-desc{
    font-size:12px;
}
  
}


.ticket-reply{
    border:2px solid var(--theme-primary-color) ;
        padding: 20px 10px;
}

.ticket-reply .user{
    background:var(--theme-white);
    padding:0;
    margin-bottom:20px
}

.ticket-reply.staff{
      border:2px solid var(--theme-primary-color);
}
.ticket-reply.staff .user{
    background:var(--theme-white);
}


.list-group {
    font-size: 14px;
}
div.header-lined .breadcrumb {
    font-size: 14px;
}

.btn-group-sm > .btn, .btn-sm{
    font-size:14px;
}
@media (max-width: 768px) {
  
.list-group {
    font-size: 12px;
}
div.header-lined .breadcrumb {
    font-size: 12px;
}

.btn-group-sm > .btn, .btn-sm{
    font-size:12px;
}
}


.dataTables_wrapper .dataTables_filter{
    background:transparent !important;
}

.dataTables_filter{
    margin-top:0 !important;
}

.dataTables_wrapper .dataTables_filter label .form-control{
    border-radius:10px;
    border:none!important;
    padding: 12px 45px !important;
    background-position:left;
    margin:0;
}

@media (min-width: 992px) {
.dataTables_wrapper .dataTables_filter label .form-control{
    min-width:750px;
}
}

/*********Table**********/
.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th{
    border-top:0;
}

table.table-list tbody td{
    padding:20px;
    border-top: 1px solid #EAEEF4;
    color:#092C4C;
    font-size:16px;
    font-weight:700;
}

@media (max-width: 768px) {
table.table-list tbody td{
    font-size:14px;
}
  
}
.dataTables_wrapper .dataTables_info{
    background: #fafafa !important ;
    color: var(--theme-body) !important;
}
.status{
    width: fit-content;
    min-width: 100px;
    border-radius: 38px;
    padding: 5px 26px;
    border: none !important;
    font-size:12px;
    font-weight:400;
}
@media (max-width: 768px) {
.status {
    width: fit-content;
    min-width: 75px;
    border-radius: 38px;
    padding: 5px 8px;
    border: none !important;
    font-size: 10px;
    font-weight: 400;
}
  
}

.dataTables_wrapper .dataTables_info{
    border:none;
}
.dataTables_wrapper table.table-list{
    margin-bottom: 0 !important;
}

.dataTables_wrapper .dataTables_length{
    background:var(--theme-white) ;
    color:var(--theme-white);
    padding: 0px;
}
.dataTables_wrapper .dataTables_length label {
    padding: 0;
    display:none !important;
}

.pagination > li > a, .pagination > li > span{
    border-radius:0 !important;
    border:2px solid var(--theme-white);
    background:var(--theme-white);
    color:var(--theme-black);
}
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover{
    background-color: var(--theme-primary-color);
border-color: var(--theme-primary-color);
}
.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover{
      background-color: var(--theme-primary-color);
border-color: var(--theme-primary-color);
color:var(--theme-white);
}


.input-group-addon{
    background:var(--theme-white);
}



/*********Inputs**********/
.form-control{
    height: 36px !important;
    border-radius: 10px !important;
    border: none !important;
    background: #F9F9F9!important;
    color: #8BA3CB !important;
    border-top: none !important;
    box-shadow: none !important;
    padding: 0 16px !important;
}
.form-control:focus{
    border-color:var(--theme-primary-color);
    box-shadow:none;
}

.dataTables_filter .form-control{
    background: #fff !important;
}

.input-lg {

    height: 46px;
}
/*********Buttons**********/
.btn{
    border-radius:100px;
    border-width:2px;
}

.btn-google{
    border-width:0;
}

.btn-success.focus, .btn-success:focus,.btn-success:hover,
.btn-primary.focus, .btn-primary:focus,.btn-primary:hover,
.btn-info.focus, .btn-info:focus,.btn-info:hover{
    background-color: var(--theme-primary-hover);
    border-color: var(--theme-primary-500);
    color: var(--theme-white) !important;
}

.btn-success,
.btn-primary,
.btn-info{
    color: var(--theme-white) !important;
    background-color: var(--theme-primary-color);
    border-width: 0 0 3px 0;
    border-color: var(--theme-primary-500);
    border-radius: var(--theme-radius-btn);
    font-family: var(--theme-font);
    font-weight: 600;
    text-shadow: none;
    background-image: none;
    box-shadow: none;
}

.btn-default{
    color: var(--theme-primary-color) !important;
    background-color: transparent;
    border-width: 1px 0 3px 0;
    border-color: var(--theme-primary-500);
    border-radius: var(--theme-radius-btn);
    font-family: var(--theme-font);
    font-weight: 600;
    text-shadow: none;
    background-image: none;
    box-shadow: none;
}
.btn-default.focus, .btn-default:focus,.btn-default:hover{
    color: var(--theme-primary-hover) !important;
    background-color: var(--theme-primary-light-color);
    border-color: var(--theme-primary-500);
}
.input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group{
    
    margin-left: -2px;
}



/*********Cards**********/
.TicketCard{
    padding:20px;
    border:2px solid var(--theme-primary-color) ;
}

.TicketCard a{
    font-size: 16px;
}

@media (max-width: 768px) {
.TicketCard a{
    font-size: 14px;
}
  
}

.DownloadCard{
    background:var(--theme-white);
    border:2px solid var(--theme-primary-color) ;
    margin-bottom:30px;
    padding:20px;
    border-radius:0 !important;
}

.DownloadCard strong{
    display:block;
    font-size:16px;
}

@media (max-width: 768px) {
.DownloadCard strong{
    font-size:14px;
}
  
}
 .DownloadCard:hover{
     background:var(--theme-white) !important;
     border-color:var(--theme-primary-color);
     
 }
.DownloadsTitle{
    margin-bottom:40px;
}
.KnowledgebaseCategories a{
    font-size:16px;
    font-weight:800;
    margin-bottom:10px;
    display:inline-block;
}

@media (max-width: 768px) {
.KnowledgebaseCategories a{
    font-size:14px;
}
  
}
.KnowledgebaseCategories .col-sm-4{
    margin-bottom:20px;
}
.KnowledgebaseCategories-title{
    margin:80px 0 40px;
}

.kbarticles{
    margin-top:20px;
}

.kbarticles a{
    margin-bottom:10px;
    display:inline-block;
}

 .kbarticles .collapse a{
    color:white !important;
    margin-bottom:10px;
    display:inline-block;
}
.kbarticles p{
    margin-bottom:30px;
    font-size:12px;
}


/*********Media**********/

@media (max-width:767px) {
 .navbar-main .navbar-nav .open .dropdown-menu>li>a {
  color:var(--theme-white);
 }
 .navbar-main .navbar-nav .open .dropdown-menu>li>a:hover {
  color:var(--theme-white);
 }
 
}/*End 767px*/


@media (max-width:600px) {
.dataTables_wrapper .dataTables_filter{
    margin-top:60px;;
    background: var(--theme-black);
}
table {
        display: block;
    width: 100%;
    overflow-x: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;

}
.dataTables_wrapper .dataTables_filter label{
    margin: 0 20px 20px;
}
}/*End 600px*/



@media (max-width:480px) {
  table.table-list tbody td {
    padding: 5px !important;
        font-size: 12px !important;
    font-weight: 500 !important;
}  

.table>thead:first-child>tr:first-child>th{
    padding: 12px 5px !important;
        font-size: 12px !important;
}
.btn-sm{
    font-size: 12px;
}
.dataTables_wrapper .dataTables_paginate{
    float:none;
    background: var(--theme-black);
    padding-bottom: 0;
}



}/*End 480px*/

img {height: auto;max-width: 100%;vertical-align: middle;}

h1 small{
    color:var(--theme-color);
}


.dataTables_info{
    display:none !important;
}

table{
        background: white;
    border-radius: 10px;
    padding: 0 10px;
}

table thead tr th{
    color:#7E92A2 !important;
    font-weight:700 !important;
    font-size:16px;
}
@media (max-width: 768px) {
table thead tr th{
    color:#7E92A2 !important;
    font-weight:700 !important;
    font-size:14px;
}
  
}
table tbody tr{
    background-color:var(--theme-white) !important;
}

.status{
    color:#41464b !important;
    background-color:#e2e3e5 !important;
    position:relative; 
}

.status::before{
    content:"";
    position:absolute;
    top:50%;
    right:10%;
    transform: translateY(-50%);
    width:8px;
    height:8px;
    border-radius:50%;
    background-color: #41464b;
}



.status-terminated ,.status-unpaid ,.status-closed{
    color:#DC2626 !important;
    background-color:#FEEDED !important;
    position:relative; 
}


.status-terminated::before , .status-unpaid::before ,.status-closed::before{
    content:"";
    position:absolute;
    top:50%;
    right:10%;
    transform: translateY(-50%);
    width:8px;
    height:8px;
    border-radius:50%;
    background-color: #DC2626;
}
.status-expired{
    color:#41464b !important;
    background-color:#e2e3e5 !important;
    position:relative; 
}

.status-expired::before{
    content:"";
    position:absolute;
    top:50%;
    right:10%;
    transform: translateY(-50%);
    width:8px;
    height:8px;
    border-radius:50%;
    background-color: #41464b;
}


.status-active ,.status-paid,.status-open{
    color:#259800!important;
    background-color:#F0FEED !important;
    position:relative; 
}

.status-active::before ,.status-paid::before ,.status-open::before{
    content:"";
    position:absolute;
    top:50%;
    right:18%;
    transform: translateY(-50%);
    width:8px;
    height:8px;
    border-radius:50%;
    background-color: #259800;
}

div.dataTables_wrapper div.dataTables_filter label{
    padding:20px 0 !important;
}

table.dataTable thead .sorting_asc:after{
    content: "" !important;
}

div.dataTables_wrapper div.dataTables_paginate{
    width: 100%;
    background: white;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px;
}

.dataTables_wrapper .dataTables_paginate .pagination>li>a, .dataTables_wrapper .dataTables_paginate .pagination>li>span{
        padding: 4px 8px;
    border: none;
    margin: 0 10px;
    font-size: 15px;
}

@media (max-width: 768px) {
.dataTables_wrapper .dataTables_paginate .pagination>li>a, .dataTables_wrapper .dataTables_paginate .pagination>li>span{
        padding: 4px 8px;
    border: none;
    margin: 0 10px;
    font-size: 12px;
}
  
}

.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover{
        background: var(--theme-primary-color) !important;
        color: var(--theme-white) !important;
    border-radius: 10px !important;
    text-decoration: none !important;
}

.pagination>li>a, .pagination>li>span{
    padding: 8px 12px !important;
    color: var(--theme-primary-color) !important;
}

.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover{
        background-color: white !important;
    text-decoration: underline !important;
}

.pagination>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover{
    color:#777 !important;
}

table.dataTable thead .sorting:after , table.dataTable thead .sorting_desc:after{
    content :"" !important;
}
#tableAffiliatesList h2{
    text-align:start;
    font-size:16px;
    font-weight:700;
    color:#092C4C !important;
    text-align:right;
    padding: 10px 0 !important;
}

@media (max-width: 768px) {
#tableAffiliatesList h2{
    font-size:14px;
}
  
}
#tableAffiliatesList_filter{
    display:none;
}

.table-title{
    font-size:16px;
    font-weight:700;
    color:#092C4C !important;
    text-align:left;
    padding: 10px 0 !important;
}
@media (max-width: 768px) {
.table-title{
    font-size:14px;
}
  
}

.knowledgebase{
    background:white;
    padding:10px;
    border-radius:10px;
}

.kb-article{
    margin-bottom:10px;
}

.kb-article button{
     width: 100%;
    border-radius: 10px;
    padding: 15px;
    text-align: right;
    background: white;
    border-color: white;
    color: #565246;
    font-size: 18px;
    font-weight: 700;
    outline: none;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    border: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

@media (max-width: 768px) {
.kb-article button{
    font-size: 16px;
    }
  
}

.kb-article button:not(.collapsed) {
    background-color:#246D8D;
    color:white;
    border-radius: 10px 10px 0px 0;
}
.kb-article button:not(.collapsed) .caret {
     border-bottom: 10px dashed;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
        border-top: 0px dashed;
}

.kb-article button .caret{
        border-top: 10px dashed;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
}

.well{
        background-color: #246d8d !important;
    color: white !important;
    font-size: 16px !important;
}
@media (max-width: 768px) {

.well{
        background-color: #246d8d !important;
    color: white !important;
    font-size: 14px !important;
}
  
}
#inputKnowledgebaseSearch{
    border-color:transparent !important;
}
.kb-search{
    border-radius: 10px;
    overflow: hidden;
    margin-bottom:15px;
}

.panel-sidebar a.list-group-item.active i{
    color:var(--theme-white) !important;
}
.panel-sidebar a.list-group-item:hover i{
    color:var(--theme-white) !important;
}

.open-ticket-title{
    color:#092C4C;
    font-size:24px;
    font-weight:700;
    margin:0 0 20px 0;
}

@media (max-width: 768px) {
.open-ticket-title{
    font-size:18px;
}
  
}
.open-ticket-subtitle{
    color:#8BA3CB;
    font-size:16px;
    font-weight:400;
    
}

@media (max-width: 768px) {
.open-ticket-subtitle{
    font-size:14px;

    
}
  
}
.open-ticket-border{
  border: 1px solid #E4E4E4
}

.open-ticket-card p strong a{
    color:#000;
    font-size:16px !important;
}
@media (max-width: 768px) {
.open-ticket-card p strong a{
    color:#000;
    font-size:14px !important;
}
  
}
.open-ticket-card p{
    color:#727272;
    font-size:12px !important;
}
.open-ticket-card i{
    font-size:22px !important;
}
 .domain-renewal .cart-body{
    width:100% !important;
    
}
#order-standard_cart .cart-body .row{
    display:flex;
    flex-direction: row-reverse;
    flex-wrap:wrap;
}
#order-standard_cart .cart-body .form-horizontal .row{
    display:flex;
    flex-direction: column;
    width: 100%;
    margin: 10px auto;
}

.btn-add-renewal-to-cart{
    width: 100%;
    border: none;
    border-top: 1px solid #E4E4E466;
    border-radius: 0;
    padding: 15px;
    transition: 300ms;
background: var(--theme-primary-color);
    color: #fff !important;
    margin-bottom: 10px;
}
.btn-add-renewal-to-cart:hover{
background: var(--theme-secondary-color);
    color: #fff !important;
}
.btn-add-renewal-to-cart .fa-shopping-cart {
    display:inline !important;
    margin: 0 7px;
}
.btn-default:hover i{
    color:white !important;
}
#order-standard_cart label{
        text-align: right;
    margin-bottom: 10px;
}

body #order-standard_cart .field, body #order-standard_cart .form-control{
    border-radius: 10px;
    border: none !important;
    background: #F9F9F9;
    color: #8BA3CB;
    border-top: none;
    box-shadow: none;
    padding: 0 16px;
}

#order-standard_cart .secondary-cart-body{
    width:100%;
}
#order-standard_cart div.header-lined h1 {
    margin-top: 0;
    margin-bottom: 0; 
     padding: 0; 
     border-bottom: none; 
    font-weight: 400;
    color: #058;
}

.form-control.domain-renewals-filter{
    background:  #fff no-repeat !important;
    padding:0 20px !important;
    height: 56px !important;
    width: 100% !important;
    font-size: 13px !important;
    border-radius: 10px !important;
    margin-bottom: 20px ;
    border: none !important;
}
@media (max-width: 768px) {
.form-control.domain-renewals-filter{
    font-size: 11px !important;
}
  
}

#order-standard_cart .order-summary .summary-totals{
    border-top:none !important;
    border-bottom:none !important;
}

.domain-options .input-group-addon{
    display:none !important;
}
.domain-options .input-group{
    width:100% !important;
}

#frmProductDomain{
    padding:0;
    margin-top:25px;
}

@media(min-width:992px){
    
#frmProductDomain{
    padding:35px;
    margin-top:25px;
}
}

.domain-block{
    max-width: 1200px;
    margin: auto;
}

#order-standard_cart .view-cart-items{
    border-bottom:none !important;
}

.shared-domain-choose div.header-lined h1{
    color:white !important;
    text-align:center;
    padding:20px !important;
}



.shared-domain-choose label{
    color:white !important;
    font-size:18px !important;
    font-weight:600 !important;
}

@media (max-width: 768px) {
.shared-domain-choose label{
    font-size:16px !important;
}
  
}
.shared-domain-choose .cart-body .row{
    flex-direction:row !important;
}
.shared-domain-choose .btn-primary{
    border-radius:10px;
    color: var(--theme-primary-color) !important;
    font-weight:500;
    background-color:white !important;
    border-color:var(--theme-primary-color);
    transition:300ms;
}
.shared-domain-choose .btn-primary:hover{
    background-color: var(--theme-primary-color) !important;
    color:white !important;
        border-color:white;
}
.shared-domain-choose .cart-body{
    background-color:var(--theme-primary-color);
    color:white;
    margin:auto;
    border-radius:25px !important;
}

.view-cart .empty-cart .btn{
        border-radius: 8px !important;
        background:var(--theme-primary-color) !important;
    padding: 6px 12px !important;
}

@media(min-width:576px){
    .product-domain ,.view-cart{
        margin-top:-60px !important;
    }
}
.product-domain .product-info,
.view-cart .product-info{
    background:white !important;
    margin-bottom:50px !important;
        padding:0 !important;
    border-top: none !important;
}
.product-domain .product-info .product-title,
.view-cart .product-info .product-title{
    color: var(--theme-primary-color);
    font-size:14px;
    font-weight:600;
    margin:10px 0px 15px !important;
}

@media (max-width: 768px) {
.product-domain .product-info .product-title,
.view-cart .product-info .product-title{
    font-size:12px;
}
  
}
.product-domain .secondary-cart-body, 
.view-cart .secondary-cart-body {
    background: white !important;
    padding: 30px 50px !important; /* Default padding for larger screens */
}

/* Adjust for tablets (max-width: 768px) */
@media (max-width: 768px) {
    .product-domain .secondary-cart-body, 
    .view-cart .secondary-cart-body {
        padding: 20px 30px !important;
    }
}

/* Adjust for mobile screens (max-width: 576px) */
@media (max-width: 576px) {
    .product-domain .secondary-cart-body, 
    .view-cart .secondary-cart-body {
        padding: 10px !important;
    }
}

#containerNewUserSignup{
    flex: 0 0 100%; max-width: 100%;
}


#containerNewUserSignup .row{
    background: white;
    padding: 15px;
    margin-bottom:10px;
}


.paymentradiocontainer{
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 35px;
}

.paymentradiocontainer .radio-inline span{
    background: #F9F9F9;
    width: 90%;
    display: inline-block;
    padding: 15px;
    border: 1px solid #D9DDDC;
    border-radius: 4px;
}

.product-domain .secondary-cart-body .field-container ,
.view-cart .secondary-cart-body .field-container {
        padding: 30px 10px 0;
    background: #F9F9F9;
    border-radius: 10px;
    border:1px solid #eee;
}

.product-domain .secondary-cart-body .field-container .field-container-title ,
.view-cart .secondary-cart-body .field-container .field-container-title {
    font-size:16px !important;
    font-weight:700 !important;
    color:#363945 !important;
    margin-bottom: 35px !important;
}

@media (max-width: 768px) {
  
.product-domain .secondary-cart-body .field-container .field-container-title ,
.view-cart .secondary-cart-body .field-container .field-container-title {
    font-size:14px !important;
}
}


.product-domain .secondary-cart-body .field-container .radio-group-container .radio-option,
.view-cart .secondary-cart-body .field-container .radio-group-container .radio-option {
    display:inline-flex;
    gap:5px;
        padding: 0px 10px;
}

@media(max-width:768px){
.product-domain .secondary-cart-body .field-container .radio-group-container .radio-option,
.view-cart .secondary-cart-body .field-container .radio-group-container .radio-option {
    padding: 10px;
    margin-bottom:15px;
}
    
}

.product-domain .secondary-cart-body .field-container .radio-group-container .radio-option label,
.view-cart .secondary-cart-body .field-container .radio-group-container .radio-option label{
    font-size:16px !important;
    font-weight:700 !important;
    color :#363945 !important;
    margin-right:0 !important;
}
@media (max-width: 768px) {
.product-domain .secondary-cart-body .field-container .radio-group-container .radio-option label,
.view-cart .secondary-cart-body .field-container .radio-group-container .radio-option label{
    font-size:14px !important;
}
  
}
.product-domain .secondary-cart-body .title,
.view-cart .secondary-cart-body .title {
    font-size:24px;
    font-weight:700;
    color :#2D2E2F;
}

@media (max-width: 768px) {
.product-domain .secondary-cart-body .title,
.view-cart .secondary-cart-body .title {
    font-size:18px;
}
  
}

@media (max-width: 768px) {
  
.product-domain .secondary-cart-sidebar {
    padding:0 !important;
}
}

.product-domain .secondary-cart-sidebar #orderSummary,
.view-cart .secondary-cart-sidebar #orderSummary{
        background: white;
 
    padding: 22px;    
}

@media (min-width:768px){
.product-domain .secondary-cart-sidebar #orderSummary,
.view-cart .secondary-cart-sidebar #orderSummary{
   margin-left: -80px;
}
}

#btnCompleteProductConfig{
    background-color: var(--theme-primary-color);
    
}
#btnCompleteProductConfig i, 
.btn-checkout i{
display:none;
}
.product-domain .secondary-cart-sidebar #btnCompleteProductConfig,
.view-cart .secondary-cart-sidebar .btn-checkout{
    border-radius:8px !important;
    padding:10px 16px !important;
        width:100%;
        font-size:12px;
}
.product-domain .secondary-cart-sidebar .order-summary,
.view-cart .secondary-cart-sidebar .order-summary {
   
        border-radius: 6px;
    border: 1px solid #D9DDDC;
    margin-top: 25px;
    margin-bottom: 0px !important;
}

@media (min-width:768px){
.product-domain .secondary-cart-sidebar .order-summary,
.view-cart .secondary-cart-sidebar .order-summary {
   
     padding: 40px 30px 0 30px !important;
}
}

.product-domain .secondary-cart-sidebar .order-summary  .summary-totals,
.view-cart .secondary-cart-sidebar .order-summary  .summary-totals{
    margin:0 !important;
    padding:0 !important;
}
.product-domain .secondary-cart-sidebar .order-summary .product-group,
.product-domain .secondary-cart-sidebar .order-summary .clearfix,
.product-domain .secondary-cart-sidebar .order-summary .summary-totals .clearfix,
.product-domain .secondary-cart-sidebar .order-summary .total-due-today,

.view-cart .secondary-cart-sidebar .order-summary .product-group,
.view-cart .secondary-cart-sidebar .order-summary .clearfix,
.view-cart .secondary-cart-sidebar .order-summary .summary-totals .clearfix,
.view-cart .secondary-cart-sidebar .order-summary .total-due-today{
        border: 1px solid #D9DDDC;
    padding: 5px 8px !important;
    background: #F9F9F9;
    border-radius: 4px;
    margin-bottom:10px !important;
}
.product-domain .secondary-cart-sidebar .order-summary h2,
.view-cart .secondary-cart-sidebar .order-summary h2 {
    color:#2D2E2F !important;
        font-size:24px  !important;
    font-weight:700  !important;
}

@media (max-width: 768px) {
.product-domain .secondary-cart-sidebar .order-summary h2,
.view-cart .secondary-cart-sidebar .order-summary h2 {
        font-size:18px  !important;
}
  
}
.shared-domain-choose .cart-body{
    padding:15px;
}
.shared-domain-choose .sidebar-collapsed,
.confdomain .sidebar-collapsed,
.product-domain .sidebar-collapsed,
.checkout-page .sidebar-collapsed,
.view-cart .sidebar-collapsed{
    display:none !important;
}
.view-cart .view-cart-items-header{
    background-color:white !important;
    color:#7E92A2 !important;
}
.shared-domain-choose .domain-checker-available {
    color: var(--theme-primary-color) !important;
    background: white;
    width: fit-content;
    margin: auto;
    padding: 4px 28px;
    border-radius: 10px;
    margin-bottom: 20px;
}

.shared-domain-choose .transfer-eligible{
    color: #fff !important;
    background: transparent !important;
    border-color: transparent !important;
    
}

#frmProductDomainSelections{
    margin-bottom:30px;
}

#spotlightTlds{
    background:transparent;
}

#order-standard_cart .cart-sidebar .panel-sidebar:nth-child(1),
#order-standard_cart .cart-sidebar .panel-sidebar:nth-child(2){
    display:none !important;
}

.form-control{
    border-radius: 8px !important; 
    border: none !important;
}

.client-details .form-control ,
.inputContact .form-control ,
.new-account .form-control ,
.checkout .form-control ,
.login-form .form-control ,
.user-profile .form-control{
    border-radius: 8px !important; 
    color: var(--theme-black) !important;
    height: 36px !important;
    border: none !important;
    background: #F9F9F9 !important;
    box-shadow: none !important;
}

@media(min-width:768px){
.client-details .form-group,
.inputContact .form-group,
.new-account .form-group,
.checkout .form-group,
.login-form .form-group,
.user-profile .form-group{
    padding:0 15px !important;
}
}


.user-profile .label-default{
background:transparent !important;
    color:#999;
}

.checkout .prepend-icon .field{
    padding-right:60px !important;
}

.client-details-btns .btn-primary,
.inputContact .btn-primary,
.new-account-btns .btn-primary,
.user-profile-btns .btn-primary{
    border-radius: 6px !important;
    background: var(--theme-primary-color) !important;
    border-color: var(--theme-primary-color) !important;
}
.client-details-btns .btn-default,
.inputContact .btn-default,
.new-account-btns .btn-default,
.user-profile-btns .btn-default{
 border-radius: 6px !important;
    background: var(--theme-primary-color)1c !important;
    border-color: transparent !important;
    margin: 0 20px !important;
    padding: 6px 16px !important;
    transition:200ms;
}

.checkout .card.col-md-6{
    background: white;
    padding: 20px;
    border-radius: 10px;
}
.client-details-btns .btn-default:hover,
.new-account-btns .btn-default:hover{
    background: var(--theme-primary-color) !important;
    color: #fff !important;
}

.domain-checker-container{
    background: var(--theme-primary-color) !important;
    padding:80px 0 !important;
}

.domain-checker-bg{
    padding:0 !important;
}
.domain-p{
    font-size: 20px !important;
    font-weight: 600 !important;
}

@media (max-width: 768px) {
.domain-p{
    font-size: 16px !important;

}
  
}
.domain-checker-container .input-group-box{
    border-radius:102px !important;
}
.domain-checker-container #btnCheckAvailability{
    border-radius:76px !important;
    background-color:var(--theme-primary-color) !important;
    border-color:var(--theme-primary-color) !important;
}
#inputDomain{
    background:transparent !important;
}
.featured-tld{
border-radius:15px !important;    
}
.featured-tld .price.com,
.featured-tld .price.net,
.featured-tld .price.tech,
.featured-tld .price.store{
    color:var(--theme-primary-color)!important;
    background:transparent;
    font-size:18px;
    font-weight:700;
    border-top : 1px solid #edf4ff;
}

@media (max-width: 768px) {
.featured-tld .price.com,
.featured-tld .price.net,
.featured-tld .price.tech,
.featured-tld .price.store{
    font-size:16px;
}
  
}

.domain-pricing .cart-body .row{
    flex-direction:row!important;
}

.domain-pricing .tld-pricing-header div{
    background-color: var(--theme-white);
    color:#7E92A2;
}
.tld-filters{
    margin :0 !important;
}
.tld-sale-group{
        display:inline-block;
    width: fit-content;
    min-width: 100px;
    border-radius: 38px;
    padding: 5px 26px;
    border: none !important;
    font-size: 12px;
    font-weight: 400;
}
.tld-sale-group-new{
    color: #259800 !important;
    background-color: #F0FEED !important;
    position: relative;
}

.tld-sale-group-new::before{
    content:"";
    position:absolute;
    top:50%;
    right:18%;
    transform: translateY(-50%);
    width:8px;
    height:8px;
    border-radius:50%;
    background-color: #259800;
}


.tld-sale-group-hot{

    color:#DC2626 !important;
    background-color:#FEEDED !important;
    position:relative; 
}

.tld-sale-group-hot::before{
    content:"";
    position:absolute;
    top:50%;
    right:10%;
    transform: translateY(-50%);
    width:8px;
    height:8px;
    border-radius:50%;
    background-color: #DC2626;
}

.control-label{
    font-weight:400;
}
.marketing-email-optin{
    background:white !important;
}
.register-page .marketing-email-optin{
    background:transparent !important;
}
.login-btn{
    border-radius:8px;
    border: 2px solid #000;
        padding: 8px 25px !important;
    margin-top:5px;
}
#container div{
    border:none !important;
}
.logincontainer.with-social{
    max-width:750px;
}
.logincontainer.with-social .row{
    background: white;
    border-radius: 8px;
}

#btnGoogleSignin1{
    display: flex;
    justify-content: center;
}
/* Custom checkbox styling */
.square-checkbox {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  border: 1px solid #ccc;
  background-color: white;
  margin-right: 10px; /* Space between checkbox and label */
  position: relative;
  vertical-align: middle;
  cursor: pointer;
    margin-right: -25px !important;
    
}

.square-checkbox:checked {
  background-color: var(--theme-primary-color);
  border-color: var(--theme-primary-color);
}

.square-checkbox:checked:after {
  content: '';
  position: absolute;
  left: 6px; /* Adjusted for smaller size */
  top: 2px; /* Adjusted for smaller size */
  width: 6px; /* Adjusted for smaller size */
  height: 12px; /* Adjusted for smaller size */
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.square-checkbox:focus {
  outline: none;
  box-shadow: 0 0 3px 2px rgba(73, 151, 181, 0.4);
}

/* Add bottom margin to the checkbox group */
.controls label {
  display: inline-block;
  margin-bottom: 15px; /* Space between checkbox groups */
}

.input-group-btn{
  margin-top: 0;
}

#accountNotifications i {
    display: none;    
}
#accountNotifications span {
    
    display: inline;    
}


@media (min-width: 992px) {
#accountNotifications i {
    display: inline;    
}
#accountNotifications span {
    
    display: none;    
}

}
.user-dropdown i {
    display: none;    
}
.user-dropdown .title {
    
    display: inline;    
}


@media (min-width: 992px) {
.user-dropdown i {
    display: inline;    
}
.user-dropdown .title {
    display: none;    
}
}

.spotlight-tld{
    border-radius:10px !important;
}

.product-domain .secondary-cart-body .field-container .radio-group-container .iradio_square-blue.checked + label {
    color:var(--theme-primary-color) !important;
}

@media (max-width:480px) {
  table tbody td {
    padding: 5px !important;
        font-size: 12px !important;
    font-weight: 500 !important;
}  

table>thead>tr>th{
    padding: 12px 5px !important;
        font-size: 12px !important;
}
}
.bootstrap-switch {
    display: inline-block !important;
    direction: ltr !important;
    cursor: pointer !important;
    border-radius: 4px !important;
    border: 1px solid !important;
    border-color: #ccc !important;
    position: relative !important;
    text-align: left !important;
    overflow: hidden !important;
    line-height: 8px !important;
    z-index: 0 !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
    vertical-align: middle !important;
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s !important;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s !important;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s !important;
}

.bootstrap-switch .bootstrap-switch-container {
    display: inline-block !important;
    top: 0 !important;
    border-radius: 4px !important;
    -webkit-transform: translate3d(0,0,0) !important;
    transform: translate3d(0,0,0) !important;
}

.bootstrap-switch .bootstrap-switch-handle-off,
.bootstrap-switch .bootstrap-switch-handle-on,
.bootstrap-switch .bootstrap-switch-label {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    display: table-cell !important;
    vertical-align: middle !important;
    padding: 6px 12px !important;
    font-size: 14px !important;
    line-height: 20px !important;
}

@media (max-width: 768px) {
.bootstrap-switch .bootstrap-switch-handle-off,
.bootstrap-switch .bootstrap-switch-handle-on,
.bootstrap-switch .bootstrap-switch-label {
    font-size: 12px !important;

}
  
}

.bootstrap-switch .bootstrap-switch-handle-off,
.bootstrap-switch .bootstrap-switch-handle-on {
    text-align: center !important;
    z-index: 1 !important;
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary {
    color: #fff !important;
    background: #337ab7 !important;
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info {
    color: #fff !important;
    background: #5bc0de !important;
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success {
    color: #fff !important;
    background: #5cb85c !important;
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning {
    background: #f0ad4e !important;
    color: #fff !important;
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger {
    color: #fff !important;
    background: #d9534f !important;
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default {
    color: #000 !important;
    background: #eee !important;
}

.bootstrap-switch .bootstrap-switch-label {
    text-align: center !important;
    margin-top: -1px !important;
    margin-bottom: -1px !important;
    z-index: 100 !important;
    color: #333 !important;
    background: #fff !important;
}

.bootstrap-switch span::before {
    content: "\200b" !important;
}

.bootstrap-switch .bootstrap-switch-handle-on {
    border-bottom-left-radius: 3px !important;
    border-top-left-radius: 3px !important;
}

.bootstrap-switch .bootstrap-switch-handle-off {
    border-bottom-right-radius: 3px !important;
    border-top-right-radius: 3px !important;
}

.bootstrap-switch input[type=checkbox],
.bootstrap-switch input[type=radio] {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    margin: 0 !important;
    z-index: -1 !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-label {
    padding: 1px 5px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-label {
    padding: 5px 10px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-label {
    padding: 6px 16px !important;
    font-size: 18px !important;
    line-height: 1.3333333 !important;
}

@media (max-width: 768px) {

.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-label {
    font-size: 16px !important;
}
  
}
.bootstrap-switch.bootstrap-switch-disabled,
.bootstrap-switch.bootstrap-switch-indeterminate,
.bootstrap-switch.bootstrap-switch-readonly {
    cursor: default !important;
}

.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-label {
    opacity: .5 !important;
    cursor: default !important;
}

.bootstrap-switch.bootstrap-switch-animate .bootstrap-switch-container {
    -webkit-transition: margin-left .5s !important;
    -o-transition: margin-left .5s !important;
    transition: margin-left .5s !important;
}

.bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-on {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
    border-bottom-right-radius: 3px !important;
    border-top-right-radius: 3px !important;
}

.bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-off {
    border-bottom-right-radius: 0 !important;
    border-top-right-radius: 0 !important;
    border-bottom-left-radius: 3px !important;
    border-top-left-radius: 3px !important;
}

.bootstrap-switch.bootstrap-switch-focused {
    border-color: #66afe9 !important;
    outline: 0 !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6) !important;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6) !important;
}

.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-off .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-on .bootstrap-switch-label {
    border-bottom-right-radius: 3px !important;
    border-top-right-radius: 3px !important;
}

.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-on .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-off .bootstrap-switch-label {
    border-bottom-left-radius: 3px !important;
    border-top-left-radius: 3px !important;
}
.view-cart .view-cart-items .item-price .cycle{
    font-size:14px !important;   
}
@media (max-width: 768px) {
.view-cart .view-cart-items .item-price .cycle{
    font-size:12px !important;   
}
  
}
.view-cart-items-header .row {
    font-size:16px !important;
    font-weight:700 !important;
}
@media (max-width: 768px) {
.view-cart-items-header .row {
    font-size:14px !important;
    font-weight:700 !important;
}
  
}
.view-cart .view-cart-items .item-price .cycle {
    font-size: 1em;
    font-weight: 400 !important;
}
@media (max-width: 768px) {
.view-cart .view-cart-items .item-price .cycle {
    font-size: 0.8em;
}
  
}
.view-cart .item-domain, 
.view-cart .item-group {
    font-size: 16px;
}

@media (max-width: 768px) {
.view-cart .item-domain, 
.view-cart .item-group {
    font-size: 14px;
}
  
}
.view-cart .menu-btn:focus{
    border:none !important;
    outline:none !important;
}

 .btn:active{
     box-shadow:none !important;
 }
 
 .view-cart .order-summary .subtotal {
     font-size:16px !important;
 }
 
 @media (max-width: 768px) {
 .view-cart .order-summary .subtotal {
     font-size:14px !important;
 }
  
}
 
 .visible-xs-inline{
     display:block !important;
 }
 
 #btnAlreadyRegistered{
    border-radius: 0;
    background: var(--theme-primary-color);
    border: var(--theme-primary-color);
    padding: 10px 15px;
 }
 
 .already-registered{
         margin-bottom: 20px;
    padding: 0 15px;
 }
 
 .checkout-page .cart-body .row{
     flex-direction: row !important;
 }
 
 .checkout-page .prepend-icon .field-icon{
     display:none !important;
 }
 
 .checkout-page .intl-tel-input.allow-dropdown .flag-container, .checkout-page .intl-tel-input.separate-dial-code .flag-container,
 .register-page .intl-tel-input.allow-dropdown .flag-container, .checkout-page .intl-tel-input.separate-dial-code .flag-container{
        left: 0 !important;
    right: auto !important;
 }
 .register-page #inputPhone,
 .checkout-page #inputPhone{
text-align:right !important;
 }
 
 .client-details #inputPhone{
text-align:right !important;
 }
 .checkout-page .marketing-email-optin p{
        color:#536B92;
 }
 

 #containerExistingUserSignin{
 padding: 0 15px !important;
 margin-bottom:10px !important;
 border-radius: 10px !important;
     flex: 0 0 100%;
     max-width: 100%;
 }
 
 #frmConfigureDomains{
     background: white;
    padding: 15px;
 }
 
 @media (max-width: 575px) {
    .view-cart .secondary-cart-sidebar {
        background-color:white;
    }
    .view-cart .secondary-cart-sidebar #orderSummary{
        padding:0;
    }
}

.domain-details-title{
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 700;
    border-bottom: 1px solid #d9dddc;
    padding: 20px;
}

@media (max-width: 768px) {
  
.domain-details-title{
    font-size: 14px;
}
}

.domain-details-item h4{
    font-size:14px !important;
    font-weight:400 !important;
}

@media (max-width: 768px) {
.domain-details-item h4{
    font-size:12px !important;
}
  
}
.domain-details-item i{
    font-size: 20px;
    color: #86929E !important;
}

.domain-details-item span{
    color: var(--theme-primary-color);
}

.card-border ul{
    list-style:none !important;
    padding:0;
}
.card-border ul li{
    padding: 10px 0;
}

.product-details-card #tabOverview > .row:first-of-type div.col-md-6{
    width: 100% !important;
    max-width: 100% !important;
    padding:0;
}
.product-details-card #tabOverview > .row:first-of-type div.col-md-6 .panel{
    padding:15px !important;
}
.product-details-card #tabOverview > .row:first-of-type div.col-md-6:first-of-type .panel .panel-body{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

/* Domain / info links stay as text links — never solid brand blocks */
.product-details-card #tabOverview > .row:first-of-type div.col-md-6:first-of-type .panel .panel-body p a:not(.btn){
    display: inline;
    padding: 0;
    background: transparent !important;
    color: var(--theme-primary-color) !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-weight: 500;
    text-decoration: none;
}

.product-details-card #tabOverview > .row:first-of-type div.col-md-6:first-of-type .panel .panel-body p a:not(.btn):hover{
    background: transparent !important;
    color: var(--theme-primary-hover) !important;
    text-decoration: underline;
}

.product-details-card #tabOverview > .row:first-of-type div.col-md-6 .panel-title{
    color : #092C4C !important;
    font-size:20px;
    font-weight:700;
}

@media (max-width: 768px) {
.product-details-card #tabOverview > .row:first-of-type div.col-md-6 .panel-title{
    font-size:18px;

}
  
}
#diskUsage, #bandwidthUsage{
    color:#092C4C !important;
}
.product-details-card #tabOverview > .row:first-of-type div.col-md-6 .row{
    display:flex;
}

#cPanelQuickShortcutsPanel{
    background:transparent;
    border:none;
    box-shadow:none;
    border-top:none !important;
}

.cpanel-feature-row div{
    margin-bottom:15px;
}
.cpanel-feature-row div a{
    background:white;
    padding:15px;
    border-radius:10px;
    border: 1px solid #F2F2F2;
}
#frmCreateEmailAccount .input-group{
     direction: ltr;
     margin-bottom:10px;
}
#frmCreateEmailAccount .btn-primary{
     margin-bottom:10px;
}
#frmCreateEmailAccount #cpanel-email-password{
     margin-bottom:10px;
}
#frmCreateEmailAccount .input-group-addon{
    border:none !important;
}

#cPanelBillingOverviewPanel .panel-heading{
    border-bottom: 1px solid #EFF0F2;
    border-radius: 0;
}

#recurringAmount, #billingCycle ,#paymentMethod ,#registrationDate , #nextDueDate {
    display:flex;
    margin-bottom:10px;
}
#recurringAmount .col-xs-6, #billingCycle .col-xs-6,#paymentMethod .col-xs-6 ,#registrationDate .col-xs-6, #nextDueDate  .col-xs-6{
        width: fit-content !important;
    max-width: fit-content !important;
}
#recurringAmount .col-xs-6:nth-child(1), #billingCycle .col-xs-6:nth-child(1),#paymentMethod .col-xs-6:nth-child(1) ,#registrationDate .col-xs-6:nth-child(1), #nextDueDate  .col-xs-6:nth-child(1){
    min-width: 140px;
        text-align: right;
}
#recurringAmount .col-xs-6:nth-child(2), #billingCycle .col-xs-6:nth-child(2),#paymentMethod .col-xs-6:nth-child(2) ,#registrationDate .col-xs-6:nth-child(2), #nextDueDate  .col-xs-6:nth-child(2){
    color: var(--theme-primary-color);
}

.view-cart-tabs .nav-tabs li a{
    border-color: transparent !important;
    background-color: var(--theme-primary-color) !important;
    color: white !important;
}

#inputCaptchaImage{
    max-width:fit-content !important;
}

#order-standard_cart .view-cart-items .item-price{
    text-align:left !important;
}
#order-standard_cart .view-cart-items .item-title, #order-standard_cart .view-cart-items .item-price span{
    font-size:16px !important;
}

@media (max-width: 768px) {
#order-standard_cart .view-cart-items .item-title, #order-standard_cart .view-cart-items .item-price span{
    font-size:14px !important;
}
}

#order-standard_cart .order-summary .total-due-today-padded{
    margin:0 !important;
}

@media (max-width: 768px) {
 .checkout-page .cart-body,
 .confdomain .cart-body ,
 .product-domain .cart-body {
     padding:0 !important;
 }
 .checkout-page .col-12 {
     padding:0 !important;
 }
}

.dataTables_filter label {
    width:100%;
}

.dataTables_filter label input {
    width:100% !important;
}

.table.dataTable thead>tr>th.sorting{
    padding-right:8px !important;
}

.hidden{
    display:none !important;
}


#fullpage-overlay.hidden{
    display:none !important;
}

#inputKnowledgebaseSearch{
    background-color:white;
}
.services-mega-dropdoen{
    background: white !important;
    width: fit-content !important;

}

@media(min-width: 992px){
.services-mega-dropdoen{
        margin-right: -268px;
}
}

.kbarticles a{
    font-size:1em !important;
}


/* ============================================================
   Reeras style layer — Six markup, Reeras look
   Does not change template structure; only visual polish.
============================================================ */

html {
    font-size: 16px !important;
}

.btn,
.btn-sm,
.btn-xs,
.btn-lg {
    font-family: var(--theme-font) !important;
    text-shadow: none !important;
    background-image: none !important;
    box-shadow: none !important;
}

.btn-danger {
    background-color: #b42318 !important;
    border-width: 0 0 3px 0 !important;
    border-color: #f04438 !important;
    border-radius: var(--theme-radius-btn) !important;
    color: #fff !important;
}

.btn-warning {
    background-color: #fffaeb !important;
    border-width: 1px 0 3px 0 !important;
    border-color: #fedf89 !important;
    border-radius: var(--theme-radius-btn) !important;
    color: #b54708 !important;
}

/* Page title */
div.header-lined {
    margin-bottom: 24px;
    padding: 24px 16px;
    border: 1px solid var(--theme-border);
    border-radius: var(--theme-radius-card);
    background: #fafafa;
    text-align: center;
}

div.header-lined h1 {
    margin: 0 0 8px;
    color: #003245 !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    text-transform: none !important;
}

div.header-lined .breadcrumb {
    background: transparent;
    padding: 0;
}

/* Home tiles */
.tiles .tile a {
    border: 1px solid var(--theme-border);
    border-radius: var(--theme-radius-card);
    overflow: hidden;
}

.tiles .tile a:hover {
    background: var(--theme-primary-25) !important;
    border-color: var(--theme-primary-color);
}

.tiles .tile .highlight {
    background: var(--theme-primary-color) !important;
}

/* Panels */
.panel {
    border: 1px solid var(--theme-border) !important;
    border-radius: var(--theme-radius-card) !important;
    box-shadow: none !important;
    overflow: hidden;
}

.panel > .panel-heading {
    background: #fafafa !important;
    border-top: 0 !important;
    border-bottom: 1px solid var(--theme-border) !important;
    border-radius: 0 !important;
    color: var(--theme-black) !important;
}

.panel .panel-title {
    font-weight: 500 !important;
    text-transform: none !important;
}

.panel-accent-blue,
.panel-accent-green,
.panel-accent-red,
.panel-accent-orange,
.panel-accent-gold,
.panel-accent-pink,
.panel-accent-purple,
.panel-accent-teal {
    border-top: 0 !important;
    border-top-color: transparent !important;
}

.client-home-panels .panel > .panel-heading,
.panel-default > .panel-heading {
    border-top: 0 !important;
    border-radius: 0 !important;
}

/* Tables — kill Six green header accents */
.dataTables_wrapper table.table-list thead th,
.dataTables_wrapper table.table-list thead th:nth-child(even),
table.table-list thead th {
    background: #fafafa !important;
    border-bottom: 1px solid var(--theme-border) !important;
    color: var(--theme-body) !important;
    font-weight: 500 !important;
    text-align: start !important;
}

.table-list > tbody > tr:hover > td {
    background: var(--theme-primary-25) !important;
}

.dataTables_wrapper .dataTables_filter label .form-control,
.dataTables_wrapper .dataTables_filter input[type="search"] {
    border: 1px solid #e4e6e7 !important;
    border-radius: 9999px !important;
    box-shadow: none !important;
    font-family: var(--theme-font) !important;
}

.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span {
    background-color: var(--theme-primary-color) !important;
    border-color: var(--theme-primary-color) !important;
}

.pagination > li > a,
.pagination > li > span {
    border-radius: 12px !important;
    border-color: var(--theme-border) !important;
}

/* Navbar hover brand */
.main-navbar .navbar-nav > li > a:hover,
.main-navbar .navbar-nav > li > a:focus {
    color: var(--theme-primary-color) !important;
}

.main-navbar .navbar-nav > .active > a,
.main-navbar .navbar-nav > .active > a:hover {
    color: var(--theme-primary-color) !important;
}

/* Forms */
.form-control:focus {
    border-color: var(--theme-primary-color) !important;
    box-shadow: 0 0 0 3px rgba(0, 161, 211, 0.15) !important;
}

/* Alerts */
.alert-success {
    background: #ecfdf3 !important;
    border-color: #abefc6 !important;
    color: #067647 !important;
}
.alert-info {
    background: var(--theme-primary-light-color) !important;
    border-color: #bfeaff !important;
    color: var(--theme-primary-hover) !important;
}
.alert-warning {
    background: #fffaeb !important;
    border-color: #fedf89 !important;
    color: #b54708 !important;
}
.alert-danger {
    background: #fef3f2 !important;
    border-color: #fecdca !important;
    color: #b42318 !important;
}

/* Login */
.logincontainer .btn-primary {
    min-height: 40px;
    padding-inline: 20px;
}

/* ------------------------------------------------------------------
   Active services panel — card list + site-style action button
------------------------------------------------------------------ */
body.rr-theme #servicesPanel .panel-title {
    color: #003245 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}

body.rr-theme #servicesPanel .panel-title .pull-right a {
    font-size: 13px !important;
    font-weight: 500 !important;
}

body.rr-theme #servicesPanel .list-group {
    max-height: 336px;
    padding: 2px 4px 2px 0;
    scrollbar-width: thin;
    scrollbar-color: #d0d5dd transparent;
}

body.rr-theme #servicesPanel .list-group::-webkit-scrollbar {
    width: 6px;
}

body.rr-theme #servicesPanel .list-group::-webkit-scrollbar-thumb {
    border-radius: 9999px;
    background: #d0d5dd;
}

body.rr-theme #servicesPanel .list-group::-webkit-scrollbar-track {
    background: transparent;
}

body.rr-theme #servicesPanel .list-group-item {
    padding: 14px 16px;
    margin-bottom: 10px;
    border: 1px solid #e4e6e7 !important;
    border-radius: var(--theme-radius-card) !important;
    background: #fff;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

body.rr-theme #servicesPanel .list-group-item:hover {
    border-color: var(--theme-primary-color) !important;
    background: var(--theme-primary-25);
}

body.rr-theme #servicesPanel .list-group-item:last-child {
    margin-bottom: 0;
}

body.rr-theme #servicesPanel .div-service-item > div {
    gap: 12px;
    padding: 0 !important;
}

body.rr-theme #servicesPanel .list-group-item .div-service-name {
    margin-bottom: 4px;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #003245 !important;
    line-height: 1.45;
}

body.rr-theme #servicesPanel .div-service-name .d-flex {
    align-items: center;
    gap: 4px;
    margin-top: 2px;
}

body.rr-theme #servicesPanel .text-domain {
    display: inline-block !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: var(--theme-primary-color) !important;
    direction: ltr;
}

/* Status → pill, consistent with the tables' status vocabulary */
body.rr-theme #servicesPanel .list-group-item .div-service-status {
    margin-top: 8px;
}

body.rr-theme #servicesPanel .list-group-item .div-service-status .label:not(.label-placeholder) {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    min-height: 26px;
    padding: 4px 12px 4px 10px !important;
    border: 1px solid #abefc6 !important;
    border-radius: 9999px !important;
    background-color: #ecfdf3 !important;
    color: #067647 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

body.rr-theme #servicesPanel .list-group-item .div-service-status .label-placeholder {
    display: none !important;
}

body.rr-theme #servicesPanel .list-group-item .div-service-status .label:not(.label-placeholder)::before {
    content: "";
    display: inline-block;
    flex-shrink: 0;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

/* Dropdown caret next to the domain — neutral, not a CTA */
body.rr-theme #servicesPanel .div-service-name .btn-group > .btn.dropdown-toggle {
    min-height: 0 !important;
    height: auto !important;
    padding: 2px 6px !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: transparent !important;
    color: #61686a !important;
}

body.rr-theme #servicesPanel .div-service-name .btn-group > .btn.dropdown-toggle:hover {
    background: #f2f4f7 !important;
    color: #101828 !important;
}

/* View details → site secondary button */
body.rr-theme #servicesPanel .btn-view-details,
body.rr-theme .btn-view-details.rounded-10.border-1 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-height: 36px;
    padding: 6px 16px !important;
    border-width: 1px 0 3px 0 !important;
    border-style: solid !important;
    border-color: var(--theme-primary-500) !important;
    border-radius: var(--theme-radius-btn) !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    color: var(--theme-primary-color) !important;
    font-family: var(--theme-font) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    white-space: nowrap;
}

body.rr-theme #servicesPanel .btn-view-details:hover,
body.rr-theme #servicesPanel .btn-view-details:focus {
    background: var(--theme-primary-light-color) !important;
    border-color: var(--theme-primary-500) !important;
    color: var(--theme-primary-hover) !important;
}

body.rr-theme #servicesPanel .btn-view-details:active {
    background: var(--theme-primary-25) !important;
}

@media (max-width: 600px) {
    body.rr-theme #servicesPanel .div-service-item > div {
        flex-direction: column;
        align-items: stretch !important;
    }

    body.rr-theme #servicesPanel .btn-view-details {
        width: 100%;
    }
}

/* ------------------------------------------------------------------
   Tables — clearer layout (card, header, rows, status)
------------------------------------------------------------------ */
body.rr-theme .table-container {
    padding: 0 !important;
    margin-bottom: 24px;
    background: transparent;
    border: 0;
    box-shadow: none;
    overflow: visible;
}

body.rr-theme .dataTables_wrapper {
    background: #fff;
    border: 1px solid #e4e6e7;
    border-radius: 20px;
    overflow: hidden;
    direction: rtl;
    text-align: start;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

/* Toolbar */
body.rr-theme .dataTables_wrapper .listtable {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
    background: #f7f8f8;
    border-bottom: 1px solid #e4e6e7;
}

body.rr-theme .dataTables_wrapper .dataTables_info,
body.rr-theme div.dataTables_wrapper div.dataTables_info {
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    color: #61686a !important;
    font-size: 13px !important;
    font-weight: 400 !important;
}

body.rr-theme .dataTables_wrapper .dataTables_filter {
    float: none !important;
    margin: 0 !important;
}

body.rr-theme .dataTables_wrapper .dataTables_filter label {
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0;
    color: transparent;
}

body.rr-theme .dataTables_wrapper .dataTables_filter label .form-control,
body.rr-theme .dataTables_wrapper .dataTables_filter input[type="search"] {
    width: 240px !important;
    max-width: 100%;
    height: 40px !important;
    margin: 0 !important;
    padding-block: 0 !important;
    padding-inline: 40px 14px !important;
    border: 1px solid #e4e6e7 !important;
    border-radius: 9999px !important;
    background-color: #fff !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23949b9d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='M11 11l3.5 3.5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    box-shadow: none !important;
    color: #181a1a !important;
    font-family: var(--theme-font, inherit) !important;
    font-size: 14px !important;
    text-align: start;
    direction: rtl;
}

body.rr-theme .dataTables_wrapper .dataTables_filter label .form-control:focus {
    border-color: var(--theme-primary-color, #00a1d3) !important;
    outline: none;
}

/* Title row inside thead (Six pattern) */
body.rr-theme table.table-list thead tr:first-child th[colspan],
body.rr-theme .dataTables_wrapper table.table-list thead tr:first-child th[colspan] {
    padding: 16px 18px 12px !important;
    background: #fff !important;
    border: 0 !important;
    border-bottom: 1px solid #e4e6e7 !important;
    text-align: start !important;
}

body.rr-theme .table-title,
body.rr-theme h5.table-title {
    margin: 0 !important;
    color: #003245 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}

/* Column headers */
body.rr-theme table.table-list,
body.rr-theme .dataTables_wrapper table.table-list,
body.rr-theme table.dataTable {
    width: 100% !important;
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: #fff !important;
}

body.rr-theme table.table-list thead th,
body.rr-theme .dataTables_wrapper table.table-list thead th,
body.rr-theme table.dataTable thead th {
    padding: 12px 16px !important;
    background: #f3f5f6 !important;
    border: 0 !important;
    border-bottom: 2px solid #e4e6e7 !important;
    color: #303435 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.01em;
    text-align: start !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

body.rr-theme .dataTables_wrapper table.table-list thead th:nth-child(even),
body.rr-theme table.table-list thead th:nth-child(even) {
    background: #f3f5f6 !important;
    border-bottom: 2px solid #e4e6e7 !important;
}

body.rr-theme .dataTables_wrapper table.table-list thead th.sorting_asc,
body.rr-theme .dataTables_wrapper table.table-list thead th.sorting_desc,
body.rr-theme table.table-list thead th.sorting_asc,
body.rr-theme table.table-list thead th.sorting_desc {
    background: #eaf7fc !important;
    color: var(--theme-primary-color, #00a1d3) !important;
}

/* Body cells */
body.rr-theme table.table-list tbody td,
body.rr-theme .dataTables_wrapper table.table-list tbody td,
body.rr-theme table.dataTable tbody td {
    padding: 14px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid #eef0f0 !important;
    background: #fff !important;
    color: #494e4f !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    text-align: start !important;
    vertical-align: middle !important;
}

body.rr-theme .table-list > tbody > tr:nth-child(even) > td {
    background: #fafbfb !important;
}

body.rr-theme .table-list > tbody > tr:hover > td,
body.rr-theme .dataTables_wrapper table.table-list tbody tr:hover > td {
    background: #f4fbff !important;
    cursor: pointer;
}

body.rr-theme .table-list > tbody > tr:last-child > td {
    border-bottom: 0 !important;
}

/* Hierarchy: primary vs secondary lines */
body.rr-theme .table-list strong {
    color: #003245 !important;
    font-weight: 600 !important;
}

body.rr-theme .table-list > tbody > tr > td a,
body.rr-theme .table-list .fs-14,
body.rr-theme .table-list td .fs-14 {
    color: var(--theme-primary-color, #00a1d3) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    text-decoration: none;
}

body.rr-theme .table-list > tbody > tr > td a:hover {
    text-decoration: underline;
}

body.rr-theme .table-list td .fs-14:not(a) {
    color: #61686a !important;
}

/* SSL icon column — compact */
body.rr-theme .table-list tbody td.ssl-info,
body.rr-theme .table-list tbody td.text-center.ssl-info,
body.rr-theme .table-list thead th:first-child {
    width: 44px;
    max-width: 52px;
    padding-inline: 10px !important;
}

body.rr-theme .table-list tbody td.ssl-info img {
    width: 18px;
    height: 18px;
}

/* Status pills — flex + dot (no absolute %) */
body.rr-theme .label.status,
body.rr-theme span.status,
body.rr-theme .status {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding: 4px 12px 4px 10px !important;
    border-radius: 9999px !important;
    border: 1px solid transparent;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    white-space: nowrap;
    position: relative;
}

body.rr-theme .status::before,
body.rr-theme .label.status::before,
body.rr-theme .status-active::before,
body.rr-theme .status-paid::before,
body.rr-theme .status-open::before,
body.rr-theme .status-terminated::before,
body.rr-theme .status-unpaid::before,
body.rr-theme .status-closed::before,
body.rr-theme .status-expired::before,
body.rr-theme .status-pending::before,
body.rr-theme .status-suspended::before,
body.rr-theme .status-cancelled::before {
    content: "" !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
    display: inline-block;
    flex-shrink: 0;
    width: 7px !important;
    height: 7px !important;
    border-radius: 50%;
    background-color: currentColor;
}

body.rr-theme .status-active,
body.rr-theme .label.status-active,
body.rr-theme .status-paid,
body.rr-theme .label.status-paid,
body.rr-theme .status-open {
    color: #067647 !important;
    background: #ecfdf3 !important;
    border-color: #abefc6 !important;
}

body.rr-theme .status-active::before,
body.rr-theme .status-paid::before,
body.rr-theme .status-open::before {
    background-color: #067647 !important;
}

body.rr-theme .status-pending,
body.rr-theme .label.status-pending {
    color: #b54708 !important;
    background: #fffaeb !important;
    border-color: #fedf89 !important;
}

body.rr-theme .status-pending::before {
    background-color: #b54708 !important;
}

body.rr-theme .status-terminated,
body.rr-theme .status-unpaid,
body.rr-theme .status-closed,
body.rr-theme .status-cancelled,
body.rr-theme .status-suspended,
body.rr-theme .label.status-terminated,
body.rr-theme .label.status-unpaid,
body.rr-theme .label.status-cancelled {
    color: #b42318 !important;
    background: #fef3f2 !important;
    border-color: #fecdca !important;
}

body.rr-theme .status-terminated::before,
body.rr-theme .status-unpaid::before,
body.rr-theme .status-closed::before,
body.rr-theme .status-cancelled::before,
body.rr-theme .status-suspended::before {
    background-color: #b42318 !important;
}

body.rr-theme .status-expired,
body.rr-theme .label.status-expired {
    color: #494e4f !important;
    background: #f2f3f3 !important;
    border-color: #e4e6e7 !important;
}

body.rr-theme .status-expired::before {
    background-color: #61686a !important;
}

/* Footer: length + pagination */
body.rr-theme .dataTables_wrapper .dataTables_length,
body.rr-theme .dataTables_wrapper .dataTables_paginate {
    background: #f7f8f8 !important;
    border-top: 1px solid #e4e6e7;
}

body.rr-theme .dataTables_wrapper .dataTables_length label {
    padding: 12px 16px !important;
    color: #61686a !important;
    font-size: 13px !important;
}

body.rr-theme .dataTables_wrapper .dataTables_length label .form-control {
    height: 32px !important;
    border: 1px solid #e4e6e7 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

body.rr-theme .dataTables_wrapper .dataTables_paginate {
    float: none !important;
    width: auto !important;
    display: inline-block !important;
    padding: 10px 16px !important;
    justify-content: flex-start !important;
}

body.rr-theme .dataTables_wrapper .dataTables_paginate .pagination > li > a,
body.rr-theme .dataTables_wrapper .dataTables_paginate .pagination > li > span {
    min-width: 34px;
    height: 34px;
    margin-inline: 2px;
    padding: 0 8px !important;
    border: 1px solid #e4e6e7 !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #494e4f !important;
    line-height: 32px !important;
}

body.rr-theme .pagination > .active > a,
body.rr-theme .pagination > .active > a:hover,
body.rr-theme .pagination > .active > span {
    background: var(--theme-primary-color, #00a1d3) !important;
    border-color: var(--theme-primary-color, #00a1d3) !important;
    color: #fff !important;
}

@media (max-width: 600px) {
    body.rr-theme .dataTables_wrapper .listtable {
        flex-direction: column;
        align-items: stretch;
    }

    body.rr-theme .dataTables_wrapper .dataTables_filter label .form-control {
        width: 100% !important;
    }
}

/* ------------------------------------------------------------------
   Product details / module buttons — fix invisible text + site style
   Root cause: solid brand backgrounds on .btn-default (cyan text)
------------------------------------------------------------------ */
body.rr-theme .product-details-card .btn,
body.rr-theme .module-client-area .btn,
body.rr-theme .product-details .btn,
body.rr-theme .product-actions-wrapper .btn,
body.rr-theme .cpanel-feature-row .btn,
body.rr-theme #tabOverview .btn,
body.rr-theme #frmCreateEmailAccount .btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 8px 16px !important;
    border-radius: var(--theme-radius-btn) !important;
    border-style: solid !important;
    background-image: none !important;
    box-shadow: none !important;
    font-family: var(--theme-font) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    text-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Filled primary CTAs — white text always wins */
body.rr-theme .product-details-card .btn-primary,
body.rr-theme .product-details-card .btn-success,
body.rr-theme .product-details-card .btn-info,
body.rr-theme .module-client-area .btn-primary,
body.rr-theme .module-client-area .btn-success,
body.rr-theme .module-client-area .btn-info,
body.rr-theme .product-details .btn-primary,
body.rr-theme .product-details .btn-success,
body.rr-theme .product-actions-wrapper .btn-primary,
body.rr-theme .product-actions-wrapper .btn-success,
body.rr-theme #tabOverview .btn-primary,
body.rr-theme #tabOverview .btn-success,
body.rr-theme #tabOverview .btn-info,
body.rr-theme .panel-body > .btn-success,
body.rr-theme .panel-body > form > .btn-success,
body.rr-theme .panel-body form .btn-success,
body.rr-theme .panel-body form .btn-primary,
body.rr-theme a.btn-success,
body.rr-theme input.btn-success,
body.rr-theme button.btn-success,
body.rr-theme a.btn-primary,
body.rr-theme input.btn-primary,
body.rr-theme button.btn-primary {
    background-color: var(--theme-primary-color) !important;
    border-width: 0 0 3px 0 !important;
    border-color: var(--theme-primary-500) !important;
    color: #fff !important;
}

body.rr-theme .product-details-card .btn-primary:hover,
body.rr-theme .product-details-card .btn-success:hover,
body.rr-theme .module-client-area .btn-primary:hover,
body.rr-theme .module-client-area .btn-success:hover,
body.rr-theme .product-actions-wrapper .btn-primary:hover,
body.rr-theme .product-actions-wrapper .btn-success:hover,
body.rr-theme #tabOverview .btn-primary:hover,
body.rr-theme #tabOverview .btn-success:hover,
body.rr-theme a.btn-success:hover,
body.rr-theme a.btn-primary:hover {
    background-color: var(--theme-primary-hover) !important;
    border-color: var(--theme-primary-500) !important;
    color: #fff !important;
}

/* Outline secondary — brand text on transparent (NOT solid fill) */
body.rr-theme .product-details-card .btn-default,
body.rr-theme .module-client-area .btn-default,
body.rr-theme .product-details .btn-default,
body.rr-theme #tabOverview .btn-default,
body.rr-theme .panel-body .btn-default,
body.rr-theme a.btn-default {
    background-color: transparent !important;
    border-width: 1px 0 3px 0 !important;
    border-color: var(--theme-primary-500) !important;
    color: var(--theme-primary-color) !important;
}

body.rr-theme .product-details-card .btn-default:hover,
body.rr-theme .module-client-area .btn-default:hover,
body.rr-theme #tabOverview .btn-default:hover,
body.rr-theme a.btn-default:hover {
    background-color: var(--theme-primary-light-color) !important;
    color: var(--theme-primary-hover) !important;
}

/* Icons inside filled buttons stay white */
body.rr-theme .btn-primary i,
body.rr-theme .btn-success i,
body.rr-theme .btn-info i,
body.rr-theme .btn-danger i,
body.rr-theme a.btn-primary i,
body.rr-theme a.btn-success i,
body.rr-theme a.btn-info i {
    color: #fff !important;
}

body.rr-theme .btn-default i,
body.rr-theme a.btn-default i {
    color: var(--theme-primary-color) !important;
}

/* Kill legacy “paint every paragraph link as a solid button” leftovers */
body.rr-theme .panel-body p a.btn,
body.rr-theme .product-details-card .panel-body p a.btn {
    display: inline-flex !important;
}

body.rr-theme .panel-body p a:not(.btn) {
    background: transparent !important;
}

/* ------------------------------------------------------------------
   View ticket — visual redesign only; existing template stays intact
------------------------------------------------------------------ */

/* Collapsible reply form */
body.rr-theme .main-content > .panel.panel-info.panel-collapsable {
    margin-bottom: 24px;
    border: 1px solid #e4e6e7 !important;
    border-radius: var(--theme-radius-card) !important;
    background: #fff !important;
    box-shadow: none !important;
    overflow: hidden;
}

body.rr-theme #ticketReply.panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 56px;
    padding: 14px 18px !important;
    border: 0 !important;
    border-bottom: 1px solid #e4e6e7 !important;
    border-radius: 0 !important;
    background: #f7f8f8 !important;
    color: #003245 !important;
    cursor: pointer;
}

body.rr-theme #ticketReply .panel-title {
    margin: 0;
    color: #003245 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
}

body.rr-theme #ticketReply .panel-title > i {
    margin-inline-end: 6px;
    color: var(--rr-icon, #61686a) !important;
}

body.rr-theme #ticketReply .collapse-icon {
    order: 2;
    float: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: #fff;
    color: #61686a;
}

body.rr-theme #ticketReply + .panel-body {
    padding: 22px 18px !important;
    background: #fff;
}

body.rr-theme #frmReply .form-group {
    margin-bottom: 18px;
}

body.rr-theme #frmReply label {
    display: block;
    margin-bottom: 7px;
    color: #303435;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-align: start;
}

body.rr-theme #frmReply .form-control {
    min-height: 42px;
    padding: 9px 12px;
    border: 1px solid #d0d5dd !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: none !important;
    color: #181a1a !important;
    font-family: var(--theme-font) !important;
    font-size: 14px !important;
    text-align: start;
}

body.rr-theme #frmReply .form-control:focus {
    border-color: var(--theme-primary-color) !important;
    box-shadow: 0 0 0 3px rgba(0, 161, 211, 0.12) !important;
}

body.rr-theme #frmReply .form-control[disabled] {
    background: #f7f8f8 !important;
    color: #61686a !important;
    opacity: 1;
}

body.rr-theme #frmReply input[type="file"].form-control {
    height: auto !important;
    padding: 7px 10px;
}

body.rr-theme #frmReply .ticket-attachments-message {
    margin-top: 7px;
    color: #61686a !important;
    font-size: 12px !important;
    line-height: 1.6;
    text-align: start;
}

body.rr-theme #frmReply > .form-group.text-center {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 22px 0 0;
}

/* Conversation messages */
body.rr-theme .ticket-reply {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    margin: 0 0 16px;
    padding: 0 !important;
    border: 1px solid #e4e6e7 !important;
    border-radius: var(--theme-radius-card) !important;
    background: #fff !important;
    box-shadow: none !important;
    overflow: hidden;
    direction: rtl;
    text-align: start;
}

body.rr-theme .ticket-reply.staff {
    border-color: #bfeaff !important;
    background: #fff !important;
}

body.rr-theme .ticket-reply .user {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    margin: 0 !important;
    padding: 14px 18px !important;
    border-bottom: 1px solid #eef0f0;
    background: #f7f8f8 !important;
    text-align: start;
}

body.rr-theme .ticket-reply.staff .user {
    background: var(--theme-primary-25) !important;
}

body.rr-theme .ticket-reply .user > i {
    float: right !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin-inline-end: 10px;
    padding: 0 !important;
    border-radius: 50%;
    background: #fff;
    color: #61686a !important;
    font-size: 14px !important;
}

body.rr-theme .ticket-reply.staff .user > i {
    background: #eaf7fc;
}

body.rr-theme .ticket-reply .user .name {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    color: #181a1a;
    font-size: 14px !important;
    font-weight: 600;
    line-height: 1.4;
}

body.rr-theme .ticket-reply .user .type {
    display: block;
    margin-top: 3px;
    color: #61686a;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.4;
}

body.rr-theme .ticket-reply .user .label {
    padding: 3px 8px !important;
    border: 1px solid #e4e6e7;
    border-radius: 9999px !important;
    background: #fff !important;
    color: #61686a !important;
    font-size: 10px !important;
    font-weight: 500 !important;
}

body.rr-theme .ticket-reply .date {
    grid-column: 2;
    grid-row: 1;
    float: none !important;
    display: flex;
    align-items: center;
    padding: 14px 18px !important;
    border-bottom: 1px solid #eef0f0;
    background: #f7f8f8;
    color: #61686a;
    font-size: 12px !important;
    line-height: 1.4;
    white-space: nowrap;
}

body.rr-theme .ticket-reply.staff .date {
    background: var(--theme-primary-25);
}

body.rr-theme .ticket-reply .message {
    grid-column: 1 / -1;
    grid-row: 2;
    min-height: 72px;
    padding: 18px !important;
    background: #fff;
    color: #303435;
    font-size: 14px !important;
    line-height: 1.8 !important;
    text-align: start;
    overflow-wrap: anywhere;
}

body.rr-theme .ticket-reply .message > :first-child {
    margin-top: 0;
}

body.rr-theme .ticket-reply .message > :last-child {
    margin-bottom: 0;
}

body.rr-theme .ticket-reply .message hr {
    margin: 16px 0 8px;
    border: 0;
    border-top: 1px solid #eef0f0;
}

/* Reply attachments */
body.rr-theme .ticket-reply .attachments {
    grid-column: 1 / -1;
    grid-row: 3;
    margin: 0 !important;
    padding: 12px 18px !important;
    border: 0 !important;
    border-top: 1px solid #eef0f0 !important;
    background: #f7f8f8 !important;
    color: #494e4f;
    font-size: 12px !important;
    text-align: start;
}

body.rr-theme .ticket-reply .attachments strong {
    color: #303435;
    font-weight: 600;
}

body.rr-theme .ticket-reply .attachments ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
}

body.rr-theme .ticket-reply .attachments li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border: 1px solid #e4e6e7;
    border-radius: 8px;
    background: #fff;
}

body.rr-theme .ticket-reply .attachments a {
    color: var(--theme-primary-color) !important;
    text-decoration: none;
}

body.rr-theme .ticket-reply .attachments a:hover {
    text-decoration: underline;
}

@media (max-width: 767px) {
    body.rr-theme #ticketReply + .panel-body {
        padding: 18px 14px !important;
    }

    body.rr-theme #frmReply .row.form-group .col-sm-3 {
        margin-top: 10px;
    }

    body.rr-theme .ticket-reply {
        display: block;
    }

    body.rr-theme .ticket-reply .user {
        padding: 12px 14px !important;
        border-bottom: 0;
    }

    body.rr-theme .ticket-reply .date {
        padding: 0 14px 10px !important;
        border-bottom: 1px solid #eef0f0;
        background: #f7f8f8;
        white-space: normal;
    }

    body.rr-theme .ticket-reply.staff .date {
        background: var(--theme-primary-25);
    }

    body.rr-theme .ticket-reply .message {
        min-height: 0;
        padding: 14px !important;
    }

    body.rr-theme .ticket-reply .attachments {
        padding: 12px 14px !important;
    }
}

/* ------------------------------------------------------------------
   Home panel header CTAs — site secondary button (not plain text links)
------------------------------------------------------------------ */
body.rr-theme .client-home-panels .panel-heading .panel-title .btn,
body.rr-theme .client-home-panels .panel-heading .panel-title .btn.btn-default,
body.rr-theme .client-home-panels .panel-heading .panel-title .btn.btn-xs,
body.rr-theme .client-home-panels .panel-heading .panel-title .btn[class*="bg-color-"] {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 32px;
    padding: 4px 12px !important;
    background: transparent !important;
    background-image: none !important;
    border-width: 1px 0 3px 0 !important;
    border-style: solid !important;
    border-color: var(--theme-primary-500) !important;
    border-radius: var(--theme-radius-btn) !important;
    box-shadow: none !important;
    color: var(--theme-primary-color) !important;
    font-family: var(--theme-font) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    text-shadow: none !important;
    white-space: nowrap;
}

body.rr-theme .client-home-panels .panel-heading .panel-title .btn:hover,
body.rr-theme .client-home-panels .panel-heading .panel-title .btn:focus,
body.rr-theme .client-home-panels .panel-heading .panel-title .btn[class*="bg-color-"]:hover {
    background: var(--theme-primary-light-color) !important;
    border-color: var(--theme-primary-500) !important;
    color: var(--theme-primary-hover) !important;
}

body.rr-theme .client-home-panels .panel-heading .panel-title .btn i {
    color: var(--theme-primary-color) !important;
    margin: 0 !important;
}

body.rr-theme .client-home-panels .panel-heading .panel-title .btn:hover i {
    color: var(--theme-primary-hover) !important;
}


/* ==================================================================
   System-wide design normalization — Rubik + Reeras color scale
   Overrides leftover Six navy/teal/green sizes without touching HTML
================================================================== */

body.rr-theme,
body.rr-theme body,
body.rr-theme p,
body.rr-theme span,
body.rr-theme div,
body.rr-theme a,
body.rr-theme li,
body.rr-theme td,
body.rr-theme th,
body.rr-theme label,
body.rr-theme input,
body.rr-theme select,
body.rr-theme textarea,
body.rr-theme button,
body.rr-theme .btn,
body.rr-theme .form-control,
body.rr-theme .panel,
body.rr-theme .panel-title,
body.rr-theme .table,
body.rr-theme .dropdown-menu,
body.rr-theme .list-group-item,
body.rr-theme .modal,
body.rr-theme .alert,
body.rr-theme .badge,
body.rr-theme .label:not(.status),
body.rr-theme h1,
body.rr-theme h2,
body.rr-theme h3,
body.rr-theme h4,
body.rr-theme h5,
body.rr-theme h6 {
    font-family: var(--theme-font) !important;
}

body.rr-theme {
    background: var(--theme-page) !important;
    color: var(--theme-body) !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

body.rr-theme section#main-body {
    background: var(--theme-page) !important;
}

/* Typography scale */
body.rr-theme h1,
body.rr-theme .h1 {
    font-size: 24px !important;
    font-weight: 600 !important;
    color: var(--theme-headline) !important;
    line-height: 1.4 !important;
}

body.rr-theme h2,
body.rr-theme .h2 {
    font-size: 20px !important;
    font-weight: 600 !important;
    color: var(--theme-headline) !important;
}

body.rr-theme h3,
body.rr-theme .h3,
body.rr-theme .panel-title,
body.rr-theme .table-title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--theme-headline) !important;
    text-transform: none !important;
}

body.rr-theme h4,
body.rr-theme .h4 {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--theme-headline-secondary) !important;
}

body.rr-theme h5,
body.rr-theme .h5,
body.rr-theme h6,
body.rr-theme .h6 {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--theme-headline-secondary) !important;
}

body.rr-theme p,
body.rr-theme .panel-body,
body.rr-theme .list-group-item,
body.rr-theme .form-group,
body.rr-theme label,
body.rr-theme .help-block,
body.rr-theme .text-muted {
    font-size: 14px !important;
    font-weight: 400 !important;
}

body.rr-theme label {
    color: #303435 !important;
    font-weight: 500 !important;
}

body.rr-theme .text-muted,
body.rr-theme small,
body.rr-theme .small {
    color: var(--theme-body-secondary) !important;
    font-size: 12px !important;
}

/* Kill leftover navy / teal / multi-color legacy headings */
body.rr-theme #servicesPanel .panel-title,
body.rr-theme .product-details-card .panel-title,
body.rr-theme .client-home-panels .panel-title,
body.rr-theme .panel > .panel-heading .panel-title,
body.rr-theme #diskUsage,
body.rr-theme #bandwidthUsage {
    color: var(--theme-headline) !important;
    font-weight: 600 !important;
}

body.rr-theme .client-home-panels .panel > .panel-body,
body.rr-theme .client-home-panels .panel > .panel-body p {
    color: var(--theme-body) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

body.rr-theme #servicesPanel .panel-title {
    font-size: 16px !important;
}

/* Home tiles — drop rainbow icon colors */
body.rr-theme .tiles .tile .icon i,
body.rr-theme .tiles .tile:nth-child(1) .icon i,
body.rr-theme .tiles .tile:nth-child(2) .icon i,
body.rr-theme .tiles .tile:nth-child(3) .icon i,
body.rr-theme .tiles .tile:nth-child(4) .icon i {
    color: var(--theme-primary-color) !important;
}

body.rr-theme .tiles .tile .stat,
body.rr-theme .tiles .tile .title {
    color: var(--theme-headline) !important;
    font-weight: 600 !important;
}

body.rr-theme .tiles .tile .title {
    font-size: 13px !important;
    color: var(--theme-body-secondary) !important;
    font-weight: 500 !important;
}

body.rr-theme .tiles .tile .stat {
    font-size: 22px !important;
}

/* Forms */
body.rr-theme .form-control,
body.rr-theme select.form-control,
body.rr-theme textarea.form-control {
    font-family: var(--theme-font) !important;
    font-size: 14px !important;
    color: var(--theme-black) !important;
    border-color: var(--theme-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

body.rr-theme .form-control:focus {
    border-color: var(--theme-primary-color) !important;
    box-shadow: 0 0 0 3px rgba(0, 161, 211, 0.12) !important;
}

body.rr-theme .form-control::placeholder {
    color: var(--theme-muted) !important;
}

/* Panels / cards */
body.rr-theme .panel,
body.rr-theme .panel-default,
body.rr-theme .panel-info {
    border-color: var(--theme-border) !important;
    border-radius: var(--theme-radius-card) !important;
    background: var(--theme-surface) !important;
    box-shadow: none !important;
    color: var(--theme-body) !important;
}

body.rr-theme .panel > .panel-heading {
    background: var(--theme-surface-muted) !important;
    border-bottom: 1px solid var(--theme-border) !important;
    color: var(--theme-headline) !important;
    font-size: 14px !important;
}

body.rr-theme .panel-body {
    color: var(--theme-body) !important;
}

body.rr-theme .list-group-item {
    color: var(--theme-body) !important;
    border-color: var(--theme-border-soft) !important;
    font-size: 14px !important;
}

body.rr-theme .list-group-item:hover,
body.rr-theme a.list-group-item:hover {
    background: var(--theme-primary-25) !important;
    color: var(--theme-primary-color) !important;
}

/* Tables */
body.rr-theme table,
body.rr-theme .table,
body.rr-theme .table-list {
    font-family: var(--theme-font) !important;
    color: var(--theme-body) !important;
    font-size: 14px !important;
}

body.rr-theme table thead th,
body.rr-theme .table > thead > tr > th {
    color: #303435 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

body.rr-theme table tbody td,
body.rr-theme .table > tbody > tr > td {
    color: var(--theme-body) !important;
    font-size: 14px !important;
}

body.rr-theme table strong,
body.rr-theme .table strong {
    color: var(--theme-headline) !important;
    font-weight: 600 !important;
}

/* Sidebar */
body.rr-theme .panel-sidebar .panel-title,
body.rr-theme .sidebar .panel-title {
    color: var(--theme-headline) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

body.rr-theme .panel-sidebar .list-group-item {
    font-size: 13px !important;
    color: var(--theme-body) !important;
}

body.rr-theme .panel-sidebar a.list-group-item.active,
body.rr-theme .panel-sidebar a.list-group-item.active:hover {
    background: var(--theme-primary-25) !important;
    border-color: var(--theme-primary-color) !important;
    color: var(--theme-primary-color) !important;
}

/* Product details leftovers */
body.rr-theme .product-details-card #tabOverview > .row:first-of-type div.col-md-6 .panel-title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--theme-headline) !important;
}

body.rr-theme .product-status-text,
body.rr-theme .product-details h4 {
    color: var(--theme-body-secondary) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

body.rr-theme .product-details h3 {
    color: var(--theme-headline) !important;
    font-size: 18px !important;
}

/* Alerts */
body.rr-theme .alert {
    font-family: var(--theme-font) !important;
    font-size: 14px !important;
    border-radius: 12px !important;
}

/* Breadcrumbs / page chrome leftovers */
body.rr-theme .breadcrumb {
    font-size: 12px !important;
    background: transparent !important;
}

body.rr-theme .home-kb-search .form-control {
    font-size: 14px !important;
    color: var(--theme-black) !important;
}

/* Badges */
body.rr-theme .badge {
    font-family: var(--theme-font) !important;
    font-weight: 500 !important;
    font-size: 11px !important;
}

/* Drop Six welcome gradient leftovers if still visible outside cart pages */
body.rr-theme #welcome.rr-page-hero-wrap {
    background: #fff !important;
    background-image: none !important;
}

/* Affiliate / misc headings */
body.rr-theme .affiliate-stat,
body.rr-theme .open-ticket-title,
body.rr-theme .open-ticket-subtitle {
    font-family: var(--theme-font) !important;
    color: var(--theme-headline) !important;
    font-weight: 600 !important;
}

body.rr-theme .open-ticket-title {
    font-size: 20px !important;
}

body.rr-theme .open-ticket-subtitle {
    font-size: 14px !important;
    color: var(--theme-body-secondary) !important;
    font-weight: 400 !important;
}

/* Knowledgebase / announcements */
body.rr-theme .kbarticles a,
body.rr-theme .KnowledgebaseCategories a,
body.rr-theme div.announcement-single {
    font-family: var(--theme-font) !important;
    color: var(--theme-body) !important;
}

body.rr-theme .kbarticles a {
    color: var(--theme-primary-color) !important;
}

/* Cart / order form text */
body.rr-theme #order-standard_cart,
body.rr-theme #order-standard_cart h1,
body.rr-theme #order-standard_cart h2,
body.rr-theme #order-standard_cart h3,
body.rr-theme #order-standard_cart .cart-body {
    font-family: var(--theme-font) !important;
}

body.rr-theme #order-standard_cart h1 {
    color: var(--theme-headline) !important;
    font-size: 24px !important;
    font-weight: 600 !important;
}

/* DataTables chrome text */
body.rr-theme .dataTables_info,
body.rr-theme .dataTables_length,
body.rr-theme .dataTables_filter,
body.rr-theme .dataTables_paginate {
    font-family: var(--theme-font) !important;
    font-size: 13px !important;
    color: var(--theme-body-secondary) !important;
}

/* Reduce extreme bold weights used by Six */
body.rr-theme .panel-title,
body.rr-theme .tiles .tile .stat,
body.rr-theme .logincontainer div.header-lined h1,
body.rr-theme strong {
    font-weight: 600 !important;
}

@media (max-width: 767px) {
    body.rr-theme h1,
    body.rr-theme .h1 {
        font-size: 20px !important;
    }

    body.rr-theme h2,
    body.rr-theme .h2 {
        font-size: 18px !important;
    }

    body.rr-theme h3,
    body.rr-theme .h3,
    body.rr-theme .panel-title {
        font-size: 15px !important;
    }

    body.rr-theme .tiles .tile .stat {
        font-size: 18px !important;
    }
}

/* Register domain home panel — match system forms + buttons */
body.rr-theme #registerDomainPanel {
    padding: 0 !important;
    overflow: hidden;
}

body.rr-theme #registerDomainPanel .panel-heading {
    border-top: 0 !important;
    border-radius: 0 !important;
}

body.rr-theme #registerDomainPanel .panel-title {
    color: var(--theme-headline) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}

body.rr-theme #registerDomainPanel .panel-body {
    padding: 16px !important;
}

body.rr-theme #registerDomainPanel .input-group {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 10px;
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
}

body.rr-theme #registerDomainPanel .input-group:before,
body.rr-theme #registerDomainPanel .input-group:after {
    display: none !important;
}

body.rr-theme #registerDomainPanel .input-group .form-control {
    float: none !important;
    flex: 1 1 200px;
    width: auto !important;
    max-width: none !important;
    height: 44px !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: var(--theme-black) !important;
    font-size: 14px !important;
    text-align: start;
}

body.rr-theme #registerDomainPanel .input-group .form-control::placeholder {
    color: var(--theme-muted) !important;
    opacity: 1 !important;
}

body.rr-theme #registerDomainPanel .input-group-btn {
    float: none !important;
    display: flex !important;
    gap: 8px;
    width: auto !important;
    margin: 0 !important;
}

body.rr-theme #registerDomainPanel .input-group-btn .btn {
    float: none !important;
    min-width: 88px;
    min-height: 44px;
    margin: 0 !important;
    padding: 8px 18px !important;
    border-radius: var(--theme-radius-btn) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

body.rr-theme #registerDomainPanel .input-group-btn .btn-success {
    background: var(--theme-primary-color) !important;
    border-width: 0 0 3px 0 !important;
    border-color: var(--theme-primary-500) !important;
    color: #fff !important;
}

body.rr-theme #registerDomainPanel .input-group-btn .btn-default {
    background: transparent !important;
    border-width: 1px 0 3px 0 !important;
    border-color: var(--theme-primary-500) !important;
    color: var(--theme-primary-color) !important;
}

@media (max-width: 767px) {
    body.rr-theme #registerDomainPanel .input-group {
        flex-direction: column !important;
    }

    body.rr-theme #registerDomainPanel .input-group .form-control,
    body.rr-theme #registerDomainPanel .input-group-btn,
    body.rr-theme #registerDomainPanel .input-group-btn .btn {
        width: 100% !important;
    }

    body.rr-theme #registerDomainPanel .input-group-btn {
        flex-direction: column;
    }
}
