:root{
 --vine-bg:#f5f6fa;
 --vine-surface:#fff;
 --vine-raised:#fff;
 --vine-soft:#f0f2f7;
 --vine-input:#fff;
 --vine-text:#171923;
 --vine-heading:#11141d;
 --vine-muted:#667085;
 --vine-faint:#9299a8;
 --vine-border:#e2e5ed;
 --vine-brand:#6c5ce7;
 --vine-brand-hover:#5846dc;
 --vine-brand-soft:rgba(108,92,231,.13);
 --vine-shadow:0 18px 55px rgba(24,29,48,.09);
 --vine-nav:rgba(255,255,255,.88);
 color-scheme:light;
}

html[data-theme="dark"]{
 --vine-bg:#0e1016;
 --vine-surface:#181b24;
 --vine-raised:#1d2029;
 --vine-soft:#242834;
 --vine-input:#12151d;
 --vine-text:#edf0f6;
 --vine-heading:#f7f8fb;
 --vine-muted:#a9b1c0;
 --vine-faint:#7f899b;
 --vine-border:#2c313d;
 --vine-brand:#8375ff;
 --vine-brand-hover:#998eff;
 --vine-brand-soft:rgba(131,117,255,.17);
 --vine-shadow:0 22px 70px rgba(0,0,0,.34);
 --vine-nav:rgba(14,16,22,.88);
 color-scheme:dark;
}

html,
body{
 background:var(--vine-bg)!important;
 color:var(--vine-text)!important;
}

body,
main,
.container,
.wrapper,
.page,
.content-wrapper{
 color:var(--vine-text)!important;
}

h1,h2,h3,h4,h5,h6,
legend,strong,label{
 color:var(--vine-heading)!important;
}

p,small,.muted,.subtitle,
.description,.help-text,
.auth-subtitle,.auth-note{
 color:var(--vine-muted)!important;
}

.nav,.navbar,header,.site-header{
 background:var(--vine-nav)!important;
 border-color:var(--vine-border)!important;
}

.nav a,.navbar a,.site-header a,
.brand,.vine-brand-with-logo{
 color:var(--vine-text)!important;
}

.card,.panel,.box,
.auth-card,.authv3-card,
.auth-final-card,.login-card,
.register-card,.forgot-card,
.reset-card,.verify-card,
.auth-box,.auth-form-card,
.account-card,.admin-card,
.product-admin-item,
.product-create-card,
.product-edit-card,
.modal-content,dialog{
 background:var(--vine-raised)!important;
 color:var(--vine-text)!important;
 border-color:var(--vine-border)!important;
 box-shadow:var(--vine-shadow)!important;
}

.auth-card h1,.auth-card h2,
.authv3-card h1,.authv3-card h2,
.auth-final-card h1,
.login-card h1,.register-card h1,
.forgot-card h1,.reset-card h1,
.auth-title,.authv3-title{
 color:var(--vine-heading)!important;
 opacity:1!important;
 -webkit-text-fill-color:currentColor!important;
}

.auth-eyebrow,.auth-kicker,
.authv3-eyebrow{
 color:var(--vine-brand)!important;
}

input,textarea,select,
.form-control,.input{
 background:var(--vine-input)!important;
 color:var(--vine-text)!important;
 border-color:var(--vine-border)!important;
 caret-color:var(--vine-brand);
 box-shadow:none!important;
}

input::placeholder,
textarea::placeholder{
 color:var(--vine-faint)!important;
 opacity:1!important;
}

input:focus,textarea:focus,
select:focus,.form-control:focus{
 border-color:var(--vine-brand)!important;
 outline:none!important;
 box-shadow:0 0 0 3px
   var(--vine-brand-soft)!important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
 -webkit-text-fill-color:
   var(--vine-text)!important;
 -webkit-box-shadow:
   0 0 0 1000px var(--vine-input)
   inset!important;
}

table,thead,tbody,tr,th,td{
 color:var(--vine-text)!important;
 border-color:var(--vine-border)!important;
}

table,tbody tr{
 background:var(--vine-surface)!important;
}

thead,th{
 background:var(--vine-soft)!important;
}

.btn.alt,.btn.secondary,
button.secondary{
 background:var(--vine-soft)!important;
 color:var(--vine-text)!important;
 border-color:var(--vine-border)!important;
}

.product-meta span,
.product-status.is-inactive,
.product-image-placeholder{
 background:var(--vine-soft)!important;
 color:var(--vine-muted)!important;
}

/* 只显示太阳或月亮 */
.vine-theme-toggle{
 width:42px!important;
 min-width:42px!important;
 height:42px!important;
 min-height:42px!important;
 padding:0!important;
 flex:0 0 42px;
 display:inline-flex!important;
 align-items:center!important;
 justify-content:center!important;
 border:1px solid var(--vine-border)!important;
 border-radius:12px!important;
 background:var(--vine-soft)!important;
 color:var(--vine-text)!important;
 box-shadow:none!important;
 cursor:pointer;
}

.vine-theme-toggle:hover{
 color:var(--vine-brand)!important;
 border-color:var(--vine-brand)!important;
 background:var(--vine-brand-soft)!important;
 transform:rotate(12deg)!important;
}

.vine-theme-text{
 display:none!important;
}

.vine-theme-icon{
 display:flex!important;
 align-items:center;
 justify-content:center;
 width:21px;
 height:21px;
}

.vine-theme-icon svg{
 width:21px;
 height:21px;
 fill:none;
 stroke:currentColor;
 stroke-width:1.9;
 stroke-linecap:round;
 stroke-linejoin:round;
}

@media(max-width:800px){
 .vine-theme-toggle{
  width:38px!important;
  min-width:38px!important;
  height:38px!important;
  min-height:38px!important;
  flex-basis:38px;
 }
}
