/* V5.0.7 consolidated visual styling; supersedes V5.0.6. */
/* LingShi V5.0.6 — consolidated final-frame styles, replaces V5.0.3–V5.0.5 only.
   All selectors scoped to the existing merchant layout; no business logic changes. */
#app .layout-right > header.header{min-height:54px;border-bottom:1px solid #e9effa}
#app main.layout-main-content{background:linear-gradient(115deg,#f9fbff 0%,#f2f6ff 52%,#eaf3ff 100%);padding-bottom:32px!important;min-height:0}
#app main.layout-main-content > .tabs{display:none!important}
#app .layout-right > .arco-layout-footer{display:none!important}
#app main.layout-main-content .merchant-workbench.ls47-workbench{padding-bottom:32px!important}
#app main.layout-main-content :is(a,button,[role="button"]):focus-visible{outline:2px solid #347cff;outline-offset:3px}
/* Desktop sidebar: original LS mark reworked into a dimensional decorative asset. */
@media(min-width:1100px){
  #app .arco-layout-sider{position:relative;isolation:isolate}
  #app .arco-layout-sider::after{
    content:"安全稳定的\A聚合支付服务"!important;
    display:block!important;box-sizing:border-box;
    position:absolute;left:8px;right:8px;bottom:18px;
    min-height:220px;padding:175px 0 0!important;
    background-image:url('/mer/assets/brand/lingshi-hero-3d.png')!important;
    background-repeat:no-repeat!important;
    background-position:center top!important;
    background-size:205px 164px!important;
    color:#36578d!important;font-size:12px!important;font-weight:700!important;
    line-height:1.55!important;text-align:center!important;
    letter-spacing:.25px;white-space:pre!important;
    opacity:1!important;filter:none!important;
    pointer-events:none;z-index:0;
  }
  #app .arco-layout-sider .arco-menu{position:relative;z-index:1}
}
@media(max-width:1099px){#app .arco-layout-sider::after{content:none!important;display:none!important}}
@media(max-width:767px){#app main.layout-main-content{background:#f5f8ff;padding-bottom:18px!important}#app main.layout-main-content .merchant-workbench.ls47-workbench{padding-bottom:18px!important}}
@media(prefers-reduced-motion:reduce){#app main.layout-main-content *{scroll-behavior:auto!important}}

/* V5.0.7 restrained visual refinement: no routing or data modifications. */
@media(min-width:1200px){
  #app .merchant-workbench.ls47-workbench .ls25-greeting{margin-bottom:17px!important}
  #app .merchant-workbench.ls47-workbench .ls27-kpis{margin-bottom:18px!important}
  #app .merchant-workbench.ls47-workbench .ls25-main{gap:17px!important}
  #app .merchant-workbench.ls47-workbench .ls25-panel{box-shadow:0 10px 28px rgba(40,73,142,.075)!important}
  #app .merchant-workbench.ls47-workbench .ls25-trend-empty{background:linear-gradient(180deg,rgba(244,248,255,.88),rgba(255,255,255,.74))!important;border-color:#e4ecff!important}
  #app .merchant-workbench.ls47-workbench .ls25-shortcuts button{border-radius:15px!important}
  #app .merchant-workbench.ls47-workbench .ls25-shortcuts button:focus-visible{outline:2px solid #347cff;outline-offset:2px}
}
@media(min-width:1100px) and (min-height:760px){
  #app .arco-layout-sider::after{background-size:216px 173px!important;min-height:233px;padding-top:184px!important;bottom:16px!important}
}
@media(max-height:740px){
  #app .arco-layout-sider::after{background-size:165px 132px!important;min-height:177px;padding-top:137px!important;bottom:9px!important}
}
@media(max-width:1199px){
  #app .merchant-workbench.ls47-workbench .ls25-main{grid-template-columns:1fr!important}
}

/* V5.0.8 final visual details. All rules scoped to workbench; no UI controls replaced. */
@media (min-width:1200px) {
 #app .ls47-workbench .ls25-panel{border:1px solid rgba(225,234,250,.68)!important;box-shadow:0 8px 24px rgba(44,78,145,.065)!important}
 #app .ls47-workbench .ls25-panel-heading{padding-bottom:11px!important}
 #app .ls47-workbench .ls25-shortcuts button{background:linear-gradient(160deg,#f8faff,#eef3ff)!important;border:1px solid #e5ecfb!important;box-shadow:none!important;transition:background .16s ease,border-color .16s ease,transform .16s ease!important}
 #app .ls47-workbench .ls25-shortcuts button:hover{background:#eaf1ff!important;border-color:#b8cbff!important}
 #app .ls47-workbench .ls25-shortcuts button .ls47-shortcut-icon{color:#4075f8!important;text-shadow:none!important}
 #app .ls47-workbench .ls25-trend-empty{background:linear-gradient(180deg,#f7faff 0%,#fff 100%)!important;border:1px dashed #e1eaff!important;border-radius:15px!important}
 #app .ls47-workbench .ls25-merchant dl>div{border-bottom-color:#edf2fa!important}
}
@media (max-width:1199px) and (min-width:721px){
 #app .ls47-workbench .ls25-main{grid-template-columns:1fr!important}
}
@media (prefers-reduced-motion:reduce){#app .ls47-workbench .ls25-shortcuts button{transition:none!important}}

/* V5.0.9 reference-aligned workbench. Scoped to dashboard and verified framework classes. */
@media(min-width:1200px){
#app .ls509-workbench{padding:17px 20px 45px!important;background:radial-gradient(ellipse 80% 35% at 55% -5%,rgba(184,177,255,.40),transparent 78%),radial-gradient(ellipse 48% 60% at 100% 5%,rgba(147,197,255,.45),transparent 85%),linear-gradient(130deg,#f6f8ff,#e8efff 65%,#f5f7ff)!important}
#app .ls509-workbench .ls25-greeting{min-height:72px!important;margin-bottom:10px!important}
#app .ls509-workbench .ls25-greeting-title{font-size:27px!important}
#app .ls509-workbench .ls27-kpis{gap:15px!important;margin-bottom:16px!important}
#app .ls509-workbench .ls27-kpi{min-height:105px!important;padding:13px 17px!important;border-radius:20px!important;box-shadow:0 7px 16px rgba(46,86,158,.09)!important}
#app .ls509-workbench .ls27-kpi-icon{width:64px!important;height:64px!important;font-size:34px!important}
#app .ls509-workbench .ls27-kpi strong{font-size:29px!important}
#app .ls509-workbench .ls25-main{grid-template-columns:minmax(0,1.94fr) minmax(350px,1fr)!important;gap:17px!important}
#app .ls509-workbench .ls25-panel{padding:15px 19px!important;border-radius:21px!important}
#app .ls509-workbench .ls25-panel-heading{font-size:17px!important}
#app .ls509-workbench .ls25-shortcuts button{min-height:88px!important}
#app .ls509-workbench .ls25-notice{min-height:108px!important}
#app .ls509-workbench .ls25-merchant dl>div{min-height:32px!important;padding:5px 0!important}
#app .ls509-workbench .ls27-aux{opacity:.95}
}
#app .ls509-workbench .ls509-chart{min-height:250px;display:flex;flex-direction:column;gap:9px}
#app .ls509-workbench .ls509-chart-summary{display:flex;gap:22px;flex-wrap:wrap;font-weight:650;color:#14234b;font-size:13px;padding:1px 2px 4px}
#app .ls509-workbench .ls509-chart-grid{position:relative;display:grid;grid-template-rows:repeat(6,minmax(0,1fr));height:188px;padding:0 0 0 3px}
#app .ls509-workbench .ls509-chart-row{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:8px;color:#63749d;font-size:12px}
#app .ls509-workbench .ls509-chart-row i{display:block;border-top:1px solid #dce5fc;height:0}
#app .ls509-workbench .ls509-chart-notice{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:9px 15px;border-radius:12px;background:rgba(255,255,255,.91);border:1px solid #e6ecfc;text-align:center;color:#5870a5;display:flex;flex-direction:column;gap:4px;white-space:nowrap;box-shadow:0 4px 16px #d9e5ff55}
#app .ls509-workbench .ls509-chart-notice small{font-size:11px;font-weight:400}
#app .ls509-workbench .ls509-chart-legend{text-align:center;color:#5270a8;font-size:12px}
#app .ls509-workbench .ls25-trend{min-height:322px}
#app .ls509-workbench .ls25-merchant{order:3}
#app .ls509-workbench .ls27-aux{order:4}
@media(max-width:720px){#app .ls509-workbench .ls509-chart-summary{gap:8px;font-size:11px}#app .ls509-workbench .ls509-chart-notice{max-width:85%;white-space:normal}#app .ls509-workbench .ls509-chart{min-height:235px}}

/* V5.1.1: chart rendering repair, reference hierarchy. */
#app .ls511-workbench .ls511-chart-dates{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding:0 0 0 46px;gap:0;color:#526b9e;font-size:11px;line-height:19px;text-align:center;min-height:19px}
#app .ls511-workbench .ls511-chart-dates span:first-child{text-align:left}
#app .ls511-workbench .ls511-chart-dates span:last-child{text-align:right}
#app .ls511-workbench .ls509-chart{gap:5px!important}
#app .ls511-workbench .ls509-chart-grid{height:175px!important}
#app .ls511-workbench .ls509-chart-notice{padding:5px 10px!important;background:rgba(255,255,255,.84)!important;box-shadow:none!important}
#app .ls511-workbench .ls27-aux{display:none!important}
@media(max-width:720px){#app .ls511-workbench .ls511-chart-dates{font-size:9px;padding-left:36px}}

/* V5.1.2 — reference-driven frame treatment. Pure CSS; existing controls retain behavior. */
@media(min-width:1100px){
  #app .layout-right > header.header{
    min-height:72px!important;height:72px!important;
    background:linear-gradient(112deg,rgba(244,248,255,.94) 0%,rgba(218,225,255,.95) 45%,rgba(158,192,255,.94) 100%)!important;
    border-bottom:1px solid rgba(255,255,255,.72)!important;
    box-shadow:none!important;
  }
  #app .layout-right > header.header .header_crumb{opacity:.78}
  #app .layout-right > header.header :is(button,[role="button"]){border-radius:999px}
  #app .logo_box .ls-brand-badge{background:#0968f5!important;color:#fff!important;padding:5px 10px!important;border-radius:999px!important;font-weight:700!important}
  #app .logo_box .logo_title{font-size:20px!important;letter-spacing:-.35px!important}
  #app .arco-layout-sider::after{
    background-image:url('/mer/assets/brand/lingshi-badge-v512.svg')!important;
    background-size:202px 180px!important;
    background-position:center top!important;
    min-height:244px!important;
    padding-top:187px!important;
    bottom:13px!important;
    filter:none!important;
  }
  /* Unify the existing menu icon palette without changing click targets. */
  #app .arco-layout-sider .arco-menu :is(svg,[class*="icon"]){color:#365b9d!important}
  #app .arco-layout-sider .arco-menu-item{min-height:43px}
}
@media(max-width:1099px){#app .layout-right > header.header{background:linear-gradient(100deg,#f8faff,#e7efff)!important}}

/* V5.1.3 — fix split-color header; preserve Vue events and controls. */
@media (min-width:1100px) {
  #app .layout-right > header.arco-layout-header.header {
    position:relative!important;
    isolation:isolate;
    background:linear-gradient(105deg,#f5f8ff 0%,#e2e9ff 34%,#bed0ff 72%,#a9c5ff 100%)!important;
    overflow:visible;
  }
  /* The user-controls wrapper was painting a white rectangle over the header gradient. */
  #app .layout-right > header.header > :last-child {
    background:transparent!important;
    box-shadow:none!important;
  }
  #app .layout-right > header.header > :last-child > :not(button):not([role="button"]) {
    background-color:transparent!important;
  }
  #app .layout-right > header.header .header_crumb {
    background:transparent!important;
    opacity:1!important;
  }
  /* Style the existing profile entry, without replacing or intercepting its click behavior. */
  #app .layout-right > header.header > :last-child :is(.arco-dropdown-trigger,[aria-haspopup="menu"]) {
    border-radius:999px!important;
    background:rgba(255,255,255,.53)!important;
    border:1px solid rgba(255,255,255,.7)!important;
    padding:5px 12px!important;
  }
  #app .layout-right > header.header > :last-child :is(.arco-dropdown-trigger,[aria-haspopup="menu"]):focus-visible {
    outline:2px solid #1d6cff!important;
    outline-offset:2px;
  }
}
@media (max-width:1099px) {
  #app .layout-right > header.header > :last-child {background:transparent!important;}
}

