/* *****************************************************

    ** OvoServe Web Services - Custom Stylesheet **
    ** Clean Professional Login Page **

***************************************************** */

/* ===== Google Font Import ===== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    background-color: #f4f6f9;
    font-weight: 300;
    color: #2d3748;
    -webkit-font-smoothing: antialiased;
}

.text-center {
    text-align: center;
}

.color-main {
    color: #1E7F9B;
}

.color-main-darker {
    color: #19687F;
}

.color-secondary {
    color: #E6173F;
}

.color-secondary-darker {
    color: #BD1334;
}

.color-tertiary {
    color: #2F2F2F;
}

.color-white {
    color: white;
}

.color-gray {
    color: #353a47;
}

.bg-main {
    background-color: #1E7F9B;
}

.bg-main-darker {
    background-color: #19687F;
}

.bg-secondary {
    background-color: #E6173F !important;
}

.bg-secondary-darker {
    background-color: #BD1334;
}

.bg-tertiary {
    background-color: #2F2F2F;
}

.bg-white {
    background-color: white;
}

.bg-lightgray {
    background-color: #F5F5F5;
}

.bg-powerlines {
    background-image: url("/templates/six/img/power-lines.jpeg");
    background-size: cover;
    background-position: 100% 80%;
}

.bg-powerlines-2 {
    background-image: url("/templates/six/img/power-lines-2.jpeg");
    background-size: cover;
    background-position: 100% 80%;
}

.bg-windmills {
    background-image: url("/templates/six/img/windmills.jpg");
    background-size: cover;
    background-position: 100% 50%;
}

.bg-racks {
    background-image: url("/templates/six/img/racks.jpg");
    background-size: cover;
    background-position: 100% 50%;
}

.bg-laptop {
    background-color: #353a47;
    background-image: url("/templates/six/img/man-working-on-laptop.jpeg");
    background-size: cover;
    background-position: 100% 50%;
}

.bg-containers {
    background-color: #353a47;
    background-image: url("/templates/six/img/containers.jpeg");
    background-size: cover;
    background-position: 100% 65%;
}

.bg-bridge {
    background-color: #353a47;
    background-image: url("/templates/six/img/bridge.jpeg");
    background-size: cover;
    background-position: 100% 50%;
}

.bg-beach {
    background-color: #353a47;
    background-image: url("/templates/six/img/beach.jpeg");
    background-size: cover;
    background-position: 100% 100%;
}

.bg-office {
    background-color: #353a47;
    background-image: url("/templates/six/img/office.jpg");
    background-size: cover;
    background-position: 100% 50%;
}

.bg-growth {
    background-color: #353a47;
    background-image: url("/templates/six/img/growth.jpeg");
    background-size: cover;
    background-position: 100% 50%;
}

.bg-corridor {
    background-color: #353a47;
    background-image: url("/templates/six/img/corridor-lowheight.webp");
    background-size: cover;
    background-position: 100% 75%;
}

.btn-main {
    background-color: #1E7F9B;
    color: white !important;
}

.btn-main:hover {
    background-color: #1C748D;
    color: white !important;
}

.btn-main:active {
    background-color: #1C748D;
    color: white !important;
}

.btn-primary {
    background-color: #1E7F9B;
    border-color: #1E7F9B;
    color: white !important;
}

.btn-primary:hover {
    background-color: #1C748D;
    border-color: #1C748D;
    color: white !important;
}

.btn-primary:active {
    background-color: #1C748D;
    border-color: #1C748D;
    color: white !important;
}

.btn-main-darker {
    background-color: #19687F;
    color: white;
}

.btn-main-darker:hover {
    background-color: #175F74;
    color: white;
}

.btn-main-darker:active {
    background-color: #175F74;
    color: white;
}

.btn-secondary {
    background-color: #E6173F;
    border: none;
    color: white;
}

.btn-secondary:hover {
    background-color: #D2153A;
    border: none;
    color: white;
}

.btn-secondary:active {
    background-color: #D2153A;
    border: none;
    color: white;
}

.btn-danger {
    background-color: #E6173F;
    border-color: #E6173F;
    border: none;
    color: white;
}

.btn-danger:hover {
    background-color: #D2153A;
    border-color: #D2153A;
    border: none;
    color: white;
}

.btn-danger:active {
    background-color: #D2153A;
    border-color: #D2153A;
    border: none;
    color: white;
}

.btn-secondary-darker {
    background-color: #BD1334;
    color: white;
}

.btn-secondary-darker:hover {
    background-color: #AC1230;
    color: white;
}

.btn-secondary-darker:active {
    background-color: #AC1230;
    color: white;
}

.btn-tertiary {
    background-color: #2F2F2F;
    color: white;
}

.btn-tertiary:hover {
    background-color: #2B2B2B;
    color: white;
}

.btn-tertiary:active {
    background-color: #2B2B2B;
    color: white;
}

.btn-outline-dark {
    background-color: transparent;
    border: 1px solid #2F2F2F;
}

.padding-standard {
    padding: 35px;
}

.padding-slide {
    padding-top: 175px;
    padding-bottom: 175px;
}

.padding-subheader {
    padding-top: 35px;
    padding-bottom: 35px;
}

.padding-subheader-l {
    padding-top: 50px;
    padding-bottom: 50px;
}


.padding-subheader-xl {
    padding-top: 100px;
    padding-bottom: 100px;
}

.padding-box {
    padding: 10px;
}

.padding-box-l {
    padding: 15px;
}

.slide h1 {
    font-size: 50px;
}

.navigation {
    padding: 15px;
    background-color: white;
}

.top-navigation {
    background-color: #F5F5F5;
    padding: 8px 0px;
}

.top-navigation a {
    color: #353a47;
}

.top-navigation .pull-right {
    text-align: right;
}

.top-navigation .client-area {
    text-align: right !important;
}

.light {
    background-color: transparent;
}

.navbar {
    padding-right: 0px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.navbar-expand-lg .navbar-nav a {
    padding-right: 1rem;
    padding-left: 1rem;
}

.navbar-light .navbar-nav a {
    color: #212121;
    font-size: 18px;
    font-weight: 400;
}

.navbar-light .navbar-nav a:hover {
    color: #19687F;
    background-color: transparent;
}

.navbar-light .navbar-nav .active > a, .navbar-light .navbar-nav a.active, .navbar-light .navbar-nav a.show, .navbar-light .navbar-nav .show > a {
    color: #212121;
}

.footer {
    padding: 50px 0px 15px 0px;
    color: white;
    background-color: #2F2F2F;
}

.footer p {
    font-weight: 300;
    color: white;
}

.footer ul {
    list-style: none;
    padding-left: 0px;
}

.footer ul li {
    font-weight: 300;
    padding: 3px 0px;
    color: #d1d1d1;
    font-size: 16px;
}

.footer ul li a {
    color: #d1d1d1;
}

.copyright {
    padding-top: 25px;
}

.footer a, .footer-bottom a {
    text-decoration: none;
}

.footer .line {
    background-color: #BD1334;
    max-width: 40px;
    min-height: 2px;
    margin-bottom: 15px;
}

.text-center {
    text-align: center;
}

.bar-above-footer {
    background-color: #19687F;
    padding: 15px;
}

.bar-above-footer a {
    color: white;
    text-align: center;
    font-size: 20px;
    font-weight: 400;
}

.table-main thead {
    background-color: #1E7F9B;
    color: white;
}

.table-main tbody {
    background-color: white;
}

.table-main tbody tr td {
    border: 1px solid #EEEEEE;
    vertical-align: middle;

}
.breadcrumb {
    background-color: transparent;
    padding: 0px;
    margin-bottom: 0px;
    color: white;
}

.breadcrumb-item a {
    color: white;
}

.border-rounding-5 {
    border-radius: 5px;
}

.border-rounding-50 {
    border-radius: 50px;
}

.custom-form {
    height: 50px !important;
}

.custom-form-label {
    font-size: 16px;
}

.custom-form:focus {
    color: black;
    background-color: #fff;
    border-color: #0069ff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}

.custom-form-textarea {
    min-height: 250px;
    color: black !important;
}

.custom-form-textarea-smaller {
    min-height: 100px;
    color: black !important;
}

.panel {
    font-size: 1em;
    border-radius: 12px;
    overflow: hidden;
    border: none !important;
    transition: box-shadow 0.3s ease;
}

.panel-shadow {
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.panel-shadow:hover {
    box-shadow: 0 6px 24px rgba(0,0,0,0.1);
}

.panel-main {
    border: none !important;
}

.panel-main > .panel-heading {
    color: white;
    background: linear-gradient(135deg, #1E7F9B 0%, #19687F 100%);
    border: none;
    padding: 14px 20px;
}

.panel-main-borders {
    border: 1px solid #1E7F9B !important;
    border-top: none !important;
}

.panel-main-borders > .panel-heading {
    border: 1px solid #1E7F9B !important;
}

.panel-secondary {
    border: none !important;
}

.panel-secondary > .panel-heading {
    color: white;
    background: linear-gradient(135deg, #E6173F 0%, #BD1334 100%);
    border: none;
    padding: 14px 20px;
}

.panel-secondary-borders {
    border: 1px solid #E6173F !important;
    border-top: none !important;
}

.panel-secondary-borders > .panel-heading {
    border: 1px solid #E6173F !important;
}

.pricing-table {
    border-radius: 14px;
    background-color: white;
    padding: 25px 20px 25px 20px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    margin-bottom: 12px;
    margin-top: 12px;
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.04);
}
.pricing-table:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(0,0,0,0.1);
}

.no-shadow {
    -webkit-box-shadow: 0px 0px 0px 0px;
    box-shadow: 0px 0px 0px 0px;
}

.pricing-table .title {
    padding: 15px 0px 15px 0px;
}

.pricing-table .title p {
    font-weight: 500;
    font-size: 17px;
}

.pricing-table .pricing p {
    margin-bottom: 0px;
}

.pricing-features {
    margin-bottom: 25px;
}

.pricing-features ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

.pricing-features ul li {
    padding: 2.5px 0px 2.5px 0px;
}

.pricing-footer {
    padding-top: 10px;
}

.pricing-footer a {
    border-radius: 50px;
}

.cirkel {
    border-radius: 50px;
    background-color: #1E7F9B;
    width: 40px;
    height: 40px;
    display: inline-block;
    -webkit-box-shadow: 0px 0px 5px 1px #E0E0E0;
    box-shadow: 0px 0px 5px 1px #E0E0E0;
}

.cirkel-multiple {
    margin-left: -10px;
}

.cirkel-multiple-top {
    margin-top: -15px;
}

.cirkel-multiple-top-left {
    margin-left: 25px;
}

.cirkel-secondary {
    background-color: #E6173F;
}

.cirkel-tertiary {
    background-color: #2F2F2F;
}

.dc-specs {
    list-style: none;
}

.dc-specs li {
    font-size: 19px;
    padding: 5px 0px 5px 0px;
}

.box-shadow {
    -webkit-box-shadow: 0px 0px 5px 1px #EEEEEE;
    box-shadow: 0px 0px 5px 1px #EEEEEE;
}

.no-margin {
    margin: 0px;
}

.margin-bottom-25 {
    margin-bottom: 25px;
}

table.table-list th {
    text-align:left !important;
}

/*Datatables*/

