.dv-config-page {
    background: #f5f7fa;
    color: #253246;
    font: 14px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}
.dv-config-page > .container { max-width: 1280px; padding: 0 32px; }
.dv-config-page #order-standard_cart > .sticky { position: relative; top: 0; background: transparent !important; border: 0; padding: 28px 0; }
.dv-config-page #order-standard_cart > .sticky h3 { color: #253246 !important; font-size: 26px; font-weight: 600; }
.dv-config-page #order-standard_cart > .sticky .size-7 { background: #e5ebf4 !important; color: #718198 !important; font-size: 12px; }
.dv-config-page #order-standard_cart > .sticky .size-7.bg-blue-600 { background: #0955da !important; color: #fff !important; }
.dv-config-page #order-standard_cart > .sticky .ms-2 { color: #8390a3 !important; font-size: 12px; font-weight: 500; }
.dv-config-page #order-standard_cart > .sticky li:has(.bg-blue-600) .ms-2 { color: #0955da !important; }
.dv-config-page #order-standard_cart > .sticky .h-px { background: #dce3ec !important; }
.dv-config-page #frmConfigureProduct { gap: 32px; padding: 0 0 130px; }
.dv-config-fields { min-width: 0; gap: 22px; }
.dv-config-fields > .flex > .w-40 { width: 105px; flex: 0 0 105px; font-size: 12px; font-weight: 400; color: #8390a3; }
.dv-config-fields > .flex { gap: 20px; }
.dv-config-fields > .flex > .w-full { min-width: 0; flex: 1; }
.dv-config-fields > .font-semibold, .dv-config-section-title { border-top: 1px solid #e4eaf2; margin-top: 6px; padding-top: 25px; font-size: 15px; font-weight: 600; color: #253246; }
.dv-config-section-title { border: 0; margin: 0; padding: 0; }
.dv-config-fields > .font-semibold::before { height: 16px; border-color: #527bb1; border-width: 3px; }
.dv-config-section-title::before { content: ""; display: inline-block; width: 3px; height: 16px; background: #527bb1; margin-right: 10px; vertical-align: -2px; }
.dv-config-page .grid-os { gap: 12px; }
.dv-config-page .check-system { border: 1px solid #dfe4eb; border-radius: 7px; overflow: hidden; }
.dv-config-page .check-system:hover { transform: none; box-shadow: none; border-color: #88a9df; }
.dv-config-page .check-os.active .check-system { background: #f2f6ff; border-color: #6e95d4 !important; z-index: auto; }
.dv-config-page .check-os.active .check-system::before, .dv-config-page .check-os.active .check-system::after { display: none; }
.dv-config-page .os-main { padding: 18px 16px; min-height: 88px; }
.dv-config-page .os-icon { width: 48px; height: 48px; margin-right: 13px; flex-shrink: 0; }
.dv-config-page .os-svg { width: 100%; height: 100%; object-fit: contain; }
.dv-config-page .os-title { font-size: 21px; font-weight: 500; letter-spacing: -.4px; line-height: 1.3; }
.dv-config-page .os-subtitle { padding: 8px 12px; min-height: 35px; line-height: 1.6; gap: 8px; background: #f8f9fb; color: #758399; }
.dv-config-page .os-version { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; }
.dv-config-page .os-subtitle svg { flex-shrink: 0; }
.dv-config-page .check-os.active .os-subtitle { background: #eaf1fb; color: #426fae; }
.dv-config-page .check-os.active .os-version { font-weight: 600; }
.dv-config-page .os-select { border: 1px solid #e5eaf1; border-radius: 6px; box-shadow: 0 10px 28px #253e641a; }
.dv-config-page .os-select ul li { padding: 8px 12px; line-height: 1.6; font: inherit; font-size: 12px; }
.dv-config-page .grid-os + div { justify-content: flex-start; padding: 0; }
.dv-config-page .grid-os + div::before, .dv-config-page .grid-os + div::after { display: none; }
.dv-config-page #expandBtn, .dv-config-page #collapseBtn { padding: 2px 0; color: #728db5; font-size: 12px; }
.dv-config-page .panel-check { box-shadow: none; margin-bottom: 0; border-radius: 5px; }
.dv-config-page .panel-check.active { background: #f0f5ff; border-color: #88a9df !important; color: #31578d; }
.dv-config-page .panel-check .check-title { font-size: 13px; }
.dv-config-page .panel-check .check-subtitle { font-size: 12px; }
.dv-config-page .dv-config-fields > .flex:has(#inputHostname) > .grid,
.dv-config-page .dv-config-fields > .login-pass > .grid { display: block; }
.dv-config-page #inputHostname, .dv-config-password { width: 100%; max-width: 360px; }
.dv-config-page #inputHostname, .dv-config-page #inputRootpw { background: #f3f5f8; border: 1px solid #dfe6ef; border-radius: 6px; color: #526176; padding: 11px 12px; font-size: 13px; }
.dv-config-page .dv-config-fields > .flex:has(.login-type-pass) > .grid { display: flex; flex: 0 1 360px; gap: 10px; }
.dv-config-page .login-type-pass, .dv-config-page .login-type-sshkey { min-width: 112px; font-size: 12px; }
.dv-config-password { position: relative; }
.dv-config-page #inputRootpw { padding-right: 83px; }
.dv-config-password button { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border: 0; background: transparent; color: #7285a1; border-radius: 4px; cursor: pointer; display: grid; place-items: center; }
.dv-config-password .dv-config-show-password { right: 40px; }
.dv-config-password button:hover { background: #eaf1fb; color: #31578d; }
.dv-config-password svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.dv-config-password .dv-eye-slash { display: none; }
.dv-config-show-password[aria-pressed=true] .dv-eye-slash { display: block; }
.dv-config-page .login-pass > .grid > .relative > span { font-size: 11px; line-height: 1.9; color: #94a0b0; }
.dv-config-page .login-pass > .grid > .relative > span > svg { display: none; }
.dv-config-page .dv-config-addons { gap: 12px; }
.dv-config-page .panel-addon { border: 1px solid #e5eaf0; background: #fff; border-radius: 6px; margin: 0; }
.dv-config-page .panel-addon.active { background: #f5f9ff; border-color: #88a9df !important; }
.dv-config-page .panel-addon label { display: block; height: 100%; padding: 17px; }
.dv-config-page .panel-addon label > .d-flex { display: flex; flex-wrap: wrap; gap: 8px; }
.dv-config-page .panel-addon label input { accent-color: #547db6; }
.dv-config-page .panel-addon label .text-xl { font-size: 13px; font-weight: 500; margin-right: auto; }
.dv-config-page .panel-addon label .text-orange-500 { font-size: 12px; color: #637b9f; }
.dv-config-page .panel-addon label > .text-sm { font-size: 11px; line-height: 1.9; color: #8b97a6; }
.dv-config-page .summary-body { width: 320px; flex: 0 0 320px; min-width: 0; }
.dv-config-page .summary-body > .sticky { top: 95px; }
.dv-config-summary { border: 1px solid #e5eaf1; border-radius: 9px; background: #fff; overflow: hidden; }
.dv-config-summary-heading { background: #fafbfd; padding: 20px 22px; font-size: 15px; font-weight: 600; border-bottom: 1px solid #edf0f5; }
.dv-config-overview { padding: 18px 22px; border-bottom: 1px solid #edf0f5; }
.dv-config-overview h4 { color: #31578d; font-size: 17px; font-weight: 600; margin: 0 0 10px; }
.dv-config-overview > div { color: #8390a3; font-size: 12px; line-height: 1.9; }
.dv-config-overview p:last-child { margin-bottom: 0; }
.dv-config-summary-content { padding: 20px 22px; }
.dv-config-summary-content #producttotal > .flex { gap: 13px; }
.dv-config-summary-content #producttotal > .flex > .flex { justify-content: space-between; gap: 16px; font-size: 12px; }
.dv-config-summary-content .checklist-item-desc { text-align: right; max-width: 65%; overflow-wrap: anywhere; color: #526176; }
.dv-config-summary-content #producttotal .text-gray-500 { color: #94a0b0; min-width: 0; flex-shrink: 0; }
.dv-config-summary-content #producttotal > .flex > .flex:last-child { padding: 15px; background: #eaf1fb; border-radius: 6px; margin-top: 5px; flex-direction: column; align-items: flex-start; gap: 4px; }
.dv-config-summary-content #producttotal > .flex > .flex:last-child .checklist-item-desc { max-width: 100%; font-size: 28px; font-weight: 500; color: #31578d; font-variant-numeric: tabular-nums; }
.dv-config-page .dv-config-footer { padding: 20px 0; border-color: #e5eaf1; z-index: 50; }
.dv-config-footer > .container { max-width: 1280px; padding: 0 32px; }
.dv-config-footer .btn-group { display: inline-flex; flex-wrap: wrap; }
.dv-config-footer .btn-group > .btn { padding: 9px 18px; font-size: 13px; border-color: #88a9df; color: #31578d; }
.dv-config-footer .btn-group > .btn.active { background: #0955da; border-color: #0955da; color: #fff; }
.dv-config-footer #btnCompleteProductConfig { padding: 10px 22px; font-size: 13px; background: #0955da; border-color: #0955da; border-radius: 6px; }
.dv-config-page button:focus-visible, .dv-config-page [tabindex]:focus-visible, .dv-config-page input:focus-visible { outline: 2px solid #7ea5e7; outline-offset: 3px; }
@media (min-width: 1024px) {
    .dv-config-page .dv-config-fields > .flex > .w-full { width: auto; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
    .dv-config-page .summary-body { width: 275px; flex-basis: 275px; }
    .dv-config-page .os-main { padding: 16px 10px; }
    .dv-config-page .os-icon { width: 38px; height: 38px; margin-right: 9px; }
    .dv-config-page .os-title { font-size: 17px; }
    .dv-config-page .grid-os { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1023px) {
    .dv-config-page > .container { padding: 0 24px; }
    .dv-config-page #frmConfigureProduct { padding-bottom: 24px; gap: 24px; }
    .dv-config-page .summary-body { width: 100%; flex-basis: auto; }
    .dv-config-page .summary-body > .sticky { position: static; }
    .dv-config-page .dv-config-fields > .flex { gap: 10px; }
    .dv-config-page .dv-config-fields > .flex > .w-40 { width: auto; flex-basis: auto; padding-top: 0; }
    .dv-config-page .dv-config-fields > .flex:has(.login-type-pass) > .grid { flex-basis: auto; }
    .dv-config-page .grid-os { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dv-config-page .dv-config-footer { width: 100%; }
    .dv-config-footer > .container { padding: 0; }
}
@media (max-width: 600px) {
    .dv-config-page .grid-os { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dv-config-page .os-main { padding: 16px 10px; min-height: 74px; }
    .dv-config-page .os-icon { width: 34px; height: 34px; margin-right: 8px; }
    .dv-config-page .os-title { font-size: 16px; }
    .dv-config-page .os-version { font-size: 11px; }
    .dv-config-page .os-subtitle { padding: 8px 10px; }
    .dv-config-footer .btn-group > .btn { padding: 9px 12px; }
    .dv-config-footer .confproduct-foot, .dv-config-footer #btnCompleteProductConfig { width: 100%; }
}