/* Coolo 鍏ㄥ眬缇庡寲 */
.coolo-bf-gray{filter:grayscale(100%)}
.coolo-bf-scrollbar::-webkit-scrollbar{width:8px;height:8px}
.coolo-bf-scrollbar::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#ff8a65,#ec407a);border-radius:8px}
.coolo-bf-nav-bold .navbar .nav>li>a,.coolo-bf-nav-bold .header-nav a{font-weight:700}
/* LOGO shine: align scbkw.com searchLights */
.coolo-bf-logo-shine .navbar-brand{
  position:relative;
  overflow:hidden;
  margin:0;
}
.coolo-bf-logo-shine .navbar-brand::before{
  content:"";
  position:absolute;
  left:-665px;
  top:-460px;
  width:200px;
  height:15px;
  background-color:rgba(255,255,255,.5);
  pointer-events:none;
  z-index:2;
  -webkit-transform:rotate(-45deg);
  -moz-transform:rotate(-45deg);
  -ms-transform:rotate(-45deg);
  -o-transform:rotate(-45deg);
  transform:rotate(-45deg);
  -webkit-animation:searchLights 6s ease-in 0s infinite;
  -o-animation:searchLights 6s ease-in 0s infinite;
  animation:searchLights 6s ease-in 0s infinite;
}
@-moz-keyframes searchLights{
  50%{left:-100px;top:0}
  65%{left:120px;top:100px}
}
@keyframes searchLights{
  40%{left:-100px;top:0}
  60%{left:120px;top:100px}
  80%{left:-100px;top:0}
}
  60%{left:120px;top:100px}
  80%{left:-100px;top:0}
}
/* 下拉毛玻璃：对齐原站 header blur 质感 */
.coolo-bf-nav-blur .dropdown-menu,
.coolo-bf-nav-blur .sub-menu,
.coolo-bf-nav-blur .navbar .sub-menu,
.coolo-bf-nav-blur .hover-show-con.dropdown-menu{
  -webkit-backdrop-filter:saturate(180%) blur(18px)!important;
  backdrop-filter:saturate(180%) blur(18px)!important;
  background:rgba(255,255,255,.72)!important;
  border:1px solid rgba(255,255,255,.45)!important;
  box-shadow:0 10px 28px rgba(15,23,42,.10)!important
}
body.dark-theme .coolo-bf-nav-blur .dropdown-menu,
body.dark-theme .coolo-bf-nav-blur .sub-menu,
body.dark-theme .coolo-bf-nav-blur .hover-show-con.dropdown-menu{
  background:rgba(32,34,40,.78)!important;
  border-color:rgba(255,255,255,.08)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.35)!important
}
/* 萌萌猫耳：挂在 logo，给品牌区留耳尖空间 */
.coolo-bf-cat-ears .navbar-brand{
  position:relative;
  overflow:visible!important;
  padding-top:10px
}
.coolo-bf-cat-ears .navbar-logo,
.coolo-bf-cat-ears .logo-img{
  position:relative;
  display:inline-block;
  overflow:visible
}
.coolo-bf-cat-ears .navbar-logo::before,
.coolo-bf-cat-ears .navbar-logo::after,
.coolo-bf-cat-ears .logo-img::before,
.coolo-bf-cat-ears .logo-img::after{
  content:"";
  position:absolute;
  top:-9px;
  width:14px;
  height:18px;
  background:linear-gradient(180deg,#ff9ec4 0%,#ff6b9d 70%,#f06292 100%);
  border-radius:50% 50% 35% 35%;
  box-shadow:inset -2px -2px 0 rgba(255,255,255,.35),0 1px 2px rgba(240,98,146,.35);
  z-index:3;
  pointer-events:none;
  transition:transform .25s ease
}
.coolo-bf-cat-ears .navbar-logo::before,
.coolo-bf-cat-ears .logo-img::before{
  left:2px;
  transform:rotate(-22deg);
  transform-origin:bottom center
}
.coolo-bf-cat-ears .navbar-logo::after,
.coolo-bf-cat-ears .logo-img::after{
  left:16px;
  transform:rotate(22deg);
  transform-origin:bottom center
}
.coolo-bf-cat-ears .navbar-brand:hover .navbar-logo::before,
.coolo-bf-cat-ears .navbar-brand:hover .logo-img::before{transform:rotate(-28deg)}
.coolo-bf-cat-ears .navbar-brand:hover .navbar-logo::after,
.coolo-bf-cat-ears .navbar-brand:hover .logo-img::after{transform:rotate(28deg)}
#coolo-bf-progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:99999;background:linear-gradient(90deg,#339933,#FF6666);border-radius:5px;transition:width .12s linear}
/* 回到顶部：独立态 + 并入 float-right 后沿用子比 float-btn */
.coolo-bf-backtop{
  position:fixed;right:18px;bottom:88px;z-index:99990;
  width:40px;min-height:40px;border:0;border-radius:8px;
  background:var(--float-btn-bg,rgba(200,200,200,.4));
  color:var(--muted-2-color,#999)!important;
  cursor:pointer;opacity:0;visibility:hidden;transform:translateY(10px);
  transition:.5s;box-shadow:none;
  display:flex;align-items:center;justify-content:center;text-decoration:none
}
.coolo-bf-backtop.show,.coolo-bf-backtop.is-show{opacity:1;visibility:visible;transform:translateY(0)}
.coolo-bf-backtop:hover{color:var(--focus-color,#f04494)!important}
.coolo-bf-backtop .fa{font-size:1.4em;line-height:1}
.coolo-bf-loading{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;transition:opacity .35s}
.coolo-bf-loading.is-hide{opacity:0;pointer-events:none}
.coolo-bf-spinner{width:42px;height:42px;margin:0 auto 12px;border:3px solid #eee;border-top-color:#ec407a;border-radius:50%;animation:cooloSpin .8s linear infinite}
@keyframes cooloSpin{to{transform:rotate(360deg)}}
.coolo-bf-petal{position:fixed;top:-20px;pointer-events:none;z-index:99990;animation:cooloFall linear forwards}
@keyframes cooloFall{to{transform:translateY(110vh) rotate(360deg);opacity:0}}
.coolo-bf-click{position:fixed;width:12px;height:12px;border-radius:50%;pointer-events:none;z-index:99997;animation:cooloPop .6s ease-out forwards}
@keyframes cooloPop{to{transform:scale(3);opacity:0}}
.coolo-bf-follower{position:fixed;width:22px;height:22px;border:2px solid rgba(236,64,122,.55);border-radius:50%;pointer-events:none;z-index:99996;transform:translate(-50%,-50%);transition:left .08s,top .08s}
.coolo-bf-toast{position:fixed;left:50%;bottom:18%;transform:translateX(-50%);background:rgba(0,0,0,.78);color:#fff;padding:8px 16px;border-radius:20px;z-index:100001;opacity:0;transition:opacity .25s}
.coolo-bf-toast.show{opacity:1}

/* 对齐 scbkw.com panda msg.css */
.qmsg.qmsg-wrapper {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-size: 13px;
    font-variant: tabular-nums;
    line-height: 1;
    list-style: none;
    font-feature-settings: "tnum";
    position: fixed;
    top: 90px;
    left: 0;
    z-index: 9999999;
    width: 100%;
    pointer-events: none;
}

@media (max-width:767px)
{
    .qmsg.qmsg-wrapper {
        top: 70px;
    }
}

.qmsg .qmsg-item{
    padding: 8px;
    text-align: center;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    position: relative;
}
.qmsg .qmsg-item .qmsg-count{
    text-align: center;
    position: absolute;
    left: -4px;
    top: -4px;
    background-color: red;
    color: #fff;
    font-size: 12px;
    line-height: 16px;
    border-radius: 2px;
    display: inline-block;
    min-width: 16px;
    height: 16px;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
}
.qmsg .qmsg-item:first-child{
    margin-top: -8px;
}
.qmsg .qmsg-content{
    text-align: left;
    position: relative;
    display: inline-block;
    padding: 10px 20px;
    background: var(--header-bg);
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
    pointer-events: all;
    max-width: 80%;
    min-width: 80px;
    line-height: 1.4;
    font-size: 14px;
}
.qmsg .qmsg-content [class^="qmsg-content-"]{
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    align-items: center;
}
.qmsg .qmsg-content .qmsg-content-with-close{
    padding-right: 20px;
}

.qmsg .qmsg-icon{
    display: inline-block;
    color: inherit;
    font-style: normal;
    line-height: 0;
    text-align: center;
    text-transform: none;
    vertical-align: -.125em;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    top: 0px;
    margin-right: 8px;
    font-size: 16px;
}
.qmsg .qmsg-icon svg{
    display: inline-block;
}

.qmsg .qmsg-content-info .qmsg-icon{
    color: #1890ff;
    user-select: none;
}
.qmsg .qmsg-icon-close{
    position: absolute;
    top: 11px;
    right: 5px;
    padding: 0;
    overflow: hidden;
    font-size: 12px;
    line-height: 22px;
    background-color: transparent;
    border: none;
    outline: none;
    cursor: pointer;
    color: rgba(0, 0, 0, .45);
    transition: color .3s
}
.qmsg .qmsg-icon-close:hover>svg path{
    stroke: #555;
}
.qmsg .animate-turn{
    animation:MessageTurn 1s linear infinite;  
    -webkit-animation: MessageTurn 1s linear infinite;
}
@keyframes MessageTurn{
    0%{-webkit-transform:rotate(0deg);}
    25%{-webkit-transform:rotate(90deg);}
    50%{-webkit-transform:rotate(180deg);}
    75%{-webkit-transform:rotate(270deg);}
    100%{-webkit-transform:rotate(360deg);}
}
@-webkit-keyframes MessageTurn{
    0%{-webkit-transform:rotate(0deg);}
    25%{-webkit-transform:rotate(90deg);}
    50%{-webkit-transform:rotate(180deg);}
    75%{-webkit-transform:rotate(270deg);}
    100%{-webkit-transform:rotate(360deg);}
}

@-webkit-keyframes MessageMoveOut {
    0% {
        max-height: 150px;
        padding: 8px;
        opacity: 1
    }

    to {
        max-height: 0;
        padding: 0;
        opacity: 0
    }
}

@keyframes MessageMoveOut {
    0% {
        max-height: 150px;
        padding: 8px;
        opacity: 1
    }

    to {
        max-height: 0;
        padding: 0;
        opacity: 0
    }
}


@-webkit-keyframes MessageMoveIn {
    
    0% {
        transform: translateY(-100%);
        transform-origin: 0 0;
        opacity: 0
    }

    to {
        transform: translateY(0);
        transform-origin: 0 0;
        opacity: 1
    }
}

@keyframes MessageMoveIn {
    0% {
        transform: translateY(-100%);
        transform-origin: 0 0;
        opacity: 0
    }

    to {
        transform: translateY(0);
        transform-origin: 0 0;
        opacity: 1
    }
}
@-webkit-keyframes MessageShake {
    0%,
    100% {
      transform: translateX(0px);
      opacity: 1;
    }
  
    25%,
    75% {
        transform: translateX(-4px);
      opacity: 0.75;
    }
  
    50% {
        transform: translateX(4px);
        opacity: 0.25;
    }
  }
@keyframes MessageShake {
    0%,
    100% {
      transform: translateX(0px);
      opacity: 1;
    }
  
    25%,
    75% {
        transform: translateX(-4px);
      opacity: 0.75;
    }
  
    50% {
        transform: translateX(4px);
        opacity: 0.25;
    }
}

/* 对齐 scbkw.com kuakua.css */
/*澶镐竴澶?/
.kuakua-first-box{
    margin: auto;
    width: 440px;
    border-radius: 16px;
    bottom: auto;
    min-height: 10rem;
    left: 50%;
    position: fixed;
    right: auto;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    z-index: 1032;
    box-shadow: 0px 0px 20px #0000001f;
    display: none;
}
@media screen and (max-width: 500px){.kuakua-first-box{width:94%;}}
.kuakua-ei{
    border-radius: 4px;
    overflow: inherit;
}
.kuakua-close{
    z-index: 9999;
    right: 14px !important;
    display: flex;
    position: absolute;
    right: 8px;
    top: 4px;
    padding: 16px;
    cursor: pointer;
}
.kuakua-column{
    position: absolute;
    width: 298px;
    height: auto;
    top: -28px;
    left: 0px;
    right: 0px;
    z-index: 6000;
    background: url(/wp-content/themes/panda/assets/img/kuakua_bg.png) 0% 0% / 298px 83px no-repeat;
    margin: 0 auto;
    text-align: center;
}
.kuakua-headerIcon{
    border-radius: 50%;
    position: relative;
    text-align: center;
    padding: 6px;
    background-color: rgb(255, 255, 255);
    width: 78px;
    height: 78px;
    margin: 0 auto;
}
.kuakua-icon{
    width: 60px !important;
    height: 60px !important;
    fill: currentcolor;
    transition: transform 0.3s ease 0s;
    cursor: pointer;
}
.kuakua-headerTitle{
    font-size: 20px;
    font-weight: 600;
}
.kuakua-modal-body{
    position: relative;
    background-color: transparent;
    text-align: center;
    border-bottom: none;
    border-top: none;
    border-radius: 0px;
    box-shadow: none;
    padding: 65px 30px 20px 30px;
}
.kuakua-contentBox{
    width: 100%;
    min-height: 102px;
    padding: 15px 20px;
    margin-top: 20px;
    border-radius: 0;
    box-sizing: border-box;
    position: relative;
    background-color: rgb(244, 244, 244);
    text-align: center;
    border-bottom: none;
    border-top: none;
    box-shadow: none;
}
.kuakua-comment{
    margin-bottom: 10px;
    line-height: 26px;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    word-break: break-all;
    transition: all 0s ease 0s;
    color: rgb(68, 68, 68);
    font-size: 18px;
}
.kuakua-cancelBtn{
    background-color: rgb(255, 255, 255);
    color: rgb(102, 102, 102);
    border: none;
    border-radius: 36px;
    transition: all 0.3s ease 0s;
    padding: 4px;
    width: 80px;
    display: inline-block;
    margin-top: 10px;
}
.kuakua-confirmBtn{
    background: rgb(255, 227, 0);
    width: 118px;
    height: 36px;
    display: inline-block;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    background-color: rgb(255, 227, 0);
    color: rgb(68, 68, 68);
    border: none;
    border-radius: 4px;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s ease 0s;
    box-sizing: border-box;
    margin-top: 20px;
}
.form-control:focus {
    border: 1px solid rgb(148 148 148) !important;
    box-shadow: none !important;
}
