/* Merchant presentation. Load after app.css and layui.css.
   Success, warning and danger text/badges retain their semantic colors. */
body.merchant-sidebar-layout, body.merchant-tech-login, body.merchant-theme-dialog {
  --merchant-blue: #2465e9;
  --merchant-blue-dark: #174fc2;
  --merchant-cyan: #54d6ff;
  --merchant-ink: #1c355b;
  --merchant-muted: #7f94ad;
  --merchant-line: #e0e9f5;
  --merchant-sidebar-width: 248px;
  --merchant-topbar-height: 80px;
  color: var(--merchant-ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.merchant-sidebar-layout {
  min-height: 100vh;
  background: radial-gradient(ellipse at 100% 0, rgba(114,184,255,.14), transparent 52%), linear-gradient(135deg,#f1f7ff,#f8fbff 65%,#eef6ff);
  background-attachment: fixed;
}
body.merchant-sidebar-layout #topnav {
  position: fixed; top: 0; right: 0; left: 0; height: var(--merchant-topbar-height);
  border: 0; background: transparent; box-shadow: none; z-index: 1030;
}
body.merchant-sidebar-layout #topnav .navbar-custom {
  position: relative; min-height: var(--merchant-topbar-height); margin-left: var(--merchant-sidebar-width);
  border-bottom: 1px solid #e8eff8; background: #fff; box-shadow: 0 4px 22px rgba(36,75,128,.035); z-index: 1;
}
body.merchant-sidebar-layout #topnav .navbar-custom > .container-fluid {
  display: flex; align-items: center; justify-content: space-between; min-height: var(--merchant-topbar-height);
  max-width: none; padding: 0 28px;
}
body.merchant-sidebar-layout #topnav .navbar-custom .menu-left,
body.merchant-sidebar-layout #topnav .topbar-right-menu { float: none !important; margin: 0; }
body.merchant-sidebar-layout #topnav .navbar-custom .menu-left { flex: 1 1 auto; min-width: 0; }
body.merchant-sidebar-layout #topnav .navbar-custom .logo { display: none; }
body.merchant-sidebar-layout #topnav .topbar-right-menu {
  display: flex; align-items: center; flex: 0 0 auto; gap: 9px; order: 2; padding: 0;
}
body.merchant-sidebar-layout #topnav .topbar-right-menu > li { float: none; }
body.merchant-sidebar-layout #topnav .navbar-custom .nav-link {
  display: flex; align-items: center; justify-content: center; height: var(--merchant-topbar-height);
  padding: 0 10px; color: #647d9e; line-height: normal;
}
body.merchant-sidebar-layout #topnav .navbar-custom .nav-link:hover,
body.merchant-sidebar-layout #topnav .navbar-custom .nav-link:focus { color: var(--merchant-blue); }
body.merchant-sidebar-layout #topnav .noti-icon { font-size: 21px; }
body.merchant-sidebar-layout #topnav .nav-user img { width: 32px; height: 32px; box-shadow: 0 0 0 4px #f0f6ff; }
body.merchant-sidebar-layout #topnav .nav-user > span { color: #496484; font-size: 13px; font-weight: 500; }
body.merchant-sidebar-layout #changeyuyan {
  height: 33px; min-height: 33px; padding: 0 9px; border: 1px solid #e4edf7; border-radius: 8px;
  color: #516b8d; background: #f8fbff; font-size: 12px;
}
body.merchant-sidebar-layout .merchant-topbar-context { min-width: 0; padding: 0 20px 0 0; }
body.merchant-sidebar-layout .merchant-topbar-context :is(strong,.merchant-topbar-title) {
  display: block; margin: 0; color: #24436e; font-size: 18px; font-weight: 600; line-height: 1.4;
}
body.merchant-sidebar-layout .merchant-topbar-context :is(small,.merchant-topbar-subtitle) {
  display: block; margin-top: 3px; color: #90a2b9; font-size: 12px; line-height: 1.45;
}
body.merchant-sidebar-layout #topnav .navbar-custom .navbar-toggle { display: none; }
body.merchant-sidebar-layout #topnav .navbar-toggle .lines span { background-color: #3e638e; }