/* V5.1.4: align the live dashboard more closely to the supplied reference.
   CSS-only: do not alter business data, links, Vue events or menu structure. */
@media (min-width:1100px) {
  /* Restore the reference's compact first-screen density. */
  #app .ls509-workbench {padding:14px 18px 28px!important}
  #app .ls509-workbench .ls25-greeting {min-height:66px!important;margin-bottom:8px!important}
  #app .ls509-workbench .ls27-kpis {gap:15px!important;margin-bottom:14px!important}
  #app .ls509-workbench .ls27-kpi {min-height:100px!important;padding:13px 17px!important}
  #app .ls509-workbench .ls25-main {grid-template-columns:minmax(0,1.94fr) minmax(350px,1fr)!important;gap:16px!important}
  #app .ls509-workbench .ls25-panel {padding:15px 18px!important}
  #app .ls509-workbench .ls25-trend {min-height:300px!important}
  #app .ls509-workbench .ls509-chart-grid {height:165px!important}
  #app .ls509-workbench .ls509-chart {min-height:232px!important;gap:5px!important}
  #app .ls509-workbench .ls25-shortcuts button {min-height:78px!important}
  #app .ls509-workbench .ls25-notice {min-height:100px!important}
  #app .ls509-workbench .ls25-merchant dl>div {min-height:29px!important;padding:4px 0!important}
  /* Give the actual merchant control a reference-like capsule without replacing it. */
  #app .layout-right > header.header > :last-child {border-radius:999px!important}
  #app .layout-right > header.header > :last-child :is(.arco-dropdown-trigger,[aria-haspopup="menu"]) {
    min-height:42px!important;
    padding:5px 14px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.57)!important;
    border:1px solid rgba(255,255,255,.86)!important;
    box-shadow:0 3px 12px rgba(66,105,190,.07)!important;
  }
  /* Avoid a fixed-looking status notice covering the middle of the chart. */
  #app .ls511-workbench .ls509-chart-notice {
    top:40%!important;
    padding:5px 10px!important;
    border:1px solid #e8edfa!important;
    font-size:12px!important;
  }
}
/* Make the existing legend distinguishable without inventing a plotted series. */
#app .ls509-workbench .ls509-chart-summary {align-items:center!important}
#app .ls509-workbench .ls509-chart-legend {font-weight:500!important}
/* Keep the compact layout from overflowing on tablet/mobile. */
@media (max-width:1099px) {
  #app .ls509-workbench .ls25-main {grid-template-columns:minmax(0,1fr)!important}
  #app .ls509-workbench .ls25-panel {min-width:0!important}
}