.table-container {
    padding: 0px;
}

.dataTables_wrapper {
    background-color: transparent;
    border: none;
    border-radius: 0px;
    font-size: 1.0em;
}

.dataTables_wrapper .dataTables_info {
    padding: 9px 10px;
    background-color: #1E7F9B;
    border: none;
    font-size: 1.0em;
    color: white;
    text-align: left !important;
}

table.table-list thead th {
    background-color: #F5F5F5 !important;
    border-bottom: 1px solid #ccc !important;
    color: black !important;
    font-size: 14px !important;
}

/*Status badges*/

.label {
    font-size: 100%;
    border-radius: 3px;
}

.status {
    display: block;
    font-size: 1.0em;
    line-height: 22px;
    background-color: #888;
}

.status-custom {
    background-color: white;
    color: black;
    border: 1px solid black;
    padding: 1px;
}

.status-pending {
    background-color: #f44336
}
.status-pending.transfer {
    background-color: #FFC107;
}
.status-active,
.status-open {
    background-color: #4CAF50;
}
.status-suspended {
    background-color: #FF9800;
}
.status-customer-reply {
    background-color: #FF5722;
}
.status-fraud,
.status-answered {
    background-color: #424242;
}
.status-expired {
    background-color: #607D8B;
}
.status-cancelled {
    background-color: #9FA29A;
}
.status-terminated {
    background-color: #666;
}
.status-onhold {
    background-color: #224488;
}
.status-inprogress {
    background-color: #f44336;
}
.status-closed {
    background-color: #888;
}

