/* checkbox */
input[type='checkbox'].checkbox-checkbox + label.checkbox-label span:focus-visible,
input[type='checkbox'].checkbox-checkbox + label.checkbox-label span.focus-visible:focus {
    outline: 2px solid #4acbd6;
    outline-offset: 2px;
    border-radius: 3px;
}
input[type='checkbox'].checkbox-checkbox + label.checkbox-label span.checkbox-hover-unchecked:focus-visible,
input[type='checkbox'].checkbox-checkbox + label.checkbox-label span.checkbox-hover-unchecked.focus-visible:focus,
input[type='checkbox'].checkbox-checkbox + label.checkbox-label span.checkbox-hover-checked:focus-visible,
input[type='checkbox'].checkbox-checkbox + label.checkbox-label span.checkbox-hover-checked.focus-visible:focus {
    outline: 2px solid #4acbd6;
}

/* switch */
div.button-group-container div.button-group-wrap:focus-visible,
div.button-group-container div.button-group-wrap.focus-visible:focus {
    outline: 3px solid #4acbd6;
    border-radius: 14px;
}

/* error-tip */
div.widget-error-tips:focus-visible,
div.widget-error-tips.focus-visible:focus,
div.input-err-container:focus-visible,
div.input-err-container.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: -3px;
    border-radius: 4px;
}

/* select */
div.tp-select:focus-visible,
div.tp-select.focus-visible:focus {
    outline: none;
}
div.tp-select:focus-visible .select-box,
div.tp-select.focus-visible:focus .select-box {
    border-color: #4acbd6;
}

/* link */
a.link:focus {
    outline: 2px solid #4acbd6;
    border-radius: 2px;
}
a[role='button']:focus-visible,
a[role='button'].focus-visible:focus {
    outline: 2px solid #4acbd6;
    outline-offset: 2px;
    border-radius: 2px;
}
a[role='button'].close-icon:focus-visible,
a[role='button'].close-icon.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: 0px;
}
/* search */
.pure-form input.tp-input-text.menu-search-input {
    width: 100%;
    background-color: #fff;
}
input.menu-search-input:focus {
    border-color: #e6e6e6;
}
input.menu-search-input {
    border: 0;
    color: #666666;
    font: 13px/20px 'Verdana', 'Arial';
    padding-left: 14px;
    vertical-align: middle;
    border-radius: 5px;
    box-shadow: none;
    background-color: transparent;
    height: 32px;
    line-height: 32px;
    box-sizing: border-box;
    margin: -1px;
}
input.menu-search-input.hasButton {
    padding-right: 40px;
}
input.menu-search-input.hasSearchIcon {
    padding-left: 35px;
}
div.search-input-wrapper:focus-within,
div.search-input-wrapper.focus-visible:focus {
    outline: 2px solid #ffcb00;
    outline-offset: 1px;
}

/* radio */
input[type='radio'].radio-radio + label.radio-label span.icon:focus-visible {
    outline: none;
}
input[type='radio'].radio-radio + label.radio-label span.icon.focus-visible:focus {
    outline: 8px solid rgba(74, 203, 214, 0.3);
    outline-offset: -4px;
    border-radius: 8px;
}

/* button */
.ariaBtn:focus-visible,
.ariaBtn.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: 2px;
}

/* gridSelect */
td.gridcell-sel.is-focus {
    outline: 3px solid #4acbd6;
    outline-offset: -2px;
}
table.grid-sel:focus-visible,
table.grid-sel.focus-visible:focus {
    outline: 0;
    outline-offset: 0px;
}

/* modeSelect */
div[role='tablist']:focus-visible,
div[role='tablist'].focus-visible:focus {
    outline: 0;
    outline-offset: 0px;
}
span[role='tab'].is-focus {
    outline: 3px solid #4acbd6;
    outline-offset: 1px;
}

/* password */
span.icon-eye:focus-visible,
span.icon-eye.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: -3px;
    border-radius: 4px;
}