/* V5.1.5 — reference screenshot comparison: visual-only, preserve events/data. */
@media (min-width:1100px) {
  /* Reference uses a soft continuous gradient, not a distinct dark header strip. */
  #app .layout-right > header.arco-layout-header.header {
    height:72px!important;min-height:72px!important;
    background:linear-gradient(105deg,#f7f9ff 0%,#e6eaff 36%,#c4d2ff 74%,#b5ceff 100%)!important;
  }
  /* Reference sidebar is calmer: remove the multicolor appearance of menu pictograms.
     Apply only to menu graphic nodes, never text, badge, or the LS branding. */
  #app [class*="menu"] :is(.arco-menu-icon, .menu-icon, .menu_icon) svg,
  #app .arco-menu :is(.arco-menu-icon,.menu-icon,.menu_icon) img {
    filter:grayscale(1) sepia(1) saturate(5) hue-rotate(180deg) brightness(.82)!important;
  }
  /* Restore stronger hierarchy found in the reference KPI cards. */
  #app .ls509-workbench .ls27-kpi {border-radius:21px!important;min-height:106px!important}
  #app .ls509-workbench .ls27-kpi strong {font-size:31px!important;letter-spacing:-.6px!important;line-height:1.18!important}
  #app .ls509-workbench .ls27-kpi-icon {width:61px!important;height:61px!important;flex-shrink:0!important}
  #app .ls509-workbench .ls25-panel-heading {font-size:17px!important;font-weight:750!important}
  /* Match reference's clearer panel separation and slightly taller trend graph. */
  #app .ls509-workbench .ls25-main {grid-template-columns:minmax(0,1.94fr) minmax(350px,1fr)!important;gap:16px!important}
  #app .ls509-workbench .ls25-panel {background:rgba(255,255,255,.96)!important;box-shadow:0 9px 24px rgba(54,83,157,.075)!important}
  #app .ls509-workbench .ls25-trend {min-height:312px!important}
  #app .ls509-workbench .ls509-chart-grid {height:177px!important}
  #app .ls509-workbench .ls509-chart {min-height:245px!important}
  #app .ls509-workbench .ls509-chart-notice {top:43%!important;max-width:75%!important}
  #app .ls509-workbench .ls25-shortcuts button {min-height:82px!important;border-radius:15px!important}
  #app .ls509-workbench .ls25-merchant dl>div {min-height:31px!important}
  /* Keep the reference's left-side floating badge and readable caption. */
  #app .arco-layout-sider::after {background-size:202px 180px!important;bottom:14px!important}
}
@media (max-width:1099px) {
  #app .ls509-workbench .ls25-main {grid-template-columns:minmax(0,1fr)!important}
}

