.voicecorps-audio-player {
max-width: 600px;
margin: 2rem auto;
}
.vcap-audio-info {
text-align: center;
margin-bottom: 1.5rem;
}
.vcap-title {
font-size: 1.5rem;
margin: 0;
}
#vcap-audio-element {
display: none;
} .vcap-controls {
background: #f5f5f5;
border: 2px solid #ddd;
border-radius: 8px;
padding: 1.5rem;
margin-bottom: 1rem;
position: relative;
} .vcap-logo-container {
display: flex;
align-items: center;
justify-content: flex-end;
width: 120px;
flex-shrink: 0;
}
.vcap-logo {
width: 100%;
height: auto;
display: block;
} .vcap-progress-container {
display: flex;
align-items: center;
gap: 0.5rem;
margin-bottom: 0.75rem;
padding: 0.5rem 0;
width: 100%;
} .vcap-volume-container {
display: flex;
align-items: center;
gap: 0.75rem;
width: 100%;
margin-bottom: 1rem;
padding: 0.5rem 0;
} .vcap-speed-logo-row {
display: flex;
align-items: center;
gap: 1rem;
width: 100%;
margin-bottom: 0;
} .vcap-speed-container {
display: flex;
align-items: center;
gap: 0.75rem;
flex: 1;
padding: 0.5rem 0;
}
.vcap-skip-controls {
display: flex;
gap: 1rem;
width: 100%;
margin-bottom: 1rem;
}
.vcap-play-pause {
width: 100%;
background: #0073aa;
color: white;
border: none;
border-radius: 6px;
padding: 0.75rem;
font-size: 1.5rem;
cursor: pointer;
transition: background 0.2s;
}
.vcap-time {
font-size: 0.875rem;
min-width: 45px;
text-align: center;
}
.vcap-progress-bar {
flex: 1;
height: 12px;
-webkit-appearance: none;
appearance: none;
background: #ddd;
border-radius: 6px;
outline: none;
cursor: pointer;
}
.vcap-progress-bar:focus {
outline: 3px solid #ffb900;
outline-offset: 2px;
box-shadow: 0 0 0 4px rgba(255, 185, 0, 0.2);
}
.vcap-progress-bar::-webkit-slider-thumb {
-webkit-appearance: none;
width: 20px;
height: 20px;
background: #0073aa;
border-radius: 50%;
cursor: pointer;
}
.vcap-progress-bar::-moz-range-thumb {
width: 20px;
height: 20px;
background: #0073aa;
border-radius: 50%;
border: none;
cursor: pointer;
} .vcap-volume-container {
display: flex;
align-items: center;
gap: 0.75rem;
width: 100%;
margin-bottom: 1rem;
padding: 0.5rem 0;
}
.vcap-volume-toggle {
background: transparent;
border: none;
font-size: 1.5rem;
cursor: pointer;
padding: 0.25rem;
}
.vcap-volume-slider {
flex: 1;
height: 10px;
-webkit-appearance: none;
appearance: none;
background: #ddd;
border-radius: 5px;
outline: none;
cursor: pointer;
}
.vcap-volume-slider:focus {
outline: 3px solid #ffb900;
outline-offset: 2px;
box-shadow: 0 0 0 4px rgba(255, 185, 0, 0.2);
}
.vcap-volume-slider::-webkit-slider-thumb {
-webkit-appearance: none;
width: 18px;
height: 18px;
background: #0073aa;
border-radius: 50%;
cursor: pointer;
}
.vcap-volume-slider::-moz-range-thumb {
width: 18px;
height: 18px;
background: #0073aa;
border-radius: 50%;
border: none;
cursor: pointer;
} .vcap-speed-container {
display: flex;
align-items: center;
gap: 0.75rem;
width: 100%;
margin-bottom: 1rem;
padding: 0.5rem 0;
}
.vcap-speed-label {
font-size: 1rem;
font-weight: 500;
}
.vcap-speed-select {
flex: 1;
padding: 0.5rem;
font-size: 1rem;
border: 1px solid #ddd;
border-radius: 4px;
background: white;
cursor: pointer;
}
.vcap-speed-select:focus {
outline: 3px solid #ffb900;
outline-offset: 2px;
box-shadow: 0 0 0 4px rgba(255, 185, 0, 0.2);
border-color: #0073aa;
} .vcap-skip-controls {    clear: both;    display: flex;
gap: 1rem;
width: 100%;
margin-bottom: 1rem;
}
.vcap-skip-btn {
flex: 1;
background: white;
color: #0073aa;
border: 2px solid #0073aa;
border-radius: 6px;
padding: 0.75rem 1rem;
font-size: 0.95rem;
cursor: pointer;
transition: all 0.2s;
}
.vcap-skip-btn:hover {
background: #0073aa;
color: white;
}
.vcap-skip-btn:focus {
outline: 1px solid #ffb900;
outline-offset: 2px;
box-shadow: 0 0 0 4px rgba(255, 185, 0, 0.2);
} .vcap-play-pause {    clear: both;    width: 100%;
background: #0073aa;
color: white;
border: none;
border-radius: 6px;
padding: 0.75rem;
font-size: 1.5rem;
cursor: pointer;
transition: background 0.2s;
}
.vcap-play-pause:hover {
background: #005a87;
}
.vcap-play-pause:focus {
outline: 3px solid #ffb900;
outline-offset: 2px;
box-shadow: 0 0 0 4px rgba(255, 185, 0, 0.2);
}
.vcap-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.vcap-icon {
display: inline-block;
} .vcap-navigation {
display: flex;
gap: 1rem;
width: 100%;
margin-bottom: 1rem;
}
.vcap-nav-btn {
flex: 1;
background: #0073aa;
color: white;
border: none;
border-radius: 6px;
padding: 0.75rem 1rem;
font-size: 1rem;
cursor: pointer;
transition: all 0.2s;
}
.vcap-nav-btn:hover {
background: #005a87;
}
.vcap-nav-btn:focus {
outline: 3px solid #ffb900;
outline-offset: 2px;
box-shadow: 0 0 0 4px rgba(255, 185, 0, 0.2);
}
.vcap-nav-btn:disabled {
opacity: 0.5;
cursor: not-allowed;
} .vcap-back-link {
text-align: center;
padding-top: 1rem;
border-top: 1px solid #ddd;
}
.vcap-back-btn {
display: inline-block;
padding: 0.5rem 1rem;
color: #0073aa;
text-decoration: none;
border-radius: 4px;
}
.vcap-back-btn:hover {
text-decoration: underline;
}
.vcap-back-btn:focus {
outline: 3px solid #ffb900;
outline-offset: 2px;
box-shadow: 0 0 0 4px rgba(255, 185, 0, 0.2);
}
.vcap-no-file {
text-align: center;
padding: 2rem;
color: #666;
} @media (max-width: 768px) {
.voicecorps-audio-player {
max-width: 100%;
margin: 1rem;
}
.vcap-controls {
padding: 1rem;
}
.vcap-title {
font-size: 1.25rem;
} .vcap-play-pause {
padding: 1rem;
font-size: 1.75rem;
min-height: 60px;
}
.vcap-skip-btn,
.vcap-nav-btn {
padding: 1rem;
font-size: 1rem;
min-height: 56px;
} .vcap-progress-bar {
height: 16px;
}
.vcap-progress-bar::-webkit-slider-thumb {
width: 28px;
height: 28px;
}
.vcap-progress-bar::-moz-range-thumb {
width: 28px;
height: 28px;
}
.vcap-volume-slider {
height: 14px;
}
.vcap-volume-slider::-webkit-slider-thumb {
width: 24px;
height: 24px;
}
.vcap-volume-slider::-moz-range-thumb {
width: 24px;
height: 24px;
} .vcap-speed-select {
padding: 0.75rem;
font-size: 1rem;
min-height: 48px;
} .vcap-speed-logo-row {
flex-direction: column;
align-items: stretch;
}
.vcap-speed-container {
width: 100%;
margin-bottom: 1rem;
}
.vcap-logo-container {
width: 100%;
justify-content: center;
margin-bottom: 0;
}
.vcap-logo {
max-width: 180px;
} .vcap-back-btn {
padding: 0.75rem 1.5rem;
font-size: 1rem;
min-height: 48px;
}
}
@media (max-width: 480px) {
.voicecorps-audio-player {
margin: 0.5rem;
}
.vcap-controls {
padding: 0.75rem;
border-radius: 6px;
}
.vcap-title {
font-size: 1.1rem;
word-break: break-word;
} .vcap-play-pause {
font-size: 2rem;
min-height: 64px;
} .vcap-skip-controls {
gap: 0.5rem;
}
.vcap-navigation {
gap: 0.5rem;
} .vcap-time {
font-size: 0.8rem;
min-width: 40px;
} .vcap-volume-label,
.vcap-speed-label {
font-size: 0.95rem;
}
} @media (hover: none) and (pointer: coarse) {
.vcap-btn,
.vcap-skip-btn,
.vcap-nav-btn,
.vcap-back-btn {
min-height: 48px;
padding: 0.875rem 1rem;
}
.vcap-progress-bar,
.vcap-volume-slider {
cursor: pointer;
-webkit-tap-highlight-color: rgba(0, 115, 170, 0.2);
} .vcap-play-pause:hover,
.vcap-skip-btn:hover,
.vcap-nav-btn:hover {
background: initial;
}
.vcap-play-pause:active {
background: #005a87;
}
.vcap-skip-btn:active {
background: #0073aa;
color: white;
}
.vcap-nav-btn:active {
background: #005a87;
}
}.wp-block-kadence-column.kb-section-dir-horizontal>.kt-inside-inner-col>.wp-block-kadence-column{flex:1}.wp-block-kadence-column.kb-section-dir-horizontal .wp-block-kadence-advancedgallery{flex:1}.wp-block-kadence-column{display:flex;flex-direction:column;z-index:1;min-width:0;min-height:0}.kt-inside-inner-col{flex-direction:column;border:0 solid rgba(0,0,0,0);position:relative;transition:all .3s ease}@media(max-width: 767px){.kvs-sm-false{display:none !important}}@media(min-width: 768px)and (max-width: 1024px){.kvs-md-false{display:none !important}}@media screen and (min-width: 1025px){.kvs-lg-false{display:none !important}}body.admin-bar{--kb-admin-bar-visible: 34px}@media screen and (max-width: 782px){body.admin-bar{--kb-admin-bar-visible: 46px}}.kb-section-is-sticky>.kt-inside-inner-col{position:sticky;top:calc(var(--kb-admin-bar-visible, 0px) + var(--kb-section-setting-offset, 0px))}.kt-inside-inner-col>.kb-section-is-sticky{position:sticky;top:calc(var(--kb-admin-bar-visible, 0px) + var(--kb-section-setting-offset, 0px))}.kt-inside-inner-col>.wp-block-cover{height:auto}.kb-section-has-link{position:relative}.kb-section-link-overlay{position:absolute;top:0;left:0;right:0;bottom:0;z-index:10}.kb-section-has-overlay{position:relative}.kb-section-has-overlay>.kt-inside-inner-col{z-index:1}.kb-section-has-overlay>.kt-inside-inner-col:before{content:"";opacity:.3;position:absolute;left:0;right:0;top:0;bottom:0;z-index:-1;transition:all .3s ease-in-out}