.status-paid {
    background-color: #4CAF50;
}
.status-unpaid {
    background-color: #f44336;
}
.status-cancelled {
    background-color: #87939F;
}
.status-collections {
    background-color: #9A141E;
    color: #FFFFFF;
}
.status-refunded {
    background-color: #319FC3;
}

.status-delivered {
    background-color: #224488;
}

.status-accepted {
    background-color: #4CAF50;
}
.status-lost, .status-dead {
    background-color: #FFFFFF;
    border: 1px solid #000000;
    color: #000000;
}

.heading-no-margin h1, h2, h3, h4, h5, h6{
    margin-bottom: 0px;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    border-top: none;
}

.row .col-space-bottom > .col-sm-3 {
    margin-bottom: 10px;
}

.btn-group-sm>.btn, .btn-sm {
    font-size: 14px;
}
/**
 * WHMCS Bootstrap Override Sheet
 *
 * These styles override Bootstrap's defaults.
 *
 * @project   WHMCS
 * @cssdoc    version 1.0-pre
 * @package   WHMCS
 * @author    WHMCS Limited <development@whmcs.com>
 * @copyright Copyright (c) WHMCS Limited 2005-2015
 * @license   http://www.whmcs.com/license/
 * @link      http://www.whmcs.com/
*/

.navbar-main {
    margin-bottom: 0;
    background-color: #006687;
    border: 0;
    min-height: 38px;
    font-size: 15px;
}

.navbar-main .navbar-nav > li > a {
    color: #fff;
}

.navbar-main .navbar-nav > li > a {
    padding-top: 9px;
    padding-bottom: 9px;
}

.navbar-main .navbar-nav > li > a:hover,
.navbar-main .navbar-nav > li > a:focus,
.navbar-main .navbar-nav > .active > a,
.navbar-main .navbar-nav > .active > a:hover,
.navbar-main .navbar-nav > .active > a:focus,
.navbar-main .navbar-nav > .open > a,
.navbar-main .navbar-nav > .open > a:hover,
.navbar-main .navbar-nav > .open > a:focus {
    color: #222222;
    background-color: #eee;
}