/* V5.1.6 — actual header merchant identity, preserve existing dropdown events. */
@media(min-width:1100px){
 #app .layout-right>header.header{height:72px!important;min-height:72px!important}
 #app .layout-right>header.header .ls516-profile{display:inline-flex!important;align-items:center!important;gap:9px!important;min-height:52px!important;padding:6px 17px!important;border-radius:999px!important;background:rgba(255,255,255,.57)!important;border:1px solid rgba(255,255,255,.83)!important;box-shadow:0 4px 18px rgba(52,96,187,.08)!important;max-width:390px!important}
 #app .layout-right>header.header .ls516-profile .ls516-merchant-no{display:block!important;font-size:11px!important;line-height:15px!important;letter-spacing:0!important;color:#263956!important;white-space:nowrap!important;font-weight:500!important;pointer-events:none!important}
 #app .layout-right>header.header .ls516-profile .ls516-merchant-no:empty{display:none!important}
 #app .ls509-workbench .ls509-chart-notice{top:27%!important;left:auto!important;right:12px!important;transform:none!important;max-width:230px!important;text-align:right!important;background:rgba(255,255,255,.93)!important}
 #app .ls509-workbench .ls27-kpi{min-height:112px!important}
}
@media(max-width:1099px){#app .ls516-merchant-no{display:none!important}}