/* modal simple */
.on-mask.msg-container .table-btn:focus-visible,
.on-mask.msg-container .table-btn.focus-visible:focus
.on-mask.msg-container .table-op:focus-visible,
.on-mask.msg-container .table-op.focus-visible:focus {
    outline: none;
}
.on-mask.msg-container .table-btn:focus-visible span.table-icon,
.on-mask.msg-container .table-btn.focus-visible:focus span.table-icon
.on-mask.msg-container .table-op:focus-visible .table-btn span.table-icon,
.on-mask.msg-container .table-op.focus-visible:focus .table-btn span.table-icon,
.on-mask.msg-container .close-msg-icon:focus-visible,
.on-mask.msg-container .close-msg-icon.focus-visible:focus {
    outline: 3px solid #4acbd6;
    border-radius: 50%;
}
[role="dialog"][aria-modal="true"]:focus-visible,
[role="dialog"][aria-modal="true"].focus-visible:focus {
    outline: none;
}

/* modal */
div.msg-container div.msg-wrap a.msg-close:focus-visible,
div.msg-container div.msg-wrap a.msg-close.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: 0px;
}
#closeDeviceList .table-btn:focus-visible .close-icon,
#closeDeviceList .table-btn.focus-visible:focus .close-icon {
    outline: 3px solid #4acbd6;
}

/* wifisharing */
div.wifisharing-main-container:focus-visible,
div.wifisharing-main-container.focus-visible:focus {
    outline: none;
}
a.wifisharing-sharing-btn:focus-visible,
a.wifisharing-sharing-btn.focus-visible:focus {
    outline: 2px solid #4acbd6;
    outline-offset: 0px;
    border-radius: 5px;
}
div.wifisharing-save-btn-container:focus-visible,
div.wifisharing-save-btn-container.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: -2px;
    border-radius: 3px;
}
div.wifisharing-main-container .checkbox-label span.icon:focus-visible,
div.wifisharing-main-container .checkbox-label span.icon.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: 2px;
    border-radius: 3px;
}

/* timebar */
div.timebar div.slider:focus-visible,
div.timebar div.slider.focus-visible:focus {
    outline: none;
}
div.timebar div.slider:focus-visible div.icon,
div.timebar div.slider.focus-visible:focus div.icon {
    outline: 3px solid #4acbd6;
    outline-offset: -2px;
    border-radius: 3px;
}

/* tpMsg */
div.msg-container-wrapper:focus-visible,
div.msg-container-wrapper.focus-visible:focus {
    outline: none;
}
div.msg-container-wrapper .btn-confirm:focus-visible,
div.msg-container-wrapper .btn-confirm.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: 2px;
    border-radius: 3px;
}
div.msg-container-wrapper .msg-close:focus-visible,
div.msg-container-wrapper .msg-close.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: -1px;
}

/* advanced tpCollapse */
div.advanced-block {
    width: fit-content;
}
div.advanced-block:focus-visible,
div.advanced-block.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: 2px;
    border-radius: 3px;
}

/* top */
#pc-top-product:focus-visible,
#pc-top-product.focus-visible:focus,
#top-product:focus-visible,
#top-product.focus-visible:focus {
    outline: 2px solid #fff;
    outline-offset: 4px;
    border-radius: 2px;
}
#ul-nav:focus-visible,
#ul-nav.focus-visible:focus {
    outline: none;
}
#ul-nav:focus-visible li[role='tab'].focus,
#ul-nav.focus-visible:focus li[role='tab'].focus {
    outline: 2px solid #ffcc00;
    outline-offset: -4px;
    border-radius: 10px 10px 0 0;
}
#ul-nav:focus-visible li[role='tab'].focus.selected,
#ul-nav.focus-visible:focus li[role='tab'].focus.selected {
    outline-color: #4acbd6;
}
/* 语言下拉框需要修改 select 组件样式，否则不明显 */
.top-country div.tp-select:focus-visible,
.top-country div.tp-select.focus-visible:focus {
    outline: 2px solid #ffcc00;
    outline-offset: 1px;
    border-radius: 5px;
}
.top-country div.tp-select:focus-visible .select-box,
.top-country div.tp-select.focus-visible:focus .select-box {
    border-color: #e6e6e6;
}
.top-btn[role='button']:focus-visible,
.top-btn[role='button'].focus-visible:focus {
    outline: 2px solid #fff;
    outline-offset: 0px;
    border-radius: 2px;
}

