/* language-learner-tools.css */

/* Audio Playback Styles */
.ll-word-audio {
    display: inline;
}

p:has(.ll-word-audio) {
    margin: 0;
    display: inline;
}

/* Word Post Styles */
.vocab-item h2 {
    color: #333;
}

.vocab-featured-image {
    width: 300px; /* Set the width of the image */
    height: auto; /* Maintain aspect ratio */
}

/* Word Grid Styles */

/* Styling for the word-grid shortcode (the entire grid) */
.word-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    margin-bottom: 20px;
    gap: 0px !important;
}

/* Styling for an individual item in the words-grid */
.word-item {
    border: 0px solid #ddd;
    padding: 10px;
    text-align: center;
}

/* Title of a word in the word-grid */
.word-grid h3 {
    font-size: 18px !important;
    margin-top: -25px !important;
}

/* Image displayed for a word in the word-grid */
.word-image {
    max-width: 100%;
    height: auto;
    margin-bottom: 0px;
    border-radius: 0px;
}

/* Container for the word image to enable rounded corners */
.word-image-container {
    display: inline-block;
    padding: 0px; 
    width: 200px;
    max-height: 200px;
    margin-bottom: 30px;
    border-radius: 10px;
    overflow: hidden; /* Ensure the rounded corners clip the content */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Adds shadow for depth */
}

/* Example Sentence Styles */
.word-example {
    margin-top: -15px !important;
}

/* English Translation of Example Sentence */
.word-translation {
    margin-top: -20px !important;
}