/* Full-height royal-blue side navigation, including its brand area. */
body.merchant-sidebar-layout #topnav .topbar-menu {
  position: fixed; top: 0; bottom: 0; left: 0; width: var(--merchant-sidebar-width);
  overflow-x: hidden; overflow-y: auto; border: 0;
  background: linear-gradient(165deg,#0b43b7 0%,#0a399f 55%,#082e83 100%);
  box-shadow: 5px 0 24px rgba(16,56,128,.08); scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) transparent; z-index: 3;
}
body.merchant-sidebar-layout #topnav .topbar-menu::-webkit-scrollbar { width: 4px; }
body.merchant-sidebar-layout #topnav .topbar-menu::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 4px; }
body.merchant-sidebar-layout #topnav .topbar-menu > .container-fluid { width: 100%; max-width: none; padding: 0 14px 30px; }
body.merchant-sidebar-layout .merchant-brand {
  position: sticky; top: 0; display: flex; align-items: center; gap: 11px;
  height: var(--merchant-topbar-height); margin: 0 -14px 20px; padding: 0 24px; box-sizing: border-box;
  color: #fff; border-bottom: 1px solid rgba(215,234,255,.12); background: #0b42b3; text-decoration: none; z-index: 2;
}
body.merchant-sidebar-layout .merchant-brand:hover { color: #fff; text-decoration: none; }
body.merchant-sidebar-layout .merchant-brand img { display: block; width: 188px; min-width: 0; max-width: 100%; height: 63px; max-height: 63px; object-fit: contain; }
body.merchant-sidebar-layout :is(.merchant-brand-mark,.merchant-brand-symbol) {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 36px;
  width: 36px; height: 36px; border: 1px solid rgba(192,232,255,.28); border-radius: 11px;
  color: #fff; background: linear-gradient(135deg,rgba(115,207,255,.3),rgba(98,157,255,.13)); font-size: 23px;
}
body.merchant-sidebar-layout .merchant-brand-name { color: #fff; font-size: 20px; font-weight: 650; letter-spacing: .4px; line-height: 1.25; }
body.merchant-sidebar-layout .merchant-brand-meta { display: block; margin-top: 3px; color: #a8caff; font-size: 10px; letter-spacing: 1.4px; line-height: 1.4; }
body.merchant-sidebar-layout .merchant-sidebar-close {
  display: none; align-items: center; justify-content: center; flex: 0 0 30px; width: 30px; height: 30px;
  margin-left: auto; padding: 0; border: 0; border-radius: 8px; color: #fff;
  background: rgba(255,255,255,.12); cursor: pointer; font-size: 24px; line-height: 1;
}
body.merchant-sidebar-layout .merchant-sidebar-close:hover,
body.merchant-sidebar-layout .merchant-sidebar-close:focus { background: rgba(255,255,255,.23); outline: 2px solid rgba(165,225,255,.45); outline-offset: 2px; }
body.merchant-sidebar-layout #topnav #navigation {
  display: block !important; position: static; width: 100%; height: auto !important;
  max-height: none; overflow: visible; border: 0; background: transparent;
}
body.merchant-sidebar-layout #topnav .navigation-menu {
  display: block; float: none; height: auto; max-height: none; margin: 0; padding: 0; overflow: visible;
}
body.merchant-sidebar-layout #topnav .navigation-menu > li { display: block; float: none; width: 100%; margin-bottom: 5px; }
body.merchant-sidebar-layout #topnav .navigation-menu > li > a {
  display: flex; align-items: center; min-height: 48px; padding: 12px 15px; border-radius: 9px;
  color: #d6e6ff !important; font-size: 14px; font-weight: 500; line-height: 22px; white-space: normal;
  transition: background-color .16s ease, color .16s ease;
}
body.merchant-sidebar-layout #topnav .navigation-menu > li > a > span,
body.merchant-sidebar-layout #topnav .navigation-menu > li > a > i { color: inherit !important; }
body.merchant-sidebar-layout #topnav .navigation-menu > li > a > i { flex: 0 0 22px; margin-right: 12px; font-size: 20px; text-align: center; }
body.merchant-sidebar-layout #topnav .navigation-menu > li:hover > a { color: #fff !important; background-color: rgba(142,194,255,.13); }
body.merchant-sidebar-layout #topnav .navigation-menu > li.active > a,
body.merchant-sidebar-layout #topnav .navigation-menu li.merchant-menu-open > a {
  color: #fff !important; background: linear-gradient(90deg,rgba(67,157,255,.54),rgba(74,158,255,.21));
  box-shadow: inset 3px 0 0 #68ddff, 0 4px 12px rgba(0,30,106,.09);
}
body.merchant-sidebar-layout #topnav .navigation-menu li > a[data-merchant-submenu]::after { content: "\203A"; margin-left: auto; padding-left: 10px; color: #afcfff; font-size: 21px; transition: transform .16s ease; }
body.merchant-sidebar-layout #topnav .navigation-menu li.merchant-menu-open > a[data-merchant-submenu]::after { transform: rotate(90deg); }
body.merchant-sidebar-layout #topnav .navigation-menu li > .submenu {
  display: none !important; position: static; visibility: visible; opacity: 1; width: 100%; min-width: 0;
  margin: 5px 0 10px; padding: 4px 0 4px 13px; border: 0; border-radius: 9px;
  background: rgba(1,29,102,.18); box-shadow: none;
}
body.merchant-sidebar-layout #topnav .navigation-menu li.merchant-menu-open > .submenu { display: block !important; }
body.merchant-sidebar-layout #topnav .navigation-menu .submenu::before,
body.merchant-sidebar-layout #topnav .navigation-menu .submenu::after { display: none; }
body.merchant-sidebar-layout #topnav .navigation-menu .submenu li,
body.merchant-sidebar-layout #topnav .navigation-menu .submenu.megamenu > li { display: block; float: none; width: 100%; padding: 0; }
body.merchant-sidebar-layout #topnav .navigation-menu .submenu ul { margin: 0; padding: 0; list-style: none; }
body.merchant-sidebar-layout #topnav .navigation-menu .submenu a { display: block; padding: 9px 12px; border-radius: 7px; color: #bcd6ff; font-size: 13px; line-height: 20px; white-space: normal; }
body.merchant-sidebar-layout #topnav .navigation-menu .submenu a > span { color: inherit; }
body.merchant-sidebar-layout #topnav .navigation-menu .submenu a:hover,
body.merchant-sidebar-layout #topnav .navigation-menu .submenu a:focus,
body.merchant-sidebar-layout #topnav .navigation-menu .submenu a.active,
body.merchant-sidebar-layout #topnav .navigation-menu .submenu li.active > a { color: #fff; background: rgba(134,193,255,.18); }
body.merchant-sidebar-layout #topnav .navigation-menu .submenu .text-primary { color: #9fdcff !important; }