/* menu */
#menuTree:focus-visible,
#menuTree.focus-visible:focus {
    outline: none;
}
/* 需要修改原本的样式，否则 outline 显示不完全 */
#menuTree:focus-visible a[role='menuitem'].focus,
#menuTree.focus-visible:focus a[role='menuitem'].focus {
    outline: 2px solid #000;
}
#menuTree:focus-visible li.ml1 a[role='menuitem'].focus,
#menuTree.focus-visible:focus li.ml1 a[role='menuitem'].focus {
    margin: 2px 0 0 2px;
}
#menuTree:focus-visible li.ml2 a[role='menuitem'].focus,
#menuTree.focus-visible:focus li.ml2 a[role='menuitem'].focus {
    left: 2px;
    min-width: 145px;
    border-radius: 0;
}

/* help */
.btn-help:focus-visible,
.btn-help.focus-visible:focus,
.tooltip-container:focus-visible,
.tooltip-container.focus-visible:focus {
    outline: 2px solid #4acbd6 !important;
    outline-offset: 1px !important;
    border-radius: 5px;
    box-shadow: 0 0 4px 0 rgba(74, 203, 214, 0.3), 0 4px 4px 0 rgba(74, 203, 214, 0.3);
}

/* bot */
#bot_support_href:focus-visible,
#bot_support_href.focus-visible:focus,
#pc-bot-app:focus-visible,
#pc-bot-app.focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 2px;
}

/* bot-qr-code */
#qr-close-icon:focus-visible,
#qr-close-icon.focus-visible:focus {
    outline: 3px solid #4acbd6;
}
#bot a.link:focus-visible span,
#bot a.link.focus-visible:focus span {
    outline: 3px solid #4acbd6;
}
#qr-code-container a {
    outline: none;
}
#qr-code-container a:focus-visible span,
#qr-code-container a.focus-visible:focus span {
    outline: 2px solid #4acbd6;
    border-radius: 5px;
}

/* flat-button */
.flat-button:focus-visible,
.flat-button.focus-visible:focus,
.table-icon.flat-button:focus-visible,
.table-icon.flat-button.focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 2px;
}

/* quickSetup */
#jumpMesh:focus-visible,
#jumpMesh.focus-visible:focus,
#jumpMesh2:focus-visible,
#jumpMesh2.focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 2px;
}

/* parentControl */
#filter .button-click:focus-visible,
#filter .button-click.focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 35px;
}
#add-container:focus-visible,
#add-container.focus-visible:focus {
    outline: 2px solid #4acbd6;
}
#dateSelectContainer .tp-select:focus-visible .select-box,
#blockDateSelectContainer .tp-select:focus-visible .select-box,
#dateSelectContainer .tp-select.focus-visible:focus .select-box,
#blockDateSelectContainer .tp-select.focus-visible:focus .select-box {
    border: 1px solid #4acbd6;
}
#viewTodayList:focus-visible,
#viewTodayList.focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 2px;
    outline-offset: 2px;
}
#device-container .add-button:focus-visible,
#device-container .add-button.focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 2px;
    outline-offset: 2px;
}
#device-container .devices-list-wrap .devices div.icon-wrap span.close-icon:focus-visible,
#device-container .devices-list-wrap .devices div.icon-wrap span.close-icon.focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 2px;
    outline-offset: 2px;
}
#filter-level .button-click:focus-visible,
#filter-level .button-click.focus-visible:focus {
    outline: 4px solid #4acbd6;
    border-radius: 35px;
    outline-offset: 4px;
}
#editor-container #tab-container span.is-focus,
#editor-container #tab-container span.switched.is-focus,
#editor-container #insights-tab-container span.is-focus,
#editor-container #insights-tab-container span.switched.is-focus {
    background-color: rgba(74, 203, 214, 0.5);
    color: #fff;
    outline: unset;
    outline-offset: unset;
}
#closeTimePicker.close-icon:focus-visible,
#closeTimePicker.close-icon.focus-visible:focus {
    outline: 4px solid #4acbd6;
    outline-offset: -2px;
}

/* qos */
.qos-list-p .qos-toggle-icon:focus-visible,
.qos-list-p .qos-toggle-icon.focus-visible:focus {
    outline: 2px solid #4acbd6;
}

