/* Parent section styles */
.mementor-tts-section {
    position: relative;
}

/* Sticky preview styles */
.mementor-tts-sticky-preview {
    position: relative;
    width: 100%;
    background: #fff;
    z-index: 99999;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    will-change: position, top;
}

.mementor-tts-sticky-preview.is-sticky {
    position: fixed;
    top: 32px; /* Admin bar height */
    left: 160px; /* WordPress admin menu width */
    right: 20px;
    width: auto;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
}

.mementor-tts-player-page input[type=text] {
    width: 100%;
}

/* Responsive styles */
@media screen and (max-width: 960px) {
    .mementor-tts-sticky-preview.is-sticky {
        left: 36px; /* Collapsed admin menu */
    }
}

@media screen and (max-width: 782px) {
    .mementor-tts-sticky-preview.is-sticky {
        top: 46px; /* Mobile admin bar height */
        left: 0;
    }
}

@media screen and (max-width: 600px) {
    .mementor-tts-sticky-preview.is-sticky {
        top: 0;
    }
}

.mementor-tts-preview-player {
    width: 100%;
    margin: 0 auto;
    transition: max-width 0.3s ease;
}

.mementor-tts-preview-player-padding {
    padding: 20px;
    display: flex;
    justify-content: flex-start; /* Default to left alignment */
}

/* Alignment classes */
.mementor-tts-preview-player-padding[data-alignment="center"] {
    justify-content: center;
}

.mementor-tts-preview-player-padding[data-alignment="right"] {
    justify-content: flex-end;
}

/* Responsive adjustments */
@media screen and (max-width: 782px) {
    .mementor-tts-preview-player-padding {
        padding: 15px;
    }
} 