#main-menu .navbar-nav {
    margin-left: -15px;
    margin-right: -15px;
}

@media (max-width: 768px) {
    .navbar-main .navbar-nav .open .dropdown-menu > li > a {
        color: #ddd;
    }
    .navbar-main .navbar-nav .open .dropdown-menu > li > a:hover {
        color: #fff;
    }
}

@media (max-width: 991px) {
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .collapse.in{
        display:block !important;
    }
}

.panel {
  font-size: 0.9em;
}

.list-group {
  font-size: 0.9em;
}

a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus {
    background-color: #006687;
}

.pagination {
    font-size: 0.8em;
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    color: white;
    background-color: #006687;
    border-color: #006687;
}

.navbar-main .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    text-decoration: none;
    color: #fff;
    background-color: #006687;
}

.label {
    border-radius: 0;
}

input[type='file'].form-control {
    height: inherit;
    margin-bottom: 5px;
}

.list-group-item {
    padding: 7px 15px;
}
.panel-body {
    padding: 10px 15px;
}

/* 
 * We use a larger font-size than the bootstrap default, which requires an increase 
 * in the top offset to maintain correct alignment in form control feedback. 
 */
.has-feedback label ~ .form-control-feedback {
    top: 27px !important;
}

.list-group-item > i.fa.fa-circle-o {
    color: #808080;
}



/* Custom Standalone Login & Register Page CSS */
body.ovo-login-page {
    background-color: #f7f7f7 !important;
}

.ovo-fullpage-login, .ovo-register-wrapper {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100vh !important;
    background-color: #f7f7f7 !important;
    z-index: 9999 !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 40px 20px;
}

.ovo-login-card {
    width: 100%;
    background: #ffffff;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.05);
    border: 1px solid #eaeaea;
    margin-bottom: 20px;
}
.ovo-register-card {
    width: 100%;
    max-width: 800px;
    background: #ffffff;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.05);
    border: 1px solid #eaeaea;
    margin-bottom: 20px;
}

.ovo-login-brand {
    text-align: center;
    margin-bottom: 25px;
}

.ovo-brand-logo {
    max-height: 65px;
}

.ovo-login-header {
    text-align: center;
    margin-bottom: 30px;
}

.ovo-login-header h2 {
    font-size: 24px;
    font-weight: 600;
    color: #333;
    margin-top: 0;
    margin-bottom: 8px;
}

.ovo-login-header p {
    color: #777;
    font-size: 14px;
    margin-bottom: 0;
}

.ovo-form-group {
    margin-bottom: 20px;
}

.ovo-form-group label {
    display: block;
    font-weight: 600;
    color: #444;
    margin-bottom: 8px;
}

.ovo-input-wrap {
    position: relative;
}

.ovo-input-wrap i {
    z-index: 10;
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #aaa;
    font-size: 14px;
}

.ovo-input-wrap .form-control {
    padding-left: 45px;
    height: 48px;
    border-radius: 4px;
    border: 1px solid #ddd;
    box-shadow: none;
    font-size: 15px;
}

.ovo-input-wrap .form-control:focus {
    border-color: #1E7F9B;
    box-shadow: 0 0 0 2px rgba(30, 127, 155, 0.1);
}

.ovo-toggle-password {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #999;
    padding: 0;
}

.ovo-forgot-link {
    display: block;
    text-align: right;
    font-size: 13px;
    color: #1E7F9B;
    margin-top: 8px;
    font-weight: 500;
}

.ovo-form-footer {
    margin-top: 30px;
}

.ovo-remember {
    margin-bottom: 20px;
}

.ovo-checkbox-label {
    font-weight: normal;
    color: #666;
    font-size: 14px;
    cursor: pointer;
}

.ovo-btn-login {
    width: 100%;
    background-color: #1E7F9B;
    color: #fff;
    height: 48px;
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: 4px;
    transition: all 0.3s;
}

.ovo-btn-login:hover {
    background-color: #1C748D;
    color: #fff;
}

.ovo-social-login {
    margin-top: 30px;
}

.ovo-divider {
    text-align: center;
    position: relative;
    margin-bottom: 20px;
}

.ovo-divider::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 1px;
    background: #eee;
    z-index: 1;
}

.ovo-divider span {
    background: #fff;
    padding: 0 15px;
    position: relative;
    z-index: 2;
    color: #999;
    font-size: 13px;
}

.ovo-register-link {
    text-align: center;
    margin-top: 25px;
    font-size: 14px;
    color: #666;
}

.ovo-register-link a {
    color: #1E7F9B;
    font-weight: 600;
    text-decoration: none;
}

.ovo-login-footer {
    text-align: center;
    margin-top: 30px;
    font-size: 13px;
    color: #999;
}




/* Wrapper Styles Restored */
.ovo-fullpage-login, .ovo-register-wrapper {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100vh !important;
    background-color: #f7f7f7 !important;
    z-index: 9999 !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 40px 20px;
}

.ovo-login-wrapper {
    width: 100%;
    max-width: 450px;
}


