.keyboard-sound-section{padding-top:var(--padding-top, 36px);padding-bottom:var(--padding-bottom, 36px)}.keyboard-sound__header{text-align:center;margin-bottom:3rem}.keyboard-sound__title{margin-bottom:1rem}.keyboard-sound__description{max-width:600px;margin:0 auto;color:rgba(var(--color-foreground),.7)}.keyboard-sound__controls{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center;margin-bottom:2rem}.keyboard-sound__control-group{display:flex;flex-direction:column;gap:.75rem}.keyboard-sound__label{font-size:1.4rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:rgba(var(--color-foreground),.8)}.keyboard-sound__select-wrapper{position:relative;display:inline-block;width:100%;max-width:320px}.keyboard-sound__select-wrapper:after{content:"";position:absolute;right:16px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid rgba(var(--color-foreground),.6);pointer-events:none;transition:transform .2s ease}.keyboard-sound__select-wrapper:focus-within:after{transform:translateY(-50%) rotate(180deg)}.keyboard-sound__select{width:100%;padding:14px 48px 14px 18px;font-size:1.4rem;font-weight:500;color:rgb(var(--color-foreground));background:linear-gradient(145deg,rgba(var(--color-foreground),.03),rgba(var(--color-foreground),.06));border:2px solid rgba(var(--color-foreground),.12);border-radius:12px;cursor:pointer;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:all .25s ease;box-shadow:0 2px 8px #0000000a}.keyboard-sound__select:hover{background:linear-gradient(145deg,rgba(var(--color-foreground),.05),rgba(var(--color-foreground),.08));border-color:rgba(var(--color-foreground),.25);box-shadow:0 4px 12px #00000014}.keyboard-sound__select:focus{border-color:rgb(var(--color-button));box-shadow:0 0 0 3px rgba(var(--color-button),.15),0 4px 12px #0000001a}.keyboard-sound__select option{padding:12px 16px;background:rgb(var(--color-background));color:rgb(var(--color-foreground));font-size:1.4rem}.keyboard-sound__main-content{display:grid;grid-template-columns:1fr 320px;gap:2rem;align-items:start}@media screen and (max-width: 1199px){.keyboard-sound__main-content{grid-template-columns:1fr 280px;gap:1.5rem}}@media screen and (max-width: 999px){.keyboard-sound__main-content{grid-template-columns:1fr}}.keyboard-sound__player-area{display:flex;flex-direction:column;gap:1rem;width:100%}.keyboard-sound__player{background:linear-gradient(145deg,rgba(var(--color-foreground),.02),rgba(var(--color-foreground),.05));border:2px solid rgba(var(--color-foreground),.1);border-radius:24px;padding:3rem;display:flex;flex-direction:column;align-items:center;gap:2rem;min-height:350px;position:relative}.keyboard-sound__visualization{width:100%;height:100px;display:flex;align-items:center;justify-content:center}.keyboard-sound__wave{display:flex;gap:6px;align-items:center;height:80px}.keyboard-sound__wave span{width:8px;height:20px;background:linear-gradient(180deg,rgb(var(--color-button)),rgba(var(--color-button),.6));border-radius:4px;transition:height .1s ease}.keyboard-sound--playing .keyboard-sound__wave span{animation:soundWave .5s ease-in-out infinite}.keyboard-sound__wave span:nth-child(1){animation-delay:0s}.keyboard-sound__wave span:nth-child(2){animation-delay:.1s}.keyboard-sound__wave span:nth-child(3){animation-delay:.2s}.keyboard-sound__wave span:nth-child(4){animation-delay:.3s}.keyboard-sound__wave span:nth-child(5){animation-delay:.4s}.keyboard-sound__wave span:nth-child(6){animation-delay:.35s}.keyboard-sound__wave span:nth-child(7){animation-delay:.25s}.keyboard-sound__wave span:nth-child(8){animation-delay:.15s}.keyboard-sound__wave span:nth-child(9){animation-delay:.05s}.keyboard-sound__wave span:nth-child(10){animation-delay:.45s}@keyframes soundWave{0%,to{height:20px;opacity:.6}50%{height:60px;opacity:1}}.keyboard-sound__play-btn{width:100px;height:100px;border-radius:50%;background:linear-gradient(145deg,rgb(var(--color-button)),rgba(var(--color-button),.8));border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:rgb(var(--color-button-text));transition:all .3s ease;box-shadow:0 8px 24px rgba(var(--color-button),.35)}.keyboard-sound__play-btn:hover{transform:scale(1.05);box-shadow:0 12px 32px rgba(var(--color-button),.45)}.keyboard-sound__play-btn:active{transform:scale(.98)}.keyboard-sound__play-icon,.keyboard-sound__pause-icon{transition:opacity .2s ease}.keyboard-sound__pause-icon,.keyboard-sound--playing .keyboard-sound__play-icon{display:none}.keyboard-sound--playing .keyboard-sound__pause-icon{display:block}.keyboard-sound__info{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-align:center}.keyboard-sound__switch-name{font-size:1.6rem;font-weight:700;color:rgb(var(--color-foreground))}.keyboard-sound__sound-status{font-size:1.4rem;color:rgba(var(--color-foreground),.6)}.keyboard-sound__volume-control{display:flex;align-items:center;gap:.75rem;margin-top:1rem}.keyboard-sound__mute-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:transparent;border:none;cursor:pointer;color:rgb(var(--color-foreground));opacity:.7;transition:opacity .2s}.keyboard-sound__mute-btn:hover{opacity:1}.keyboard-sound__volume-icon--off,.keyboard-sound--muted .keyboard-sound__volume-icon--on{display:none}.keyboard-sound--muted .keyboard-sound__volume-icon--off{display:block}.keyboard-sound__volume-slider{width:120px;height:6px;background:rgba(var(--color-foreground),.15);border-radius:3px;outline:none;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.keyboard-sound__volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:rgb(var(--color-button));border-radius:50%;cursor:pointer;transition:transform .15s}.keyboard-sound__volume-slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.keyboard-sound__volume-slider::-moz-range-thumb{width:18px;height:18px;background:rgb(var(--color-button));border:none;border-radius:50%;cursor:pointer}.keyboard-sound__volume-value{min-width:40px;font-size:1.4rem;color:rgba(var(--color-foreground),.7)}.keyboard-sound__no-sound{display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center;color:rgba(var(--color-foreground),.5);padding:2rem}.keyboard-sound__no-sound p{margin:0;font-size:1.4rem}.keyboard-sound--no-sound .keyboard-sound__visualization,.keyboard-sound--no-sound .keyboard-sound__play-btn,.keyboard-sound--no-sound .keyboard-sound__info,.keyboard-sound--no-sound .keyboard-sound__volume-control{display:none}.keyboard-sound--no-sound .keyboard-sound__no-sound{display:flex}.keyboard-sound__product-panel{position:sticky;top:120px;background:rgba(var(--color-foreground),.02);border:1px solid rgba(var(--color-foreground),.1);border-radius:12px;padding:1.5rem;display:flex;flex-direction:column;gap:1.25rem}@media screen and (max-width: 999px){.keyboard-sound__product-panel{display:none}}.keyboard-sound__panel-image{width:100%;aspect-ratio:1;background:rgba(var(--color-foreground),.03);border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center}.keyboard-sound__panel-image img{width:100%;height:100%;object-fit:contain}.keyboard-sound__panel-info{display:flex;flex-direction:column;gap:.5rem}.keyboard-sound__panel-title{font-size:1.125rem;font-weight:600;line-height:1.3;margin:0}.keyboard-sound__panel-variant{font-size:1.4rem;color:rgba(var(--color-foreground),.7)}.keyboard-sound__panel-price{display:flex;align-items:center;gap:.75rem;margin-top:.25rem}.keyboard-sound__panel-current-price{font-size:1.25rem;font-weight:700;color:rgb(var(--color-foreground))}.keyboard-sound__panel-compare-price{font-size:1.4rem;color:rgba(var(--color-foreground),.5);text-decoration:line-through}.keyboard-sound__panel-stock{font-size:1.4rem;min-height:1.25rem}.keyboard-sound__panel-stock--in{color:#22c55e;font-weight:500}.keyboard-sound__panel-stock--out{color:#dc3545;font-weight:500}.keyboard-sound__panel-actions{display:flex;flex-direction:column;gap:.75rem;margin-top:.5rem}.keyboard-sound__add-to-cart{width:100%;min-height:48px;position:relative}.keyboard-sound__add-to-cart:disabled{opacity:.6;cursor:not-allowed}.keyboard-sound__view-product{text-align:center;font-size:1.4rem;color:rgba(var(--color-foreground),.7);text-decoration:none;transition:color .2s}.keyboard-sound__view-product:hover{color:rgb(var(--color-foreground))}.keyboard-sound__btn-loading{display:none;position:absolute;top:0;right:0;bottom:0;left:0;align-items:center;justify-content:center}.keyboard-sound__btn--loading .keyboard-sound__btn-loading{display:flex}.keyboard-sound__btn--loading [data-btn-text],.keyboard-sound__btn--loading [data-mobile-btn-text]{visibility:hidden}.keyboard-sound__btn--success{background-color:#28a745!important;border-color:#28a745!important}.keyboard-sound__btn--error{background-color:#dc3545!important;border-color:#dc3545!important}.keyboard-sound__btn-loading .spinner{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.keyboard-sound__mobile-bar{display:none;position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid rgba(0,0,0,.1);padding:.75rem 1rem;box-shadow:0 -4px 12px #00000026;z-index:100}@media screen and (max-width: 999px){.keyboard-sound__mobile-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem}.keyboard-sound-section{padding-bottom:calc(var(--padding-bottom, 36px) + 80px)}}.keyboard-sound__mobile-bar-info{display:flex;align-items:center;gap:.75rem;flex:1;min-width:0}.keyboard-sound__mobile-bar-image{width:48px;height:48px;object-fit:contain;border-radius:6px;background:#f5f5f5;flex-shrink:0}.keyboard-sound__mobile-bar-details{display:flex;flex-direction:column;gap:.125rem;min-width:0}.keyboard-sound__mobile-bar-title{font-size:1.4rem;font-weight:600;color:#1a1a1a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.keyboard-sound__mobile-bar-price{font-size:1.4rem;font-weight:700;color:#1a1a1a}.keyboard-sound__mobile-bar-btn{flex-shrink:0;min-width:120px;padding:.75rem 1.25rem;font-size:1.4rem;position:relative}.keyboard-sound__mobile-bar-btn:disabled{opacity:.6;cursor:not-allowed}@media screen and (max-width: 768px){.keyboard-sound__header{margin-bottom:2rem;text-align:left}.keyboard-sound__controls{flex-direction:column;align-items:stretch;gap:1.25rem}.keyboard-sound__control-group,.keyboard-sound__select-wrapper{max-width:100%}.keyboard-sound__player{padding:2rem;min-height:300px;border-radius:16px}.keyboard-sound__play-btn{width:80px;height:80px}.keyboard-sound__play-btn svg{width:36px;height:36px}.keyboard-sound__wave span{width:6px}}@media screen and (max-width: 480px){.keyboard-sound__wave{gap:4px}.keyboard-sound__wave span{width:4px}.keyboard-sound__volume-control{flex-wrap:wrap;justify-content:center}.keyboard-sound__volume-slider{width:100px}}
/*# sourceMappingURL=/cdn/shop/t/10/assets/sections.fantech-keyboard-sound.css.map */