/* Quiet page frame and white cards. */
body.merchant-sidebar-layout .wrapper { min-height: 100vh; margin-left: var(--merchant-sidebar-width); padding-top: 108px; padding-bottom: 88px; background: transparent; }
body.merchant-sidebar-layout .wrapper > .container-fluid { width: 100%; max-width: none; padding-right: 28px; padding-left: 28px; }
body.merchant-sidebar-layout .page-title-box { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin: 0 0 23px; padding: 0; background: transparent; }
body.merchant-sidebar-layout .page-title-box :is(.page-title,h4) { margin: 0; color: #24436e; font-size: 24px; font-weight: 600; line-height: 1.4; letter-spacing: -.3px; order: -1; }
body.merchant-sidebar-layout .page-title-box .breadcrumb { margin: 0; padding: 0; color: #8fa3be; background: none; font-size: 12px; }
body.merchant-sidebar-layout .page-title-box .breadcrumb a { color: #7190b5; }
body.merchant-sidebar-layout .page-title-box .breadcrumb-item.active { color: #a0b2c7; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .card { overflow: visible; margin-bottom: 24px; border: 1px solid rgba(220,230,243,.7); border-radius: 16px; background-color: #fff; box-shadow: 0 6px 26px rgba(33,81,145,.045); }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .card-body { padding: 25px 26px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .card-header { padding: 18px 26px; border-bottom: 1px solid #edf2fa; background-color: #fff; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .card .header-title { margin: 0 0 20px; color: #28496f; font-size: 16px; font-weight: 600; line-height: 1.5; }
body.merchant-sidebar-layout .card .header-title.mb-3 { margin-bottom: 20px !important; }
body.merchant-sidebar-layout .footer { right: 0; left: var(--merchant-sidebar-width); padding: 18px 28px; border-top: 1px solid #e6eef8; color: #92a6be; background: rgba(248,251,255,.9); font-size: 12px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) a { color: #2862bf; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) a:hover { color: #184caa; }
:is(body.merchant-sidebar-layout,body.merchant-tech-login,body.merchant-theme-dialog) .text-primary { color: #2465d4 !important; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .bg-primary { background-color: #2465e9 !important; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .border-primary { border-color: #2465e9 !important; }

/* Controls keep native values, validation and status semantics. */
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.form-control,.custom-select,.layui-input,.layui-select,.layui-textarea) {
  min-height: 41px; border-color: #dbe6f3; border-radius: 8px; color: #3b587c; background-color: #fff;
  font-size: 13px; box-shadow: none; transition: border-color .15s ease, box-shadow .15s ease;
}
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.form-control,.custom-select,.layui-input,.layui-select,.layui-textarea):focus {
  border-color: #6a9df5; outline: 0; box-shadow: 0 0 0 3px rgba(58,116,233,.10);
}
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.form-control,.layui-input,.layui-textarea)::placeholder { color: #a1b1c6; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.layui-input:disabled,.form-control:disabled,.form-control[readonly]) { color: #7e91aa; background-color: #f4f7fb; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.form-group label,.layui-form-label) { color: #617a9a; font-size: 13px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .form-control { padding: 9px 12px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-form-select dl { border-color: #e0e9f5; border-radius: 10px; box-shadow: 0 10px 35px rgba(25,65,126,.10); }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-form-select dl dd.layui-this { background-color: #2465e9; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.layui-form-checked span,.layui-form-onswitch) { border-color: #2465e9; background-color: #2465e9; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-form-checked[lay-skin=primary] i { color: #fff; border-color: #2465e9; background: #2465e9; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-form-radioed > i { color: #2465e9; }

/* Only primary/default actions become blue. Semantic status classes are untouched. */
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .btn { border-radius: 8px; font-size: 13px; font-weight: 500; box-shadow: none; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .btn:not(.btn-sm):not(.btn-xs) { min-height: 40px; padding: 9px 18px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .btn-primary { color: #fff; border-color: #2465e9; background-color: #2465e9; box-shadow: 0 3px 8px rgba(36,101,233,.14); }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .btn-primary:hover,
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .btn-primary:focus { color: #fff; border-color: #174fc2; background-color: #174fc2; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .btn-info { color: #2b64b8; border-color: #d9e8ff; background-color: #edf5ff; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .btn-info:hover { color: #fff; border-color: #397ce8; background-color: #397ce8; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.btn-light,.layui-btn-primary) { color: #617c9e; border-color: #dfe8f3; background-color: #fff; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .btn-outline-primary { color: #2465d4; border-color: #aac9fa; background-color: #fff; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .btn-outline-primary:hover { color: #fff; border-color: #2465e9; background-color: #2465e9; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-btn { border-radius: 8px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-btn:not(.layui-btn-primary):not(.layui-btn-warm):not(.layui-btn-danger):not(.layui-btn-disabled) { background-color: #2465e9; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .badge { padding: .4em .7em; border-radius: 5px; font-weight: 500; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .badge-primary { color: #fff; background-color: #2465e9; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .alert { border-radius: 12px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .alert-info { border-color: #d6e7ff; color: #4772aa; background-color: #edf5ff; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-elem-quote { border-left: 3px solid #5a96ee; border-radius: 0 9px 9px 0; color: #6a83a4; background-color: #f2f7ff; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-tab-brief > .layui-tab-title .layui-this { color: #2465d4; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-tab-brief > .layui-tab-title .layui-this:after { border-bottom-color: #2465e9; }

/* Separate headings from values; no changes to column data or precision. */
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.table,.layui-table) { color: #526d90; font-size: 13px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.table,.layui-table) :is(th,td) { padding: 13px 14px; border-color: #e9eff7; vertical-align: middle; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.table,.layui-table) thead th { color: #4c6b92; background-color: #f4f8fe; font-size: 12px; font-weight: 600; border-bottom-width: 1px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) :is(.table-hover,.layui-table) tbody tr:hover { background-color: #f7faff; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-table-view { border: 1px solid #e4ecf7; border-radius: 10px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-table-view .layui-table { margin: 0; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-table-view :is(th,td) { padding: 9px 0; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-table-header { border-bottom-color: #e3ebf6; background: #f4f8fe; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-table-view .layui-table-cell { padding-right: 14px; padding-left: 14px; font-size: 13px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-table-page { height: auto; min-height: 49px; padding: 9px 14px; border-top-color: #e7eef7; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-laypage :is(a,span) { border-color: #dfe8f4; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-laypage .layui-laypage-curr .layui-laypage-em { border-radius: 5px; background-color: #2465e9; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .layui-laypage :is(input,select) { border-color: #dfe8f4; border-radius: 5px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .dropdown-menu { padding: 8px; border: 1px solid #e6eef8; border-radius: 12px; box-shadow: 0 12px 38px rgba(27,65,121,.12); }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .dropdown-item { border-radius: 7px; color: #526c8d; font-size: 13px; }
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .dropdown-item:hover { color: #2465d4; background: #f0f6ff; }
body.merchant-theme-dialog { margin: 0; padding: 16px; overflow: auto !important; background: #f5f8fd; }
body.merchant-theme-dialog .wrapper { margin-left: 0; padding-top: 0; }

/* Matching technology-blue login, with the original form and captcha preserved. */
body.merchant-tech-login {
  min-height: 100vh; margin: 0; background-color: #eef5ff;
  background-image: radial-gradient(ellipse at 15% 55%,rgba(126,187,255,.22),transparent 52%), radial-gradient(ellipse at 100% 0,rgba(192,222,255,.4),transparent 50%), linear-gradient(125deg,#f5f9ff,#e9f3ff);
}
body.merchant-tech-login > section,
body.merchant-tech-login > section > .container { width: 100%; max-width: none; margin: 0; padding: 0; }
body.merchant-tech-login > section > .container > .row { margin: 0; }
body.merchant-tech-login > section > .container > .row > .col-12 { padding: 0; }
body.merchant-tech-login .merchant-login-shell {
  display: grid; grid-template-columns: minmax(0,1fr) 560px; align-items: center; gap: 0;
  width: 100%; max-width: 1440px; min-height: 100vh; margin: 0 auto; padding: 64px 60px; box-sizing: border-box;
}
body.merchant-tech-login .merchant-login-art { min-width: 0; padding: 30px 65px 30px 0; }
body.merchant-tech-login .merchant-login-art :is(svg,img) { display: block; width: 100%; max-width: 650px; height: auto; margin: 0 auto; }
body.merchant-tech-login .merchant-login-art :is(h1,h2) { max-width: 570px; margin: 30px 0 18px; color: #244b80; font-size: 38px; font-weight: 650; line-height: 1.3; letter-spacing: -.8px; }
body.merchant-tech-login .merchant-login-art p { max-width: 520px; margin: 0; color: #7b99bb; font-size: 15px; line-height: 1.9; }
body.merchant-tech-login .merchant-login-panel {
  width: 100%; max-width: 560px; padding: 48px 52px; box-sizing: border-box;
  border: 1px solid rgba(212,227,248,.8); border-radius: 24px; background: rgba(255,255,255,.97);
  box-shadow: 0 24px 75px rgba(54,106,181,.10), 0 3px 10px rgba(54,106,181,.025);
}
body.merchant-tech-login .merchant-login-brand { display: flex; align-items: center; gap: 13px; margin-bottom: 37px; color: #1e56ae; font-size: 24px; font-weight: 700; letter-spacing: .5px; }
body.merchant-tech-login .merchant-login-brand img { display: block; width: 188px; max-width: 100%; height: 63px; max-height: 63px; object-fit: contain; }
body.merchant-tech-login .merchant-login-brand svg { display: block; flex: 0 0 42px; width: 42px; height: 42px; }
body.merchant-tech-login .merchant-login-brand :is(.merchant-brand-mark,.merchant-brand-symbol) { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px; color: #fff; background: linear-gradient(135deg,#3d98ff,#2461df); font-size: 27px; }
body.merchant-tech-login .merchant-login-heading { margin-bottom: 29px; }
body.merchant-tech-login .merchant-login-heading :is(h1,h2) { margin: 0 0 10px; color: #274970; font-size: 25px; font-weight: 600; line-height: 1.4; }
body.merchant-tech-login .merchant-login-heading p { margin: 0; color: #93a5bb; font-size: 13px; line-height: 1.65; }
body.merchant-tech-login .merchant-login-panel :is(.wrapper-page,.account-pages,.account-box) { width: 100%; max-width: none; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
body.merchant-tech-login .merchant-login-panel .account-logo-box { margin: 0 0 24px; padding: 0; border: 0; background: transparent; }
body.merchant-tech-login .merchant-login-panel .account-content { padding: 0; }
body.merchant-tech-login .merchant-login-panel .form-group { margin-bottom: 21px !important; }
body.merchant-tech-login .merchant-login-panel label { margin-bottom: 9px; color: #617b9b; font-size: 13px; font-weight: 500; }
body.merchant-tech-login .merchant-login-panel .form-control { min-height: 47px; padding: 11px 13px; border: 1px solid #d9e5f5; border-radius: 8px; color: #3f5d83; background: #fbfdff; font-size: 13px; box-shadow: none; }
body.merchant-tech-login .merchant-login-panel .form-control:focus { border-color: #70a3f4; outline: 0; background: #fff; box-shadow: 0 0 0 3px rgba(36,101,233,.09); }
body.merchant-tech-login .merchant-login-panel .form-control::placeholder { color: #a4b6cb; }
body.merchant-tech-login .merchant-login-panel .input-group { display: flex; align-items: stretch; gap: 12px; }
body.merchant-tech-login .merchant-login-panel .input-group > .form-control { flex: 1 1 0; width: 0; max-width: none; border-radius: 8px; }
body.merchant-tech-login .merchant-login-panel .input-group-append { flex: 0 0 135px; width: auto !important; margin-left: 0; }
body.merchant-tech-login .merchant-login-panel .input-group-text { width: 100%; margin: 0; padding: 0 5px; overflow: hidden; border: 1px solid #d9e5f5; border-radius: 8px; background: #f7faff; }
body.merchant-tech-login .merchant-login-panel .input-group-text img { display: block; width: 100%; min-height: 0; height: 43px; margin: 0; padding: 0; border: 0; border-radius: 0; object-fit: contain; background: none; cursor: pointer; }
body.merchant-tech-login .merchant-login-panel .checkbox { margin-top: 2px; margin-bottom: 6px; }
body.merchant-tech-login .merchant-login-panel .checkbox label { margin-bottom: 0; color: #90a2b9; font-size: 12px; }
body.merchant-tech-login .merchant-login-panel a { color: #6b8bb2; font-size: 12px; }
body.merchant-tech-login .merchant-login-panel a:hover { color: #2465d4; }
body.merchant-tech-login .merchant-login-panel #loginBtn { min-height: 47px; border: 1px solid #2465e9; border-radius: 8px; color: #fff; background: #2465e9; box-shadow: 0 6px 17px rgba(36,101,233,.20); font-size: 14px; font-weight: 500; letter-spacing: 1px; }
body.merchant-tech-login .merchant-login-panel #loginBtn:hover,
body.merchant-tech-login .merchant-login-panel #loginBtn:focus { border-color: #174fc2; background: #174fc2; box-shadow: 0 0 0 3px rgba(36,101,233,.13), 0 6px 17px rgba(36,101,233,.20); }
body.merchant-tech-login .merchant-login-footer { margin-top: 28px; color: #a0b2c7; font-size: 11px; line-height: 1.8; text-align: center; }

@media (max-width: 1199px) and (min-width: 992px) {
  body.merchant-sidebar-layout #topnav .navbar-custom > .container-fluid { padding-right: 20px; padding-left: 20px; }
  body.merchant-sidebar-layout .wrapper > .container-fluid { padding-right: 20px; padding-left: 20px; }
  body.merchant-tech-login .merchant-login-shell { grid-template-columns: minmax(0,1fr) 510px; padding: 45px 35px; }
  body.merchant-tech-login .merchant-login-art { padding-right: 35px; }
  body.merchant-tech-login .merchant-login-art :is(h1,h2) { font-size: 31px; }
  body.merchant-tech-login .merchant-login-panel { padding: 42px; }
}
@media (max-width: 991px) {
  body.merchant-sidebar-layout #topnav .navbar-custom { margin-left: 0; }
  body.merchant-sidebar-layout #topnav .navbar-custom > .container-fluid { padding-right: 16px; padding-left: 18px; }
  body.merchant-sidebar-layout #topnav .topbar-menu { transform: translateX(-100%); visibility: hidden; transition: transform .2s ease, visibility .2s; }
  body.merchant-sidebar-layout.merchant-sidebar-open #topnav .topbar-menu { transform: translateX(0); visibility: visible; }
  body.merchant-sidebar-layout .merchant-sidebar-close { display: inline-flex; }
  body.merchant-sidebar-layout #topnav .navbar-custom .navbar-toggle { display: flex; }
  body.merchant-sidebar-layout .wrapper { margin-left: 0; padding-top: 103px; }
  body.merchant-sidebar-layout .wrapper > .container-fluid { padding-right: 18px; padding-left: 18px; }
  body.merchant-sidebar-layout .footer { left: 0; padding-right: 18px; padding-left: 18px; }
  body.merchant-sidebar-layout.merchant-sidebar-open { overflow: hidden; }
  body.merchant-sidebar-layout.merchant-sidebar-open::before { content: ""; position: fixed; inset: 0; background: rgba(15,36,78,.34); z-index: 1020; }
  body.merchant-sidebar-layout .page-title-box { margin-bottom: 20px; }
  body.merchant-sidebar-layout .page-title-box :is(.page-title,h4) { font-size: 21px; }
  body.merchant-tech-login .merchant-login-shell { display: flex; justify-content: center; min-height: 100vh; padding: 42px 24px; }
  body.merchant-tech-login .merchant-login-art { display: none; }
  body.merchant-tech-login .merchant-login-panel { max-width: 510px; padding: 42px; }
}
@media (max-width: 575px) {
  body.merchant-sidebar-layout #topnav .navbar-custom > .container-fluid { padding-right: 8px; padding-left: 15px; }
  body.merchant-sidebar-layout #topnav .topbar-right-menu { gap: 0; }
  body.merchant-sidebar-layout #topnav .navbar-custom .nav-link { padding-right: 7px !important; padding-left: 7px !important; }
  body.merchant-sidebar-layout #topnav .navbar-custom .noti-icon { width: 24px; }
  body.merchant-sidebar-layout #topnav .nav-user img { width: 27px; height: 27px; }
  body.merchant-sidebar-layout #topnav .nav-user > span { display: none; }
  body.merchant-sidebar-layout #changeyuyan { width: 86px !important; padding-right: 3px; padding-left: 5px; font-size: 10px; }
  body.merchant-sidebar-layout .merchant-topbar-context { padding-right: 5px; }
  body.merchant-sidebar-layout .merchant-topbar-context :is(strong,.merchant-topbar-title) { max-width: 115px; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
  body.merchant-sidebar-layout .merchant-topbar-context :is(small,.merchant-topbar-subtitle) { display: none; }
  body.merchant-sidebar-layout .wrapper > .container-fluid { padding-right: 12px; padding-left: 12px; }
  :is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .card-body { padding: 19px 16px; }
  :is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .card-header { padding: 16px; }
  body.merchant-sidebar-layout .page-title-box .breadcrumb { display: none; }
  body.merchant-sidebar-layout .page-title-box :is(h4,.page-title) { font-size: 20px; }
  body.merchant-sidebar-layout .footer { position: static; margin-left: 0; text-align: center; }
  body.merchant-sidebar-layout .footer .float-right { float: none !important; }
  body.merchant-theme-dialog { padding: 10px; }
  body.merchant-tech-login .merchant-login-shell { padding: 23px 15px; }
  body.merchant-tech-login .merchant-login-panel { padding: 30px 25px; border-radius: 18px; }
  body.merchant-tech-login .merchant-login-brand { margin-bottom: 28px; font-size: 22px; }
  body.merchant-tech-login .merchant-login-heading { margin-bottom: 25px; }
  body.merchant-tech-login .merchant-login-heading :is(h1,h2) { font-size: 23px; }
  body.merchant-tech-login .merchant-login-panel .input-group { gap: 9px; }
  body.merchant-tech-login .merchant-login-panel .input-group-append { flex-basis: 112px; }
}
@media (prefers-reduced-motion: reduce) {
  :is(body.merchant-sidebar-layout,body.merchant-tech-login,body.merchant-theme-dialog) * { transition: none !important; }
}

/* Scoped document navigation; exported protocol text and request examples stay intact. */
body.merchant-sidebar-layout #merchant-api-doc {
  max-width: none;
  --doc-top: 104px;
}
body.merchant-sidebar-layout #merchant-api-doc :is(h1,h2,h3,h4) { color: #24436e; }
body.merchant-sidebar-layout #merchant-api-doc nav a {
  border-left: 3px solid transparent;
  color: #6d86a7;
}
body.merchant-sidebar-layout #merchant-api-doc nav a:hover {
  color: #2465d4;
  background-color: #edf5ff;
}
body.merchant-sidebar-layout #merchant-api-doc nav a.active,
body.merchant-sidebar-layout #merchant-api-doc nav a.is-active,
body.merchant-sidebar-layout #merchant-api-doc nav a[aria-current] {
  border-left-color: #4c91ee;
  color: #2465d4;
  background-color: #eaf3ff;
}

/* Existing ledger filters gain labels only; their controls and submitted fields do not change. */
body.merchant-sidebar-layout .merchant-field-label {
  display: block;
  margin: 0 0 8px;
  color: #7f94ad;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
}
body.merchant-sidebar-layout .layui-input-inline { vertical-align: top; }

/* Redirect and iframe pages use the palette without a sidebar or header offset. */
body.merchant-theme-dialog.bg-account-pages {
  min-height: 100vh;
  color: #1c355b;
  background-color: #f3f8ff;
  background-image: linear-gradient(135deg,#f1f7ff,#f8fbff 65%,#eef6ff);
}

/* Card-box is the legacy User page surface, with its existing controls intact. */
:is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .card-box { padding: 25px 26px; margin-bottom: 24px; border: 1px solid rgba(220,230,243,.7); border-radius: 16px; background: #fff; box-shadow: 0 6px 26px rgba(33,81,145,.045); }
body.merchant-sidebar-layout .merchant-brand-link { display: flex; align-items: center; flex: 1 1 auto; min-width: 0; }
@media (max-width:575px) { :is(body.merchant-sidebar-layout,body.merchant-theme-dialog) .card-box { padding: 19px 16px; } }

/* This existing login-info widget keeps its white text on a blue surface. */
body.merchant-sidebar-layout .card-box.widget-chart-one.gradient-success { border-color: transparent; background: linear-gradient(125deg,#1460dd,#178cdb); }

/* Keep the Philippines brand fully visible as the mobile close button shares its row. */
body.merchant-sidebar-layout .merchant-brand-link {
  display: flex; align-items: center; justify-content: center; flex: 1 1 188px;
  min-width: 0; max-width: 188px; height: 63px; margin-right: auto; margin-left: auto;
}
body.merchant-sidebar-layout .merchant-brand-link > img {
  display: block; width: 100%; min-width: 0; max-width: 100%;
  height: 100%; max-height: 63px; object-fit: contain;
}

/* Keep existing API documentation content; match the common card corners. */
body.merchant-sidebar-layout #merchant-api-doc .api-doc-nav,
body.merchant-sidebar-layout #merchant-api-doc .api-doc-section { border-radius: 16px; }

/* Legacy inline date widths must fit inside narrow filter cards. */
@media (max-width: 575px) {
  :is(body.merchant-sidebar-layout,body.merchant-theme-dialog) form :is(.layui-inline,.layui-input-inline,.datetime-input) { max-width: 100%; }
}