/* Modern Section Labels */
.ovo-section-label {
    font-size: 16px;
    font-weight: 600;
    color: #1E7F9B;
    margin-top: 35px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.ovo-section-label i {
    color: #1E7F9B;
    font-size: 18px;
    margin-right: 5px;
}

/* Modern TOS Panel */
.ovo-register-card .tospanel {
    background-color: #fcfcfc;
    border: 1px solid #eaeaea;
    border-radius: 6px;
    box-shadow: none;
    margin-top: 25px;
}
.ovo-register-card .tospanel .panel-heading {
    background-color: transparent;
    border-bottom: 1px solid #eaeaea;
    padding: 15px 20px;
    color: #444;
}
.ovo-register-card .tospanel .panel-title {
    font-size: 15px;
    font-weight: 600;
    color: #1E7F9B;
}
.ovo-register-card .tospanel .tosicon {
    color: #1E7F9B;
}
.ovo-register-card .tospanel .panel-body {
    padding: 20px;
    color: #555;
    font-size: 14px;
}
.ovo-register-card .tospanel .checkbox {
    margin: 0;
    font-weight: 500;
}
.ovo-register-card .tospanel a {
    color: #1E7F9B;
    text-decoration: underline;
}

/* Modern Mailing List Box */
.ovo-register-card .marketing-email-optin {
    background-color: #fcfcfc;
    border: 1px solid #eaeaea;
    border-radius: 6px;
    padding: 20px;
    margin-top: 25px;
    text-align: center;
}
.ovo-register-card .marketing-email-optin h4 {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-top: 0;
    margin-bottom: 10px;
}
.ovo-register-card .marketing-email-optin p {
    color: #777;
    font-size: 14px;
    margin-bottom: 15px;
}

/* Generate Password Button */
.ovo-register-card .generate-password {
    background-color: #f7f7f7;
    border: 1px solid #ddd;
    color: #555;
    font-weight: 600;
    padding: 10px 15px;
    height: 48px;
    width: 100%;
    border-radius: 4px;
    transition: all 0.2s;
    margin-top: 28px; /* Aligns with input boxes that have labels */
}
.ovo-register-card .generate-password:hover {
    background-color: #eaeaea;
    color: #333;
}

/* Password Strength Meter Fix */
.ovo-register-card .password-strength-meter {
    margin-top: 35px; /* Aligns with inputs */
}

/* Label Spacing */
.ovo-form-group {
    margin-bottom: 25px;
}

/* Form inputs without icons padding fix */
.ovo-input-wrap .form-control:not(:first-child) {
    /* If there is NO icon before the input, don't pad it */
}

/* Modern Section Labels */
.ovo-section-label {
    font-size: 16px;
    font-weight: 600;
    color: #1E7F9B;
    margin-top: 35px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.ovo-section-label i {
    color: #1E7F9B;
    font-size: 18px;
    margin-right: 5px;
}

/* Modern TOS Panel */
.ovo-register-card .tospanel {
    background-color: #fcfcfc;
    border: 1px solid #eaeaea;
    border-radius: 6px;
    box-shadow: none;
    margin-top: 25px;
}
.ovo-register-card .tospanel .panel-heading {
    background-color: transparent;
    border-bottom: 1px solid #eaeaea;
    padding: 15px 20px;
    color: #444;
}
.ovo-register-card .tospanel .panel-title {
    font-size: 15px;
    font-weight: 600;
    color: #1E7F9B;
}
.ovo-register-card .tospanel .tosicon {
    color: #1E7F9B;
}
.ovo-register-card .tospanel .panel-body {
    padding: 20px;
    color: #555;
    font-size: 14px;
}
.ovo-register-card .tospanel .checkbox {
    margin: 0;
    font-weight: 500;
}
.ovo-register-card .tospanel a {
    color: #1E7F9B;
    text-decoration: underline;
}

/* Modern Mailing List Box */
.ovo-register-card .marketing-email-optin {
    background-color: #fcfcfc;
    border: 1px solid #eaeaea;
    border-radius: 6px;
    padding: 20px;
    margin-top: 25px;
    text-align: center;
}
.ovo-register-card .marketing-email-optin h4 {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-top: 0;
    margin-bottom: 10px;
}
.ovo-register-card .marketing-email-optin p {
    color: #777;
    font-size: 14px;
    margin-bottom: 15px;
}

/* Generate Password Button */
.ovo-register-card .generate-password {
    background-color: #f7f7f7;
    border: 1px solid #ddd;
    color: #555;
    font-weight: 600;
    padding: 10px 15px;
    height: 48px;
    width: 100%;
    border-radius: 4px;
    transition: all 0.2s;
    margin-top: 28px; /* Aligns with input boxes that have labels */
}
.ovo-register-card .generate-password:hover {
    background-color: #eaeaea;
    color: #333;
}

/* Password Strength Meter Fix */
.ovo-register-card .password-strength-meter {
    margin-top: 35px; /* Aligns with inputs */
}

/* Label Spacing */
.ovo-form-group {
    margin-bottom: 25px;
}

/* Hide Generic Placeholders that duplicate labels */
.ovo-form-group .form-control::placeholder {
    color: #aaa;
    opacity: 0.6;
}

/* =====================================================
   MODERN PROFESSIONAL UPGRADES
   These enhance existing Bootstrap/WHMCS classes only.
   No HTML changes required.
   ===================================================== */

/* --- Smoother Headings --- */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-weight: 400;
    letter-spacing: -0.01em;
}

/* --- Dashboard Stat Numbers --- */
.pricing-table h1 {
    font-weight: 500;
    font-size: 42px;
    color: #1a202c;
}
.pricing-table h4 {
    font-weight: 500;
    color: #718096;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 0.8px;
}
.pricing-table img {
    opacity: 0.75;
    transition: opacity 0.3s ease;
}
.pricing-table:hover img {
    opacity: 1;
}

/* --- Navigation Refinement --- */
.navigation {
    background-color: white;
    border-bottom: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.top-navigation {
    background-color: #f8f9fa;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    font-size: 13px;
}
.navbar-light .navbar-nav a {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.2px;
}

/* --- Panel Heading Polish --- */
.panel-heading {
    border-radius: 12px 12px 0 0 !important;
}
.panel-heading .panel-title {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.2px;
}

/* --- Tables Modern Look --- */
.table {
    margin-bottom: 0;
}
.table > thead > tr > th {
    border-bottom: 2px solid #e2e8f0 !important;
    color: #64748b;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 12px 16px !important;
    background-color: #fafbfc !important;
}
.table > tbody > tr > td {
    padding: 14px 16px !important;
    vertical-align: middle;
    border-top: 1px solid #f1f5f9 !important;
    color: #334155;
    font-size: 14px;
}
.table-hover > tbody > tr:hover > td {
    background-color: #f8fafc !important;
}
.table > tbody > tr {
    transition: background-color 0.15s ease;
    cursor: pointer;
}

/* --- Buttons Upgrade --- */
.btn {
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.2s ease;
    font-size: 13px;
    letter-spacing: 0.2px;
}
.btn-main {
    background: linear-gradient(135deg, #1E7F9B 0%, #19687F 100%);
    box-shadow: 0 2px 8px rgba(30,127,155,0.25);
    border: none;
}
.btn-main:hover {
    box-shadow: 0 4px 14px rgba(30,127,155,0.35);
    transform: translateY(-1px);
    background: linear-gradient(135deg, #1a7390 0%, #165e73 100%);
}
.btn-primary {
    background: linear-gradient(135deg, #1E7F9B 0%, #19687F 100%);
    box-shadow: 0 2px 8px rgba(30,127,155,0.25);
    border: none;
}
.btn-primary:hover {
    box-shadow: 0 4px 14px rgba(30,127,155,0.35);
    transform: translateY(-1px);
}
.btn-secondary {
    background: linear-gradient(135deg, #E6173F 0%, #BD1334 100%);
    box-shadow: 0 2px 8px rgba(230,23,63,0.25);
    border: none;
}
.btn-secondary:hover {
    box-shadow: 0 4px 14px rgba(230,23,63,0.35);
    transform: translateY(-1px);
}
.btn-default {
    background-color: #fff;
    border: 1px solid #e2e8f0;
    color: #475569;
}
.btn-default:hover {
    background-color: #f8fafc;
    border-color: #cbd5e1;
}

/* --- Alert / News Box --- */
.alert-info {
    background-color: white;
    border: 1px solid #e2e8f0;
    border-left: 4px solid #1E7F9B;
    color: #334155;
    border-radius: 10px;
    padding: 16px 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.alert-info b {
    color: #1E7F9B;
    font-weight: 600;
}

/* --- Status Badges Modern --- */
.label {
    border-radius: 20px;
    padding: 5px 12px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}
.badge {
    border-radius: 20px;
    font-weight: 600;
    padding: 4px 10px;
}

/* --- Form Controls --- */
.form-control {
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    padding: 10px 14px;
    font-size: 14px;
    height: auto;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-control:focus {
    border-color: #1E7F9B;
    box-shadow: 0 0 0 3px rgba(30,127,155,0.12);
}

/* --- Footer Modern --- */
.bar-above-footer {
    background: linear-gradient(135deg, #1E7F9B 0%, #19687F 100%);
}
.footer {
    background-color: #1a1a2e;
}
.footer ul li {
    font-size: 14px;
    padding: 4px 0;
}

/* --- Page Title Banner --- */
.bg-corridor {
    background-position: center center;
}
.bg-corridor h1 {
    font-weight: 700;
    font-size: 32px;
    letter-spacing: -0.5px;
    text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

/* --- Smooth Scrolling & Selection --- */
html {
    scroll-behavior: smooth;
}
::selection {
    background-color: #1E7F9B;
    color: white;
}

/* --- DataTables Refinement --- */
.dataTables_wrapper .dataTables_info {
    border-radius: 0 0 12px 12px;
    font-size: 13px;
    background: linear-gradient(135deg, #1E7F9B 0%, #19687F 100%);
}
table.table-list thead th {
    font-size: 12px !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 600 !important;
    color: #64748b !important;
}

/* --- Panel Body Spacing --- */
.panel-body {
    padding: 18px 20px;
    font-size: 14px;
    color: #64748b;
}

/* =====================================================
   SHOPPING CART MODERNIZATION (standard_cart)
   ===================================================== */



#order-standard_cart .header-lined {
    border-bottom: 2px solid #f1f5f9;
    padding-bottom: 15px;
    margin-bottom: 25px;
}
#order-standard_cart h1 {
    font-weight: 400;
    color: #1e293b;
}

/* --- Cart Items List --- */
#order-standard_cart .view-cart-items-header {
    background: #fafbfc;
    border-radius: 12px 12px 0 0;
    border: 1px solid #e2e8f0;
    border-bottom: none;
    color: #64748b;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
    padding: 15px 25px;
}
#order-standard_cart .view-cart-items {
    border: 1px solid #e2e8f0;
    border-radius: 0 0 12px 12px;
    background: white;
    margin-bottom: 30px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02);
}
#order-standard_cart .view-cart-items .item {
    border-bottom: 1px solid #f1f5f9;
    padding: 20px 25px;
    transition: background 0.2s ease;
}
#order-standard_cart .view-cart-items .item:last-child {
    border-bottom: none;
}
#order-standard_cart .view-cart-items .item:hover {
    background: #fafbfc;
}
#order-standard_cart .view-cart-items .item-title {
    font-size: 16px;
    font-weight: 400;
    color: #1E7F9B;
}
#order-standard_cart .view-cart-items .item-price span:not(.cycle) {
    font-size: 18px;
    font-weight: 500;
    color: #1e293b;
}

/* --- Order Summary Box --- */
#order-standard_cart .order-summary {
    background: white;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 8px 30px rgba(0,0,0,0.06);
    padding: 0;
    overflow: hidden;
}
#order-standard_cart .order-summary h2 {
    background: linear-gradient(135deg, #1E7F9B 0%, #19687F 100%);
    color: white;
    padding: 20px 25px;
    font-size: 18px;
    font-weight: 400;
    margin: 0;
}
#order-standard_cart .order-summary .summary-container {
    padding: 25px;
}
#order-standard_cart .order-summary .subtotal,
#order-standard_cart .order-summary .recurring-totals {
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 15px;
    margin-bottom: 15px;
    color: #64748b;
    font-weight: 400;
}
#order-standard_cart .order-summary .total-due-today {
    background: rgba(30,127,155,0.05);
    border-radius: 12px;
    padding: 20px;
    margin: 20px 0;
    text-align: center;
}
#order-standard_cart .order-summary .total-due-today .amt {
    font-size: 32px;
    font-weight: 500;
    color: #1E7F9B;
    display: block;
    margin-bottom: 5px;
}
#order-standard_cart .order-summary .total-due-today span:not(.amt) {
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    color: #64748b;
    letter-spacing: 0.5px;
}