/* tpPanelPage */
.panel-page:focus-visible,
.panel-page.focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 2px;
    box-shadow: 0 0 4px 0 rgba(74, 203, 214, 0.3), 0 4px 4px 0 rgba(74, 203, 214, 0.3);
}

/* tpTable */
div[class*="-icon-wrap"]:focus-visible,
.table-grid-icon:focus-visible,
.table-grid-icon-lte:focus-visible,
div[class*="-icon-wrap"].focus-visible:focus,
.table-grid-icon.focus-visible:focus,
.table-grid-icon-lte.focus-visible:focus {
    outline: 2px solid #4acbd6;
    outline-offset: 1px;
    border-radius: 5px;
    box-shadow: 0 0 4px 0 rgba(74, 203, 214, 0.3), 0 4px 4px 0 rgba(74, 203, 214, 0.3);
}
.table-grid-icon.insights-icon:focus-visible,
.table-grid-icon.internet-pause-icon:focus-visible,
.table-grid-icon.insights-icon.focus-visible:focus,
.table-grid-icon.internet-pause-icon.focus-visible:focus {
    outline-offset: -1px;
}
.table-icon:focus-visible,
.table-icon.focus-visible:focus {
    outline: 0;
}
.table-bottom-pages span[id*="prev"]:focus-visible,
.table-bottom-pages span[id^="next"]:focus-visible,
.table-bottom-pages span[id*="prev"].focus-visible:focus,
.table-bottom-pages span[id^="next"].focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 1px;
    box-shadow: 0 0 4px 0 rgba(74, 203, 214, 0.3), 0 4px 4px 0 rgba(74, 203, 214, 0.3);
}

/* networkMap */
.map_wrap:focus-visible [role='tab'].focus:not(#speedTestResume-container) > :first-child,
.map_wrap.focus-visible:focus [role='tab'].focus:not(#speedTestResume-container) > :first-child,
.map_wrap:focus-visible #speedTestResume-container.focus,
.map_wrap.focus-visible:focus #speedTestResume-container.focus,
#mesh_topology_wrapper:focus-visible [role='tab'].focus > :first-child,
#mesh_topology_wrapper.focus-visible:focus [role='tab'].focus > :first-child {
    outline: 2px solid #4acbd6;
    outline-offset: -1px;
    border-radius: 3px;
}

/* login */
#top_a11y:focus-visible,
#top_a11y.focus-visible:focus {
    outline: 2px solid #fff;
}

/* cloudTooltip */
.cloud_hover_container:focus-visible,
.cloud_hover_container.focus-visible:focus {
    outline: 2px solid #4acbd6;
    outline-offset: 1px;
    border-radius: 2px;
    box-shadow: 0 0 4px 0 rgba(74, 203, 214, 0.3), 0 4px 4px 0 rgba(74, 203, 214, 0.3);
}

/* simple-slider */
.slider > .dragger:focus-visible,
.slider > .dragger.focus-visible:focus{
    outline: 3px solid #4acbd6;
    outline-offset: 1px;
    border-radius: 3px;
}

/* diagnostic */
.diagnostic_table:focus-visible,
.diagnostic_table.focus-visible:focus {
    outline: 3px solid #4acbd6;
    outline-offset: 1px;
    border-radius: 3px;
}

/* folderSharing */
.fileContainer:focus-visible,
.fileContainer.focus-visible:focus,
.addFolder:focus-visible,
.addFolder.focus-visible:focus,
.hideFolder:focus-visible,
.hideFolder.focus-visible:focus {
    outline: 2px solid #4acbd6;
    border-radius: 2px;
}

/* status */
.status-panel-main:focus-visible,
.status-panel-main.focus-visible:focus {
    outline: 2px solid #4acbd6;
}

/* top button */
.top-btn span.text:focus-visible,
.top-btn span.text.focus-visible:focus {
    outline: 2px solid #fff;
    outline-offset: 1px;
    border-radius: 2px;
}

/* add-mesh-guide 弹窗 */
div.add-mesh-guide .guide-text:focus-visible,
div.add-mesh-guide .guide-text.focus-visible:focus {
    outline: 2px solid #4acbd6;
    outline-offset: 1px;
    border-radius: 2px;
}