input {font-family: 'Montserrat';}

/* Geen horizontale scroll op mobile */
html, body {
    overflow-x: hidden !important;
    max-width: 100% !important;
}

/* ===================== FOOTER ===================== */
footer.footer{background-color:transparent;color:#000;}
footer.footer .nav-link{color:#000}
footer.footer .btn{background-color:#3a1565;color:#fff;}

/* ===================== CARD HEADERS ===================== */
.card-header{background:#f5f4f9;border-bottom:1px solid #e8e4f0;border-left:none;color:#3a1565;padding:6px 16px !important;}
.client-home-cards .card-header{background:#f5f4f9;padding:6px 16px !important;}
.client-home-cards .card-header h3,
.client-home-cards .card-header .card-title {
    font-size: 14px !important;
    line-height: 1.3 !important;
    margin-bottom: 0 !important;
}
.client-home-cards .card-header .btn {
    font-size: 11px !important;
    padding: 3px 10px !important;
}
.card-header .btn {
    border-radius: 20px !important;
    font-size: 12px !important;
    padding: 4px 14px !important;
}
.card-header .btn:hover { color: #3a1565 !important; }

/* ===================== CARD BODY ===================== */
.client-home-cards .card-body {padding-top:8px;}
.client-home-cards .card-body .list-group-item,
.client-home-cards .card-body > div {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}
#ticketsPanel .list-group-item {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}
.primary-content .card-body { overflow: inherit; }
.card-body, .card-body * {font-size:13px !important;}
.card-body h1, .card-body h2, .card-body h3, .card-body h4, .card-body h5 {font-size: revert !important; font-family: 'Montserrat' !important;}
.card-body h6.h3, .card-body .h3 {font-size: 20px !important; font-family: 'Montserrat' !important; font-weight: 600 !important; line-height: 1.3 !important;}
.card-body h3, .card-body p.h3 { font-size: 15px !important; font-weight: 600 !important; color: #3a1565 !important; }

/* ===================== CARD FOOTER ===================== */
.card-footer { background: #fff !important; }
.sidebar .card-footer { background: #fff !important; border-top: 1px solid #e8e4f0 !important; }
.sidebar .card-footer .btn {
    background: #fff !important; border: 1px solid #d0c8e8 !important;
    color: #3a1565 !important; font-weight: 400 !important; width: 100% !important;
}
.sidebar .card-footer .btn:hover { background: #f5f4f9 !important; }

/* ===================== CARDS ALGEMEEN ===================== */
.card { border-radius: 10px !important; overflow: hidden !important; }
.client-home-cards .card, .primary-content .card { margin-bottom: 20px !important; }

/* ===================== TOPBAR ===================== */
header.header .topbar{background-color:#231F20;color:#fff;}
header.header .topbar .btn{color:#fff;}
header.header .topbar .active-client .input-group-text{color:#fff;}
header.header .topbar .active-client .btn{color:#fff;}
.topbar { background-color: transparent !important; border: none !important; font-size: 12px !important; }
.topbar, .topbar * { color: rgba(255,255,255,0.85) !important; }
.topbar .btn { border-color: transparent !important; box-shadow: none !important; }
.topbar .input-group-text { background-color: transparent !important; border-color: transparent !important; }
.topbar .btn-active-client,
.topbar #accountNotifications {
    background-color: rgba(255,255,255,0.12) !important;
    border: none !important; border-radius: 4px !important; color: #fff !important;
}
.topbar .btn-group, .topbar .input-group { border: none !important; }

/* ===================== HEADER / NAVBAR ===================== */
header#header { margin-top: 0 !important; border: none !important; box-shadow: none !important; }
header.header { border-top: none !important; box-shadow: none !important; background: transparent !important; }
.navbar, .main-navbar-wrapper { border: none !important; }
.navbar-light,.main-navbar-wrapper {background: transparent !important; color:#fff;}
.navbar-light a,.navbar a{color:#fff}
.navbar li a,.navbar li a:link,.navbar li a:active,.navbar li a:visited{color:#fff;}
.navbar li a:focus,.navbar li a:hover{color:#fff; text-decoration:none;}
.dropdown-menu {margin-top:15px;}
.dropdown-menu,.dropdown-menu a:link,.dropdown-menu a:active,.dropdown-menu a:visited {color:#000 !important}
.dropdown-menu:hover {color:#999 !important}
.navbar-expand-xl, .navbar.navbar-expand-xl, .navbar-light { padding-left: 0 !important; padding-right: 0 !important; }

/* ===================== BREADCRUMB ===================== */
.master-breadcrumb { background-color: transparent !important; border: none !important; padding: 0 !important; }
.master-breadcrumb .breadcrumb { background-color: transparent !important; margin-bottom: 0 !important; padding: 8px 0 !important; }
.master-breadcrumb .breadcrumb-item,
.master-breadcrumb .breadcrumb-item a,
.master-breadcrumb .breadcrumb-item.active { color: rgba(255,255,255,0.65) !important; font-size: 12px !important; }
.master-breadcrumb .breadcrumb-item a:hover { color: #fff !important; }
.master-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,0.4) !important; }

/* ===================== AVADA HEADER ===================== */
body:not(.fusion-header-layout-v6) .fusion-header { background: transparent !important; box-shadow: none !important; }
body:not(.fusion-header-layout-v6) .fusion-header:before { display: none !important; }
.fusion-standard-logo, .fusion-mobile-logo { filter: brightness(0) invert(1) !important; }
.fusion-header,
.fusion-top-header .fusion-header,
.fusion-header-v1 .fusion-header { background-color: transparent !important; background-image: none !important; box-shadow: none !important; }
.fusion-header-wrapper { background: transparent !important; margin-bottom: 0 !important; }

/* ===================== GRADIENT HEADER ===================== */
.visiba-header-wrap {
    background: radial-gradient(ellipse 60% 400% at 0% 0%, #f020b0 0%, #c030a0 10%, #7a2090 30%, #3a1565 55%, #220d50 100%) !important;
}

/* ===================== CONTAINER BREEDTE ===================== */
.main-navbar-wrapper .container,
#main-body .container,
.topbar .container,
.master-breadcrumb .container {
    width: 100% !important; max-width: 100% !important;
    padding-left: 5% !important; padding-right: 5% !important;
    margin-left: auto !important; margin-right: auto !important;
}

/* ===================== PAGINA ACHTERGROND ===================== */
#main-body { background-color: #f8f8fc !important; }

/* ===================== HAMBURGER MENU ===================== */
.visiba-hamburger { display: none !important; }
.visiba-toggle-line { display: block; width: 22px; height: 2px; background-color: #fff; border-radius: 1px; transition: all 0.25s ease-in-out; }
.visiba-menu-close { display: none !important; }
.visiba-hamburger:focus, .visiba-hamburger:active { outline: none !important; box-shadow: none !important; border: none !important; }
.main-navbar-wrapper .navbar-nav#nav > li:first-child > a,
.main-navbar-wrapper .navbar-nav#nav > li:first-child > a.pr-4 { padding-left: 0 !important; }
.main-navbar-wrapper .navbar-nav .pr-4 { padding-right: 1.5rem !important; }

/* ===================== MOBILE ===================== */
@media (max-width: 1200px) {
    .navbar .container, .navbar-light .container, .main-navbar-wrapper .container,
    #main-body .container, .topbar .container, .master-breadcrumb .container {
        padding-left: 15px !important; padding-right: 15px !important;
    }
    .visiba-header-wrap {
        background: radial-gradient(ellipse 60% 400% at 0% 0%, #f020b0 0%, #c030a0 10%, #7a2090 30%, #3a1565 55%, #220d50 100%) !important;
    }
    .fusion-flyout-menu-toggle, .fusion-flyout-menu-icons { display: none !important; }
    .visiba-hamburger {
        display: flex !important; flex-direction: column !important; justify-content: center !important;
        gap: 5px !important; padding: 8px !important; background: transparent !important;
        border: none !important; box-shadow: none !important; outline: none !important;
        position: absolute !important; right: 15px !important; top: 50% !important;
        transform: translateY(-50%) !important; z-index: 9999 !important;
    }
    .visiba-toggle-line { width: 30px !important; height: 2px !important; }
    .fusion-header { position: relative !important; }
    header#header { display: block !important; width: 100% !important; height: auto !important; position: static !important; }
    header#header .navbar-light { display: none !important; }
    .navbar-light .container { display: flex !important; justify-content: flex-end !important; align-items: center !important; }
    .fusion-mobile-logo, .fusion-standard-logo { max-width: 160px !important; height: auto !important; }
    .sidebar .card { margin-top: 16px !important; }
    .badge.label-success, .label.label-success { font-size: 9px !important; padding: 2px 4px !important; }
}

/* ===================== MOBILE MENU ===================== */
@media (max-width: 1200px) {
    #mainNavbar.visiba-open .visiba-menu-close {
        display: block !important; position: fixed !important; top: 20px !important; right: 20px !important;
        background: transparent !important; border: none !important; font-size: 36px !important;
        color: #270f58 !important; cursor: pointer !important; z-index: 100000 !important;
        line-height: 1 !important; padding: 5px 10px !important;
    }
    .visiba-menu-close:focus { outline: none !important; }
    #mainNavbar {
        position: fixed !important; top: -1000% !important; left: 0 !important;
        width: 100% !important; height: 100vh !important;
        background-color: rgba(240, 238, 248, 0.97) !important; z-index: 99999 !important;
        overflow-y: auto !important; border-top: none !important; opacity: 0 !important;
        transition: opacity 0.4s ease 0s, top 0s ease 0.4s !important;
        display: block !important; flex-direction: column !important; justify-content: center !important;
    }
    #mainNavbar.visiba-open {
        top: 0 !important; opacity: 1 !important;
        transition: opacity 0.4s ease 0s, top 0s ease 0s !important; display: flex !important;
    }
    #mainNavbar .search { display: none !important; }
    #mainNavbar .dropdown-divider { display: none !important; }
    #mainNavbar .navbar-nav { width: 100% !important; }
    #mainNavbar .navbar-nav > li > a,
    #mainNavbar .navbar-nav > li > .nav-link,
    #mainNavbar #nav > li > a {
        color: #270f58 !important; font-size: 22px !important; font-weight: 400 !important;
        padding: 15px 20px !important; border-bottom: none !important; text-align: center !important; display: block !important;
    }
    #mainNavbar .navbar-nav > li > a:hover { color: #716cd6 !important; }
    #mainNavbar .dropdown-menu {
        background-color: transparent !important; border: none !important; border-radius: 0 !important;
        padding: 0 !important; margin: 0 !important; position: static !important;
        float: none !important; width: 100% !important; text-align: center !important;
    }
    #mainNavbar .dropdown-menu a {
        color: #716cd6 !important; font-size: 16px !important; padding: 8px 20px !important;
        border-bottom: none !important; text-align: center !important; display: block !important;
    }
    #mainNavbar .navbar-nav.toolbar {
        flex-direction: row !important; justify-content: center !important; padding: 10px 20px !important;
        border-top: 1px solid rgba(39,15,88,0.1) !important; margin-top: 20px !important; gap: 15px !important;
    }
    #mainNavbar .navbar-nav.toolbar .nav-link {
        color: #270f58 !important; border-bottom: none !important; padding: 8px !important; font-size: 16px !important;
    }
}

/* ===================== TYPOGRAFIE ===================== */
.container {font-size:13px;}
.form-control {font-size:13px;}
.input-group-text {font-size:13px;}
.btn {font-size:13px}
.modal-content {font-size:13px;}
header.header .btn {font-size:12px}
header.header .toolbar .nav-link { border: 0px; }
a {text-decoration:none;}
a:hover{text-decoration:none}
.modal {margin-top:100px;}
.breadcrumb-item { font-size: 11px; }
h1 { font-family: 'Montserrat'; font-size:32px; }
h2 { font-family: 'Montserrat'; font-size:20px; margin-bottom: 10px; margin-top: 1em; }
h4 { font-family: 'Montserrat'; font-size:15px; }
h5 { font-family: 'Montserrat'; font-size:14px; }
.font-size-36 { font-size:32px; }
.mc-promo-login .panel-heading .primary-content h3,
.mc-promo-manage .panel-heading .primary-content h3,
.primary-content .mc-promo-login .panel-heading h3,
.primary-content .mc-promo-manage .panel-heading h3,
.primary-content .promo-container .header h3,
.promo-container .header .primary-content h3 { font-family: 'Montserrat'; font-size:16px; }
.primary-content .card-title { font-family: 'Montserrat'; font-size:16px; }
.primary-content h2, .primary-content .card-title {
    font-size: 18px !important; font-weight: 600 !important; color: #3a1565 !important; margin-bottom: 10px !important;
}
.fusion-title-size-two, h2 { margin-bottom: 10px; margin-top: 1em; }

/* ===================== KNOPPEN ===================== */
.btn-success, .btn-primary, .btn-info {
    background: linear-gradient(135deg, #7a2090 0%, #3a1565 100%) !important;
    border-color: #3a1565 !important; color: #fff !important;
}
.btn-success:hover, .btn-primary:hover, .btn-info:hover {
    background: linear-gradient(135deg, #9030b0 0%, #4a1585 100%) !important;
    border-color: #4a1585 !important; color: #fff !important;
}
.btn-danger { color: #ffffff !important; }
#cPanelUsagePanel a.btn-danger { color: #ffffff !important; }

/* ===================== BADGES ===================== */
.badge, .label { font-size: 11px !important; padding: 3px 7px !important; border-radius: 4px !important; }
#ticketsPanel .badge, #ticketsPanel .label { font-size: 10px !important; padding: 2px 6px !important; }

/* ===================== PAGINATION ===================== */
.page-item.active .page-link,
.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover { background-color:#3a1565; border-color:#3a1565; }

/* ===================== STATS TILES ===================== */
.tiles.mb-4 {
    background: #eeebf5 !important; border-radius: 10px !important;
    box-shadow: 0 2px 12px rgba(58,21,101,0.08) !important; overflow: hidden !important;
}
.tiles.mb-4 a.tile { background-color: #eeebf5 !important; }
.tiles.mb-4 .col-6 { border-right: 1px solid #f0edf8 !important; }
.tiles.mb-4 .col-6:last-child, .tiles.mb-4 .col-xl-3:last-child { border-right: none !important; }
.tile .tile-icon { color: #3a1565 !important; font-size: 2rem !important; opacity: 0.7 !important; }
.tile:hover .tile-icon { opacity: 1 !important; }

/* ===================== SIDEBAR ===================== */
.sidebar .list-group-item.active,
.sidebar .list-group-item.active:focus,
.sidebar .list-group-item.active:hover {
    background-color: #eeebf5 !important; border-color: #eeebf5 !important;
    color: #3a1565 !important; border-left: 3px solid #3a1565 !important;
}
.sidebar .list-group-item:hover { background-color: #f5f4f9 !important; color: #3a1565 !important; }
.sidebar .list-group-item { font-size: 13px !important; }

/* ===================== TABELLEN ===================== */
.table td, .table th { vertical-align: middle !important; }
table.table-list thead th {
    background-color: #f5f4f9 !important; border-bottom: 1px solid #e8e4f0 !important;
    color: #3a1565 !important; font-weight: 600 !important; text-align: left !important; vertical-align: middle !important;
}
table.table-list tbody td { vertical-align: middle !important; }
table.table-list .label.status { white-space: nowrap !important; }
.table-container table.table-list {
    border-radius: 10px !important; overflow: hidden !important;
    box-shadow: 0 2px 12px rgba(58,21,101,0.08) !important;
    border-collapse: separate !important; border-spacing: 0 !important;
}
.table-list td, .table-list th, .dataTables_wrapper { font-size: 13px !important; }
.table-actions .btn, .bulk-actions .btn, .btn-group > .btn { font-size: 13px !important; }
.dropdown-item { font-size: 13px !important; }

@media (max-width: 1200px) {
    .table-container table.table-list { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; display: block !important; }
    .table-container table.table-list th, .table-container table.table-list td { white-space: nowrap !important; }
    .table-container table.table-list td .billing-cycle, .table-container table.table-list td small { white-space: normal !important; display: block !important; }
}

/* ===================== TICKETS TABEL ===================== */
#tableTicketsList th:nth-child(2), #tableTicketsList td:nth-child(2) { width: 50% !important; }
#tableTicketsList th:nth-child(3), #tableTicketsList td:nth-child(3) { width: 8% !important; white-space: nowrap !important; }

/* ===================== SERVICES TABEL ===================== */
#tableServicesList th:last-child { pointer-events: none !important; }
#tableServicesList th:last-child::before, #tableServicesList th:last-child::after { display: none !important; }
#tableServicesList th:nth-child(3), #tableServicesList th:nth-child(4), #tableServicesList th:nth-child(5) { text-align: center !important; }

/* ===================== DROPDOWN NAVBAR ===================== */
.navbar .dropdown-item:hover, .navbar .dropdown-item:focus,
.navbar .dropdown-item.active, .navbar .dropdown-item:active {
    background-color: #eeebf5 !important; color: #3a1565 !important;
}
.navbar .dropdown-item { transition: none !important; }

/* ===================== VERIFY EMAIL BANNER ===================== */
.verification-banner.email-verification {
    background: linear-gradient(135deg, #7a2090 0%, #3a1565 100%) !important;
    color: #fff !important; border: none !important; padding: 10px 0 !important;
}
.verification-banner.email-verification .text,
.verification-banner.email-verification i { color: #fff !important; }
.verification-banner.email-verification .btn-resend-verify-email {
    background: rgba(255,255,255,0.25) !important; border: 1px solid rgba(255,255,255,0.6) !important;
    color: #fff !important; font-weight: 500 !important;
}
.verification-banner.email-verification .btn-resend-verify-email:hover { background: rgba(255,255,255,0.4) !important; }
.verification-banner.email-verification .close { color: rgba(255,255,255,0.7) !important; opacity: 1 !important; }
.verification-banner.email-verification .close:hover { color: #fff !important; }

/* ===================== RECAPTCHA ===================== */
.grecaptcha-badge { visibility: hidden !important; }

/* ===================== MOBILE FOOTER ===================== */
@media only screen and (max-width: 1024px) {
    #media_image-2 img { max-width: 160px !important; }
    .fusion-copyright-notice { font-size: 12px !important; color: rgba(255,255,255,0.8) !important; }
    .fusion-footer-widget-area .fusion-row,
    .fusion-footer-copyright-area .fusion-row { padding-left: 15px !important; padding-right: 15px !important; }
}

/* ===================== NOTIFICATIONS ===================== */
body .popover-user-notifications,
body .popover-user-notifications div,
body .popover-user-notifications p,
body .popover-user-notifications span,
body .popover-user-notifications a,
body .popover-user-notifications h3,
body .popover-user-notifications li { font-family: 'Montserrat' !important; }

/* ===================== SERVICES PANEL ===================== */
a.btn-view-more.disabled { display: none !important; }
#servicesPanel .card-footer:empty,
#servicesPanel .card-footer:has(a.btn-view-more.disabled) { display: none !important; }
.div-service-name .font-weight-bold { font-size: 13px !important; }
.div-service-name .text-domain { font-size: 12px !important; }

/* ===================== HOME CARDS ===================== */
.client-home-cards .list-group-item,
.client-home-cards .list-group-item small,
.client-home-cards .list-group-item a { font-size: 13px !important; }

/* ===================== TICKETS PANEL ===================== */
#ticketsPanel .list-group-item {
    display: flex !important; flex-direction: column !important;
    gap: 2px !important; position: relative !important;
}
#ticketsPanel .list-group-item .label {
    background: #e8e4f0 !important; color: #3a1565 !important; font-size: 10px !important;
    padding: 2px 8px !important; border-radius: 20px !important; display: inline-block !important;
    position: absolute !important; right: 16px !important; top: 50% !important; transform: translateY(-50%) !important;
}
#ticketsPanel .list-group-item br { display: none !important; }
#ticketsPanel .list-group-item small { color: #888 !important; font-size: 11px !important; }
#ticketsPanel .card-footer { display: none !important; }

/* ===================== TICKET STATUS BADGES ===================== */
.label.status.status-open { background: #15803d !important; color: #fff !important; }
.label.status.status-answered { background: #1d4ed8 !important; color: #fff !important; }
.label.status.status-customer-reply { background: #b45309 !important; color: #fff !important; }
.label.status.status-closed { background: #e8e4f0 !important; color: #3a1565 !important; }
.label.status.status-onhold { background: #6b7280 !important; color: #fff !important; }

/* ===================== PANEL TITELS ===================== */
.panel-heading .panel-title.card-title.m-0,
.card-header .panel-title.card-title.m-0 { margin-bottom: 0 !important; line-height: 1 !important; }
.panel-heading.card-header, .card-header { padding-top: 10px !important; padding-bottom: 10px !important; }

/* ===================== 360 MONITORING ===================== */
#ThreesixtymonitoringLogin small { display: none !important; }

/* ===================== SITELOCK ===================== */
#SitelockLogin small { display: none !important; }

/* ===================== UP/DOWNGRADE ===================== */
.primary-content .card-body > p { color: #3a1565 !important; font-size: 13px !important; }
.primary-content .card-body > p strong { color: #2d1a4a !important; }
.primary-content .card-body table.table-striped {
    border: 1px solid #e8e4f0 !important; border-radius: 10px !important; overflow: hidden !important; margin-top: 12px !important;
}
.primary-content .card-body table.table-striped td:first-child {
    background: #f5f4f9 !important; padding: 16px !important; vertical-align: top !important; color: #2d1a4a !important;
}
.primary-content .card-body table.table-striped td:first-child strong {
    color: #3a1565 !important; font-size: 14px !important; font-weight: 600 !important; display: block !important; margin-bottom: 8px !important;
}
.primary-content .card-body table.table-striped td.text-center {
    background: #fff !important; padding: 20px !important; vertical-align: middle !important; border-left: 1px solid #e8e4f0 !important;
}
.primary-content .card-body table.table-striped td.text-center select {
    border-color: #d0c8e8 !important; border-radius: 6px !important; color: #3a1565 !important; margin-bottom: 12px !important; width: 100% !important;
}

/* ===================== DOMAIN DETAIL ===================== */
.tab-content .card-body h5 {
    font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important;
    letter-spacing: 0.6px !important; color: #888 !important; margin-bottom: 3px !important;
}
.tab-content .card-body .row.mb-3 span,
.tab-content .card-body .row.mb-3 a,
.tab-content .card-body .row.mb-3 .col-lg-6 { font-size: 14px !important; font-weight: 500 !important; color: #2d1a4a !important; }
.tab-content .card-body .row.mb-3 .col-lg-6 h5 { font-size: 10px !important; font-weight: 700 !important; color: #888 !important; }
.tab-content .card-body ul { padding-left: 0 !important; list-style: none !important; margin-top: 8px !important; }
.tab-content .card-body ul li { padding: 7px 0 !important; border-bottom: 1px solid #ede9f5 !important; }
.tab-content .card-body ul li:last-child { border-bottom: none !important; }
.tab-content .card-body ul li a { font-size: 13px !important; font-weight: 500 !important; color: #3a1565 !important; }
.tab-content .card-body ul li a:hover { color: #6d28d9 !important; text-decoration: none !important; }
.tab-content .card-body h3.card-title { margin-top: 24px !important; margin-bottom: 12px !important; }
.tab-content .card-body h3.card-title:first-child { margin-top: 0 !important; }
.tab-content .card-body .row.mb-3 { margin-bottom: 16px !important; }

/* ===================== SSL ===================== */
.ssl-inactive img { display: none !important; }
#statusDisplayLabel {
    font-size: 12px !important; font-weight: 600 !important;
    display: inline-block !important; padding: 3px 10px !important; border-radius: 20px !important;
}
.ssl-inactive #statusDisplayLabel { background: #fef2f2 !important; color: #b91c1c !important; border: 1px solid #fecaca !important; }
.tab-content .card-body .row .col-lg-6 h5 {
    font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important;
    letter-spacing: 0.6px !important; color: #888 !important; margin-bottom: 3px !important;
}
.tab-content .card-body .row .col-lg-6 span:not(#statusDisplayLabel),
.tab-content .card-body .row .col-lg-6 #ssl-startdate,
.tab-content .card-body .row .col-lg-6 #ssl-expirydate,
.tab-content .card-body .row .col-lg-6 #ssl-issuer { font-size: 14px !important; font-weight: 500 !important; color: #2d1a4a !important; }
.tab-content .card-body .col-lg-6:not(.ssl-inactive) #statusDisplayLabel { background: #f0fdf4 !important; color: #15803d !important; border: 1px solid #bbf7d0 !important; }
.tab-content .card-body .col-lg-6:not(.ssl-inactive) img[data-type="domain"] { display: none !important; }

/* ===================== PAYMENT METHODS ===================== */
.btn-delete { border-color: #fecaca !important; color: #b91c1c !important; }
.btn-delete:hover { background: #fef2f2 !important; }
#payMethodList th {
    font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important;
    letter-spacing: 0.6px !important; color: #888 !important; background: #f5f4f9 !important; border-bottom: 1px solid #e8e4f0 !important;
}
table#payMethodList.table-striped tbody tr:nth-of-type(odd),
table#payMethodList.table-striped tbody tr:nth-of-type(even) { background-color: transparent !important; }
#payMethodList tbody tr { border-bottom: 1px solid #e8e4f0 !important; }
table#payMethodList {
    border: 1px solid #e8e4f0 !important; border-radius: 10px !important;
    overflow: hidden !important; border-collapse: separate !important; border-spacing: 0 !important;
}

@media (max-width: 768px) {
    #payMethodList { display: block !important; overflow-x: visible !important; width: 100% !important; min-width: 0 !important; }
    #payMethodList tbody { display: block !important; width: 100% !important; }
    #payMethodList tbody tr:first-child { display: none !important; }
    #payMethodList tbody tr {
        display: block !important; border: 1px solid #e8e4f0 !important; border-radius: 8px !important;
        margin-bottom: 12px !important; padding: 12px !important; background: #fff !important;
        width: 100% !important; box-sizing: border-box !important;
    }
    #payMethodList tbody td { display: flex !important; align-items: center !important; padding: 4px 0 !important; border: none !important; font-size: 13px !important; width: 100% !important; box-sizing: border-box !important; }
    #payMethodList tbody td:first-child { display: none !important; }
    #payMethodList tbody td:nth-child(2) { display: flex !important; align-items: center !important; gap: 8px !important; font-weight: 600 !important; }
    #payMethodList tbody td:nth-child(3) { color: #888 !important; font-size: 12px !important; }
    #payMethodList tbody td:nth-child(4) { margin: 6px 0 !important; }
    #payMethodList tbody td:last-child {
        display: flex !important; flex-wrap: nowrap !important; gap: 6px !important;
        margin-top: 8px !important; padding-top: 8px !important; border-top: 1px solid #f0edf8 !important;
        width: 100% !important; box-sizing: border-box !important;
    }
    #payMethodList tbody td:last-child .btn {
        flex: 1 1 0 !important; text-align: center !important; font-size: 12px !important;
        padding: 6px 4px !important; white-space: nowrap !important; min-width: 0 !important;
    }
}

/* ===================== CONTACTS ===================== */
.alert.alert-block.alert-info {
    background: linear-gradient(135deg, #7a2090 0%, #3a1565 100%) !important;
    border: none !important; color: #fff !important; border-radius: 8px !important;
}
.alert.alert-block.alert-info label { color: #fff !important; font-weight: 500 !important; }
.alert.alert-block.alert-info .form-control,
.alert.alert-block.alert-info select { background: rgba(255,255,255,0.15) !important; border-color: rgba(255,255,255,0.3) !important; color: #fff !important; }
.alert.alert-block.alert-info .btn { background: rgba(255,255,255,0.2) !important; border-color: rgba(255,255,255,0.4) !important; color: #fff !important; }
.alert.alert-block.alert-info .btn:hover { background: rgba(255,255,255,0.35) !important; }
.checkbox label, .form-check label { display: flex !important; align-items: center !important; gap: 8px !important; }
.checkbox input[type="checkbox"], .form-check input[type="checkbox"] { margin-top: 0 !important; flex-shrink: 0 !important; }
.checkbox, .form-check { margin-bottom: 4px !important; padding-top: 2px !important; padding-bottom: 2px !important; }
.controls.form-check br { display: none !important; }
.controls.form-check label { margin-bottom: 6px !important; }

/* ===================== KNOWLEDGEBASE ===================== */
.knowledgebase-search .input-group .form-control { border-color: #e8e4f0 !important; border-right: none !important; font-size: 14px !important; }
.knowledgebase-search .input-group .form-control:focus { border-color: #3a1565 !important; box-shadow: none !important; }
.knowledgebase-search .btn { background: linear-gradient(135deg, #7a2090 0%, #3a1565 100%) !important; border-color: #3a1565 !important; color: #fff !important; font-weight: 500 !important; }
.kb-search .form-control { font-size: 13px !important; height: 40px !important; }
.kb-search .btn { font-size: 13px !important; height: 40px !important; padding: 0 20px !important; }
.knowledgebase-category-list .card { border: 1px solid #e8e4f0 !important; border-radius: 10px !important; transition: box-shadow 0.2s ease !important; }
.knowledgebase-category-list .card:hover { box-shadow: 0 4px 16px rgba(58,21,101,0.12) !important; }
.knowledgebase-category-list .card a { color: #3a1565 !important; font-weight: 600 !important; font-size: 15px !important; }
.knowledgebase-category-list .card p { color: #888 !important; font-size: 12px !important; }
.kb-category .badge-info, .badge-info {
    background: linear-gradient(135deg, #7a2090 0%, #3a1565 100%) !important;
    color: #fff !important; font-size: 11px !important; padding: 4px 10px !important; border-radius: 20px !important; border: none !important;
}
.kb-category { box-shadow: 0 2px 12px rgba(58,21,101,0.08) !important; transition: box-shadow 0.2s ease, transform 0.2s ease !important; }
.kb-category:hover { box-shadow: 0 6px 20px rgba(58,21,101,0.16) !important; transform: translateY(-2px) !important; }
.knowledgebase-popular h2, .knowledgebase-popular .card-title { color: #3a1565 !important; font-size: 16px !important; }
.knowledgebase-popular .list-group-item { border-color: #f0edf8 !important; padding: 10px 0 !important; }
.knowledgebase-popular .list-group-item a { color: #3a1565 !important; font-weight: 500 !important; font-size: 13px !important; }
.knowledgebase-popular .list-group-item a:hover { color: #7a2090 !important; }
.knowledgebase-popular .list-group-item p { color: #888 !important; font-size: 12px !important; margin-bottom: 0 !important; }
.primary-content .col-xl-6 { display: flex !important; flex-direction: column !important; }
.primary-content .col-xl-6 .kb-category { flex: 1 !important; }
.kb-article-item.list-group-item, .primary-content .list-group-item { padding: 10px 16px !important; }
.primary-content .card .card-body.d-flex { padding: 12px 16px !important; }
.kb-article-item ~ .card .card-title.m-0,
.list-group-flush ~ .card .card-title.m-0,
.knowledgebase .card-title.m-0 { display: flex !important; align-items: center !important; gap: 8px !important; margin-bottom: 0 !important; }

/* ===================== SIDEBAR RECENT TICKETS ===================== */
.sidebar-menu-item-wrapper { width: 100% !important; display: flex !important; align-items: center !important; }
.sidebar-menu-item-label { width: 100% !important; flex: 1 !important; }
.recent-ticket { width: 100% !important; display: flex !important; flex-direction: column !important; }
.recent-ticket small { display: flex !important; justify-content: space-between !important; align-items: center !important; width: 100% !important; }
.recent-ticket small .pull-right { float: none !important; flex-shrink: 0 !important; color: #888 !important; font-size: 11px !important; }
.recent-ticket small span[style] { font-size: 11px !important; }

/* ===================== ADDONS PANEL ===================== */
#cPanelExtrasPurchasePanel .form-inline { display: flex !important; flex-direction: column !important; gap: 8px !important; }
#cPanelExtrasPurchasePanel select, #cPanelExtrasPurchasePanel .btn { width: 100% !important; margin: 0 !important; }
#cPanelExtrasPurchasePanel .btn { background: #e8e4f0 !important; border-color: #d0c8e8 !important; color: #3a1565 !important; }
#cPanelExtrasPurchasePanel .btn:hover { background: #d8d0ec !important; }

/* ===================== SERVICE DETAIL ===================== */
#tabOverview .row { display: flex !important; flex-wrap: wrap !important; }
#tabOverview .col-md-6 { display: flex !important; flex-direction: column !important; }
#tabOverview .col-md-6 .card, #tabOverview .col-md-6 .panel { flex: 1 !important; }
#cPanelUsagePanel .col-md-6 { display: flex !important; flex-direction: column !important; align-items: center !important; text-align: center !important; }
#cPanelUsagePanel canvas { margin: 0 auto !important; }
#cPanelUsagePanel .card-body, #cPanelUsagePanel .card, #cPanelUsagePanel { overflow: visible !important; }
#tabOverview .col-md-6 .card { overflow: visible !important; }
#cPanelUsagePanel .text-info, #cPanelUsagePanel a { color: #3a1565 !important; font-size: 11px !important; }
#cPanelBillingOverviewPanel .col-xs-6.text-right {
    font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important;
    letter-spacing: 0.6px !important; color: #888 !important; text-align: left !important;
}
#cPanelBillingOverviewPanel .col-xs-6:not(.text-right) { font-size: 14px !important; font-weight: 500 !important; color: #2d1a4a !important; }
#cPanelBillingOverviewPanel .row { margin-bottom: 6px !important; }
#cPanelConfigurableOptionsPanel .col-xs-6.text-right,
#cPanelConfigurableOptionsPanel .col-md-5.text-right {
    font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important;
    letter-spacing: 0.6px !important; color: #888 !important; text-align: left !important;
}
#cPanelConfigurableOptionsPanel .panel-body .col-md-7,
#cPanelConfigurableOptionsPanel .card-body .col-md-7 { font-size: 14px !important; font-weight: 500 !important; color: #2d1a4a !important; }
#cPanelConfigurableOptionsPanel .col-md-5 strong,
#cPanelConfigurableOptionsPanel .col-xs-6.text-right strong {
    font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important;
    letter-spacing: 0.6px !important; color: #888 !important;
}
#cPanelConfigurableOptionsPanel .row { margin-bottom: 6px !important; }
#cPanelConfigurableOptionsPanel .col-md-5 { max-width: 200px !important; flex: 0 0 200px !important; }
#cPanelConfigurableOptionsPanel .col-md-7 { flex: 1 !important; max-width: none !important; }

/* ===================== QUICK SHORTCUTS ===================== */
#cPanelQuickShortcutsPanel .panel-body,
#cPanelQuickShortcutsPanel .card-body { padding: 8px !important; }
#cPanelQuickShortcutsPanel .col-xs-3 { padding: 8px !important; }
#cPanelQuickShortcutsPanel a { padding: 8px 4px !important; }
#cPanelQuickShortcutsPanel img { max-width: 40px !important; height: 40px !important; }
#cPanelQuickShortcutsPanel .cpanel-link-text,
#cPanelQuickShortcutsPanel a span { font-size: 11px !important; }
#cPanelQuickShortcutsPanel .cpanel-feature-row { margin: 0 !important; }
#cPanelQuickShortcutsPanel .cpanel-feature-row [class*="col-"] { padding: 4px !important; flex: 0 0 16.666% !important; max-width: 16.666% !important; }
#cPanelQuickShortcutsPanel .d-block.mb-3 { margin-bottom: 4px !important; padding: 6px 4px !important; }
@media (max-width: 768px) {
    #cPanelQuickShortcutsPanel .cpanel-feature-row [class*="col-"] { flex: 0 0 33.333% !important; max-width: 33.333% !important; }
}

/* ===================== SITEJET ===================== */
#sitejetPublishPreview { max-height: 180px !important; max-width: 100% !important; border-radius: 4px !important; }
#cPanelPackagePanel .col-sm-6.text-center.d-flex.flex-column { justify-content: center !important; }

/* ===================== PRODUCT DETAIL ===================== */
.product-status-text {
    text-align: center !important; padding: 6px 0 !important; border-radius: 6px !important;
    font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.6px !important;
    text-transform: uppercase !important; margin-top: 8px !important; margin-bottom: 12px !important;
}
.product-status-active .product-status-text { background: #f0fdf4 !important; color: #15803d !important; border: 1px solid #bbf7d0 !important; }
.product-status-terminated .product-status-text { background: #fef2f2 !important; color: #b91c1c !important; border: 1px solid #fecaca !important; }
.product-status-suspended .product-status-text { background: #fffbeb !important; color: #92400e !important; border: 1px solid #fde68a !important; }
.product-status-cancelled .product-status-text { background: #f5f4f9 !important; color: #888 !important; border: 1px solid #e8e4f0 !important; }
.product-status { margin-bottom: 0 !important; }
.product-status-active, .product-status-terminated, .product-status-suspended, .product-status-cancelled {
    border: none !important; box-shadow: none !important; background: transparent !important;
}
.col-md-6.text-center h4 {
    font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important;
    letter-spacing: 0.6px !important; color: #888 !important; margin-top: 12px !important; margin-bottom: 3px !important;
}
.col-md-6.text-center { font-size: 14px !important; font-weight: 500 !important; color: #2d1a4a !important; }
.product-details-tab-container .col-sm-5.text-right strong {
    font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important;
    letter-spacing: 0.6px !important; color: #888 !important;
}
.product-details-tab-container .col-sm-5.text-right { text-align: left !important; }
.product-details-tab-container .col-sm-7.text-left { font-size: 14px !important; font-weight: 500 !important; color: #2d1a4a !important; }
.product-actions-wrapper .btn-danger {
    display: inline-block !important; width: auto !important; padding: 6px 20px !important;
    border-radius: 6px !important; font-size: 12px !important;
    background: #fef2f2 !important; border-color: #fecaca !important; color: #b91c1c !important;
}
.product-actions-wrapper .btn-danger:hover { background: #fee2e2 !important; }
.product-actions-wrapper { text-align: center !important; }

/* ===================== CANCELLATION ===================== */
.alert.alert-info {
    background: linear-gradient(135deg, #7a2090 0%, #3a1565 100%) !important;
    border: none !important; color: #fff !important; border-radius: 8px !important;
}
.alert.alert-info a { color: rgba(255,255,255,0.8) !important; }
form .btn-danger { background: #fef2f2 !important; border-color: #fecaca !important; color: #b91c1c !important; }
form .btn-danger:hover { background: #fee2e2 !important; }

/* ===================== AFFILIATES ===================== */
.affiliate-stat span { font-size: 1.6em !important; }
.affiliate-stat { padding: 15px !important; }
.affiliate-stat i { font-size: 2rem !important; }

/* ===================== LOGIN PAGINA ===================== */
.login-form .card { border-radius: 12px !important; box-shadow: 0 4px 24px rgba(58,21,101,0.12) !important; border: none !important; }
.login-form .card-footer { border-radius: 0 0 12px 12px !important; background: #f5f4f9 !important; border-top: 1px solid #e8e4f0 !important; }
.login-form .card-footer small, .login-form .card-footer a { font-size: 13px !important; }
.login-form .input-group-text { background: #f5f4f9 !important; border-color: #d0c8e8 !important; color: #3a1565 !important; }
.login-form .form-control { border-color: #d0c8e8 !important; }
.login-form .form-control:focus { border-color: #3a1565 !important; box-shadow: 0 0 0 2px rgba(58,21,101,0.1) !important; }
.login-form h6.h3 { color: #3a1565 !important; }
.login-form .card-body > .float-left,
.login-form .card-body > .text-right { float: none !important; display: inline-flex !important; align-items: center !important; vertical-align: middle !important; }
.login-form .card-body > .text-right { float: right !important; display: flex !important; align-items: center !important; height: 38px !important; }
.login-form .card-body > .text-right label { height: 38px !important; display: flex !important; align-items: center !important; gap: 6px !important; margin: 0 !important; }
.login-form .card-body > .text-right input[type="checkbox"] { margin-top: 0 !important; }