/* --- Checkout Button --- */
#order-standard_cart .btn-checkout {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    border: none;
    border-radius: 10px;
    padding: 12px 25px;
    font-size: 16px;
    font-weight: 500;
    box-shadow: 0 4px 15px rgba(16,185,129,0.3);
    transition: all 0.2s ease;
    width: 100%;
}
#order-standard_cart .btn-checkout:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(16,185,129,0.4);
    background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%); /* Blue tint on hover */
}
#order-standard_cart .btn-continue-shopping {
    color: #94a3b8;
    font-size: 13px;
    text-decoration: underline;
    margin-top: 15px;
    display: inline-block;
}
#order-standard_cart .btn-continue-shopping:hover {
    color: #1E7F9B;
}

/* =====================================================
   HEADER & BREADCRUMB MODERNIZATION
   ===================================================== */

/* Remove horizontal lines above/below page headers */
.header-lined {
    border-bottom: none !important;
    border-top: none !important;
    margin-bottom: 10px;
    padding-bottom: 0;
}

/* Page titles (My Products & Services) - Smaller and Sharper */
.header-lined h1, 
.header-lined h2 {
    font-size: 26px !important;
    font-weight: 400 !important;
    color: #1e293b !important;
    margin-top: 15px;
    margin-bottom: 8px;
}

