/* A5IDC brand and layout. All selectors are scoped to the client-area body. */
:root {
  --nav-l-w: 200px; --nav-top-h: 48px; --nav-top-h-page: 48px;
  --windowWidth: 100vw; --rightBgColor: #f1f3f9; --navigationBarbg: #fff;
  --copyrightbg: #f1f3f9; --copyrighttxt: #8993a7; --txtcl: #172b50; --teal: #15b8a6;
  --primary: #165dff; --loginbg: url('../images/bg.jpg'); --loginIllustration: none;
}
body.a5idc-uc { margin: 0; padding: 0; background: #f1f3f9; color: #172b50; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft YaHei', sans-serif; }
body.a5idc-uc .sky-navbar { background: #fff; border-bottom: 1px solid #e8edf5; }
body.a5idc-uc .sky-navbar .sky-logo { background: #fff !important; min-height: 48px; display: flex; align-items: center; justify-content: center; }
body.a5idc-uc .sky-navbar .sky-logo a { display: inline-flex; align-items: center; justify-content: center; }
body.a5idc-uc .sky-navbar .sky-logo img { max-width: 168px; height: 36px; object-fit: contain; }
body.a5idc-uc .sky-navbar .sky-navbar-content { min-width: 0; }
body.a5idc-uc .sky-sidebar { background: #fff; border-right: 1px solid #e8edf5; }
body.a5idc-uc .sky-sidebar .skynav-menu-wrapper { background: #fff; }
body.a5idc-uc .skynav-menu-link.active { color: #fff !important; background: #165dff !important; }
body.a5idc-uc .skynav-menu-link.active .skynav-menu-icon { color: #fff !important; }
body.a5idc-uc .skynav-dropdown-menu { display: block; }
body.a5idc-uc .skynav-dropdown-submenu { display: none; }
body.a5idc-uc .a5-menu-open > .skynav-dropdown-submenu { display: block; }
body.a5idc-uc .sky-content { padding: 20px; width: 100%; min-width: 0; }
body.a5idc-uc .sky-main-content { min-height: calc(100vh - var(--nav-top-h) - var(--nav-top-h-page)); background: var(--rightBgColor) !important; }
body.a5idc-uc .sky-card { background: #fff; box-shadow: 0 2px 16px rgba(29, 52, 94, .04); }
body.a5idc-uc .sky-title { font-size: 14px; font-weight: 600; }
body.a5idc-uc .sky-container-fluid h4 { font-size: 16px; }
body.a5idc-uc .sky-flex-66, body.a5idc-uc .sky-flex-33 { min-width: 0; }
body.a5idc-uc .sky-content > .row, body.a5idc-uc .sky-content > .card { margin-top: 0; }
body.a5idc-uc .sky-content .card { border: 0; border-radius: 2px; box-shadow: 0 2px 16px rgba(29, 52, 94, .04); }
body.a5idc-uc .card-title { font-size: 15px; }
body.a5idc-uc .no-data { min-height: 140px; display: flex; justify-content: center; align-items: center; flex-direction: column; color: #8993a7; }
body.a5idc-uc .no-data:before { content: ''; display: block; width: 94px; height: 64px; margin-bottom: 12px; background: url('../images/noData.png') center/contain no-repeat; }
body.a5idc-uc .a5-avatar-letter { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #fff; background: #165dff; border-radius: inherit; font-weight: 600; }
body.a5idc-uc .userInformation .avatar, body.a5idc-uc .sky-user-info .avatar { border-radius: 50%; overflow: hidden; }
body.a5idc-uc .a5-collapsed { --nav-l-w: 64px; }
body.a5idc-uc .a5-collapsed .skynav-menu-link > span { display: none; }
body.a5idc-uc .a5-collapsed .skynav-menu-link.mini { display: none; }
body.a5idc-uc .a5-collapsed .sky-navbar .sky-logo img { width: 48px; height: auto; }
body.a5idc-uc .a5-open { display: block !important; visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; }
body.a5idc-uc .sky-sidebar-footer .navigationButtons { cursor: pointer; }
body.a5idc-uc .AccountSecurity .arc-circle { stroke-dasharray: 283; stroke-dashoffset: 113; }
body.a5idc-uc .AccountSecurity .arc-circle.text-warning { stroke: #faad14; }
body.a5idc-uc .AccountSecurity .arc-circle.text-success { stroke: #52c41a; stroke-dashoffset: 0; }
body.a5idc-uc .AccountSecurity .arc-circle.text-danger { stroke: #ff4d4f; stroke-dashoffset: 226; }
body.a5idc-uc .AccountSecurity .arc-bg { stroke: #edf0f6; }
body.a5idc-uc #bulkOperation.not-allowed { opacity: .45; pointer-events: none; }
body.a5idc-uc .sky-product-list-card { min-width: 0; }
body.a5idc-uc .table-responsive { max-width: 100%; }
body.a5idc-uc .table th { font-weight: 500; }
body.a5idc-uc .sky-footer-Copyright { position: static; clear: both; margin: 0; padding: 12px 20px 20px; width: 100%; }
body.a5idc-uc [role='button']:focus-visible, body.a5idc-uc a:focus-visible { outline: 2px solid #165dff; outline-offset: 3px; }

/* Authentication keeps the original split layout with an A5IDC brand panel. */
body.a5idc-uc .L_code { min-height: 100vh; height: auto; overflow: visible; }
body.a5idc-uc .L_code-left-side { min-width: 30%; max-width: 35%; width: 520px; background: linear-gradient(145deg, #163663 0%, #185de1 65%, #378aff 100%); }
body.a5idc-uc .L_code-left-side::before { display: none; }
body.a5idc-uc .L_code-left-side .L_code-content { padding: 32px 36px; min-height: 100vh; height: 100%; overflow: visible; }
body.a5idc-uc .a5-login-logo img { width: 154px; height: auto; }
body.a5idc-uc .a5-login-brand { margin: auto 0; text-align: left; width: 100%; color: #fff; }
body.a5idc-uc .a5-login-eyebrow { letter-spacing: 2px; font-size: 13px; opacity: .75; }
body.a5idc-uc .a5-login-brand h1 { color: #fff; font-size: clamp(27px, 2.6vw, 43px); line-height: 1.5; font-weight: 600; margin: 24px 0 14px; }
body.a5idc-uc .a5-login-brand > p:not(.a5-login-eyebrow) { font-size: 15px; opacity: .82; }
body.a5idc-uc .a5-login-art { width: 100%; max-width: 420px; margin: 26px auto 16px; }
body.a5idc-uc .a5-login-regions { display: flex; gap: 12px; margin: 12px 0 30px; }
body.a5idc-uc .a5-login-regions span { border: 1px solid rgba(255,255,255,.26); padding: 5px 13px; font-size: 13px; border-radius: 3px; }
body.a5idc-uc .a5-login-home { color: #fff; font-size: 14px; opacity: .82; }
body.a5idc-uc .L_code-right-side { min-height: 100vh; height: auto; padding: 60px 24px 80px; overflow: visible; }
body.a5idc-uc .L_code-right-side.no_wx .L_code-right-form { width: 440px; max-width: 100%; padding: 32px; top: 0; border-radius: 12px; box-shadow: 0 16px 50px rgba(23, 43, 80, .12); }
body.a5idc-uc .L_code-right-side .L_code-login-form { width: 100%; max-width: none; padding: 0; min-width: 0; }
body.a5idc-uc .L_code-right-side .L_code-right-content { width: 440px; max-width: 100%; }
body.a5idc-uc .L_code-right-side .L_code-right-footer { position: absolute; left: 24px; right: 24px; bottom: 22px; width: auto; text-align: center; flex-wrap: wrap; gap: 8px; font-size: 12px; }
body.a5idc-uc .L_code-right-side .form-control { height: 40px; font-size: 13px; }
body.a5idc-uc .L_code-right-side .form-group { margin-bottom: 20px; }
body.a5idc-uc .L_code-right-side .btn-primary { min-height: 42px; font-size: 15px; }
body.a5idc-uc .L_code-right-side .input-group .btn { min-height: 40px; }
body.a5idc-uc .L_code .serviceTerms input[type='checkbox'] { display: inline-block; margin-right: 7px; accent-color: #165dff; }
body.a5idc-uc .L_code .serviceTerms { align-items: flex-start; }
body.a5idc-uc .L_code .login-tab-item { cursor: pointer; }
body.a5idc-uc[data-template='register'] .L_code-right-side { align-items: center; }
body.a5idc-uc[data-template='register'] .L_code-right-form { overflow: visible; }
body.a5idc-uc[data-template='loginaccesstoken'] .bglogo .logo img { background: #11264c; padding: 8px; border-radius: 4px; }

@media (max-width: 1200px) and (min-width: 769px) {
  body.a5idc-uc .sky-flex-66 { width: 62%; }
  body.a5idc-uc .sky-flex-33 { width: calc(38% - var(--sky-gap)); }
  body.a5idc-uc .L_code-left-side .L_code-content { padding: 24px; }
  body.a5idc-uc .a5-login-regions { gap: 7px; }
}
@media (max-width: 768px) {
  body.a5idc-uc { --nav-l-w: 0px; --nav-top-h: 56px; --sky-gap: 12px; }
  body.a5idc-uc .sky-navbar { min-height: 56px; height: 56px; }
  body.a5idc-uc .sky-navbar .sky-logo.hide-xs { display: flex !important; width: 148px; min-height: 56px; }
  body.a5idc-uc .sky-navbar .sky-logo img { width: 110px; height: auto; }
  body.a5idc-uc .sky-sidebar { width: 208px !important; z-index: 1001; top: 56px; left: 0; transform: translateX(-100%); height: calc(100vh - 56px); }
  body.a5idc-uc .a5-mobile-open .sky-sidebar { transform: translateX(0); box-shadow: 8px 0 25px rgba(17,38,76,.12); }
  body.a5idc-uc .sky-content { padding: 12px; }
  body.a5idc-uc .sky-flex-container { display: block; }
  body.a5idc-uc .sky-flex-66, body.a5idc-uc .sky-flex-33 { width: 100%; }
  body.a5idc-uc .sky-container-right { margin-top: 12px; }
  body.a5idc-uc .L_code-left-side { display: block; width: 100%; max-width: none; min-width: 0; height: 84px; }
  body.a5idc-uc .L_code { display: block; }
  body.a5idc-uc .L_code-left-side .L_code-content { height: 84px; min-height: 0; padding: 22px 24px; }
  body.a5idc-uc .a5-login-brand { display: none; }
  body.a5idc-uc .GoBackToTheHomepage { position: absolute; right: 24px; top: 31px; color: #fff; }
  body.a5idc-uc .L_code-right-side { min-height: calc(100vh - 84px); padding: 32px 18px 88px; }
  body.a5idc-uc .L_code-right-side.no_wx .L_code-right-form { padding: 26px 24px; border-radius: 10px; }
  body.a5idc-uc .L_code-form-content { flex-wrap: wrap; height: auto !important; padding-bottom: 12px; gap: 8px; }
  body.a5idc-uc .L_code-form-content .text-register { position: static !important; width: 100%; order: 2; text-align: left; }
  body.a5idc-uc .L_code-form-content .text-register p { margin: 0; }
  body.a5idc-uc .L_code-form-content .transitionSwitching { display: none; }
  body.a5idc-uc .L_code-right-side .L_code-right-footer { left: 12px; right: 12px; bottom: 18px; }
  body.a5idc-uc .sky-footer-Copyright { margin-left: 0; }
  body.a5idc-uc .a5-collapsed { --nav-l-w: 0px; }
  body.a5idc-uc .a5-collapsed .skynav-menu-link > span { display: inline; }
}

/* Keep fixed navigation outside the normal content flow on every native page. */
body.a5idc-uc .sky-container { display: block; min-height: 100vh; padding-top: calc(var(--nav-top-h) + var(--nav-top-h-page)); }
body.a5idc-uc .sky-container .sky-container-fluid { top: var(--nav-top-h); margin-top: 0; }
body.a5idc-uc .sky-container .sky-main-content { display: flex; flex-direction: column; width: calc(100% - var(--nav-l-w)); min-width: 0; margin-top: 0; }
body.a5idc-uc .sky-container .sky-content { flex: 1 0 auto; margin-bottom: 0; }
body.a5idc-uc .sky-container .sky-footer-Copyright { flex: 0 0 auto; }
body.a5idc-uc .sky-content > .sky-flex-column { width: 100%; min-width: 0; }
body.a5idc-uc .skynav-menu-link.active > span { color: #fff !important; }
body.a5idc-uc .sky-sidebarlanguage .sidebar-language-dropdown { top: 100% !important; padding-top: 2px; z-index: 1020 !important; }
body.a5idc-uc .sky-sidebarlanguage .language-switch[aria-expanded="true"] i { transform: rotate(180deg); }
@media (max-width: 768px) {
  body.a5idc-uc .sky-container .sky-navbar { background: #fff !important; border-bottom: 1px solid #e8edf5; }
  body.a5idc-uc .sky-container .menu-menu-icon .menu-btn i { background-color: #165dff; }
  body.a5idc-uc .sky-container .sky-navbar .sky-logo.hide-xs { width: 122px; padding: 0 8px; }
  body.a5idc-uc .sky-container .sky-navbar .sky-navbar-content { padding: 0 8px; }
  body.a5idc-uc .sky-container .sky-navbar .sky-navbar-right { margin-left: 8px; }
  body.a5idc-uc .sky-container .sky-navbar .sky-user-info { padding-right: 0 !important; }
  body.a5idc-uc .sky-container .sky-navbar .menuButtons { padding-left: 12px; }
  body.a5idc-uc .sky-container .sky-sidebar { opacity: 1; }
  body.a5idc-uc .sky-container .sky-sidebar .sky-sidebar-footer { opacity: 1; left: 0; width: 208px; }
  body.a5idc-uc .sky-sidebarlanguage .language-switch { min-width: 0 !important; padding: 0 5px !important; }
  body.a5idc-uc .sky-sidebarlanguage .language-switch span { white-space: nowrap; }
  body.a5idc-uc .sky-container .sky-main-content { width: 100%; }
}

/* White list headings across billing, services, transactions and log pages. */
body.a5idc-uc .table thead,
body.a5idc-uc .table thead tr,
body.a5idc-uc .table thead th,
body.a5idc-uc .table thead td { background: #fff !important; }
body.a5idc-uc .skynav-menu-icon { width: 18px; min-width: 18px; text-align: center; }
/* A static native security banner; bg-info keeps the avatar's hover behavior. */
body.a5idc-uc .security-header,
body.a5idc-uc .security-header:hover,
body.a5idc-uc .security-header:active {
  background-color: #3656ff !important;
  background-image: url('../../assets_custom/img/security_top.png'), linear-gradient(87deg, #4d83ff, #3656ff);
  background-repeat: no-repeat !important;
  background-position: right center !important;
  background-size: auto, auto !important;
}

/* Match the original 406px form width; override logincode's nested padding. */
body.a5idc-uc .L_code-right-side .L_code-right-content { width: 476px; }
body.a5idc-uc .L_code-right-side.no_wx .L_code-right-form { width: 476px; padding: 32px 35px 40px; border-radius: 15px 0 15px 0; }
body.a5idc-uc .L_code-right-side.no_wx .L_code-right-form .L_code-login-form { width: 100%; padding: 0; }
body.a5idc-uc .L_code-login-form .L_code-form-content .code_login-tab { width: auto; flex: 0 0 auto; }
body.a5idc-uc .L_code-login-form .login-tab-item.active::after { content: ''; position: absolute; height: 3px; bottom: -10px; left: 0; right: 0; background: #165dff; }
body.a5idc-uc .L_code-login-form .transitionSwitching { display: none; }
body.a5idc-uc .L_code-login-form .input-group .btn { display: inline-flex; align-items: center; justify-content: center; padding: 0 15px; height: 40px; min-height: 40px; font-size: 12px; line-height: 1.4; }
body.a5idc-uc .L_code-login-form .serviceTerms { margin-top: 16px; }
body.a5idc-uc[data-template='details'] .sky-tabs-item { cursor: pointer; }
/* Native product payment controls share a baseline despite small-button padding. */
body.a5idc-uc[data-template='servicedetail'] .btn.rsb,
body.a5idc-uc[data-template='servicedetail'] #renew,
body.a5idc-uc[data-template='servicedetail'] #renewpay,
body.a5idc-uc[data-template='servicedetail'] #cancelStopBtn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 24px; height: auto; padding: 3px 10px; line-height: 1.4; vertical-align: middle;
}
body.a5idc-uc[data-template='servicedetail'] section:has(#automaticRenewal) { gap: 8px; }
body.a5idc-uc[data-template='servicedetail'] section #automaticRenewal + label { margin-bottom: 0; }
body.a5idc-uc[data-template='servicedetail'] section .custom-switch-md { margin-bottom: 0 !important; }
@media (max-width: 768px) {
  body.a5idc-uc .L_code-right-side.no_wx .L_code-right-form { padding: 26px 24px; border-radius: 10px; }
  body.a5idc-uc .L_code-login-form .login-tab-item.active::after { bottom: -6px; }
}

@media (max-width: 768px) {
  body.a5idc-uc .L_code-left-side { position: relative; top: auto; }
  body.a5idc-uc .L_code-right-side.no_wx .L_code-right-form { padding: 26px 24px !important; }
}

/* Give the switch's painted track a real 40x20 box on the same row center. */
body.a5idc-uc[data-template='servicedetail'] .a5-renew-switch {
  flex: 0 0 40px; width: 40px; min-height: 20px; height: 20px;
  padding: 0; margin: 0 !important; line-height: 20px; vertical-align: middle;
}
body.a5idc-uc[data-template='servicedetail'] .a5-renew-switch .custom-control-input { left: 0; width: 40px; height: 20px; }
body.a5idc-uc[data-template='servicedetail'] .a5-renew-switch .custom-control-label {
  display: block; width: 40px; height: 20px; margin: 0; line-height: 20px; cursor: pointer;
}
body.a5idc-uc[data-template='servicedetail'] .a5-renew-switch .custom-control-label::before { top: 0; left: 0; }
body.a5idc-uc[data-template='servicedetail'] .a5-renew-switch .custom-control-label::after { top: 2px; left: 2px; }
@media (min-width: 769px) {
  body.a5idc-uc[data-template='register'] .L_code-right-side { padding-top: 60px; padding-bottom: 60px; }
}