/* SpectraIP Style Simple Text Breadcrumbs */
.breadcrumb {
    background: transparent !important;
    padding: 0 !important;
    margin-bottom: 25px !important;
    border: none !important;
}
.breadcrumb > li {
    background: transparent !important;
    display: inline-block;
    padding: 0 !important;
    font-size: 13px;
    font-weight: 400;
}
.breadcrumb > li a, .breadcrumb > li.active {
    display: inline-block;
    background-color: transparent !important; 
    color: #337ab7 !important; /* Bootstrap primary blue text */
    padding: 0 !important;
    border-radius: 0;
    text-decoration: none !important;
}
.breadcrumb > li a:hover {
    background-color: transparent !important;
    color: #23527c !important;
    text-decoration: underline !important;
}
.breadcrumb > li + li:before {
    content: "/" !important;
    color: #cbd5e1 !important;
    padding: 0 6px !important;
}

/* Remove stray horizontal lines across the page below the Control Panel banner */
#main-body, .bg-corridor {
    border-top: none !important;
    border-bottom: none !important;
}/* =====================================================
   MODERN COMPONENT SYSTEM - OvoServe
   ===================================================== */

/* --- Stat Cards (Dashboard Top) --- */
.stat-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 28px 24px;
    text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.03);
    border: 1px solid rgba(0,0,0,0.04);
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}
.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #1E7F9B, #19687F);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.stat-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.08), 0 2px 8px rgba(0,0,0,0.04);
}
.stat-card:hover::before {
    opacity: 1;
}
.stat-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    position: relative;
}
.stat-alert-dot {
    position: absolute;
    top: -2px;
    right: -2px;
    width: 12px;
    height: 12px;
    background: #ef4444;
    border-radius: 50%;
    border: 2px solid white;
    animation: pulse-dot 2s infinite;
}
@keyframes pulse-dot {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.3); opacity: 0.7; }
}
.stat-number {
    font-size: 38px;
    font-weight: 700;
    color: #1a202c;
    line-height: 1;
    margin-bottom: 6px;
    letter-spacing: -1px;
}
.stat-label {
    font-size: 12px;
    font-weight: 600;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 1.2px;
}

/* --- OvoServe Card Component --- */
.ovo-card {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.03);
    border: 1px solid rgba(0,0,0,0.04);
    margin-bottom: 24px;
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}
.ovo-card:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,0.07);
}
.ovo-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px;
    border-bottom: 1px solid #f1f5f9;
    background: #fafbfc;
}
.ovo-card-title {
    font-size: 16px;
    font-weight: 600;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 8px;
}
.ovo-card-title i {
    font-size: 20px;
}
.ovo-card-body {
    padding: 0;
}

/* --- Alert Card (News) --- */
.ovo-alert-card {
    display: flex;
    align-items: center;
    gap: 16px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-left: 4px solid #1E7F9B;
    border-radius: 12px;
    padding: 16px 24px;
    margin-bottom: 24px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.ovo-alert-icon {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: rgba(30,127,155,0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #1E7F9B;
    font-size: 20px;
}
.ovo-alert-content {
    flex: 1;
}
.ovo-alert-content strong {
    color: #1e293b;
    font-weight: 600;
    font-size: 14px;
}
.ovo-alert-content p {
    margin: 4px 0 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
}

/* --- Pill Badges --- */
.ovo-pill {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    background: #f1f5f9;
    color: #475569;
}
.ovo-pill-danger {
    background: rgba(239,68,68,0.1);
    color: #dc2626;
}
.ovo-pill-success {
    background: rgba(16,185,129,0.1);
    color: #059669;
}
.ovo-pill-warning {
    background: rgba(245,158,11,0.1);
    color: #d97706;
}

/* --- Count Badge --- */
.ovo-count-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    border-radius: 11px;
    background: #ef4444;
    color: white;
    font-size: 11px;
    font-weight: 700;
    padding: 0 6px;
    margin-left: 8px;
}

/* --- Empty State --- */
.ovo-empty-state {
    text-align: center;
    padding: 40px 20px;
    color: #94a3b8;
}
.ovo-empty-state i {
    font-size: 48px;
    display: block;
    margin-bottom: 12px;
    opacity: 0.4;
    color: #10b981;
}
.ovo-empty-state p {
    font-size: 14px;
    margin: 0;
    font-weight: 500;
}

/* --- Tables inside ovo-card --- */
.ovo-card .table {
    margin-bottom: 0;
}
.ovo-card .table > thead > tr > th {
    background: #fafbfc !important;
    border-bottom: 1px solid #e2e8f0 !important;
    border-top: none !important;
    color: #64748b;
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    padding: 12px 20px !important;
}
.ovo-card .table > tbody > tr > td {
    padding: 14px 20px !important;
    border-top: 1px solid #f8fafc !important;
    color: #334155;
    font-size: 14px;
    vertical-align: middle;
}
.ovo-card .table-hover > tbody > tr:hover > td {
    background: #fafbfc !important;
}

/* Fix Status Labels Visibility */
.status,
.status-paid,
.status-unpaid,
.status-pending,
.status-cancelled,
.status-fraud,
.status-active,
.status-suspended,
.status-terminated {
    color: #ffffff !important;
    border-radius: 4px;
    padding: 3px 8px;
    font-weight: 600;
}
span.status {
    color: #ffffff !important;
}

/* Fix DataTable Action Button Group (Wrench & Caret) */
table.dataTable td .btn-group,
.table td .btn-group {
    display: inline-flex !important;
    flex-direction: row;
    align-items: stretch;
    vertical-align: middle;
}
table.dataTable td .btn-group .btn,
.table td .btn-group .btn {
    float: none !important;
    margin: 0 !important;
    border-radius: 4px;
}
table.dataTable td .btn-group .btn:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
table.dataTable td .btn-group .btn:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 1px solid rgba(255,255,255,0.2);
}
