/* Simple Media Emailer Frontend Styles */

.simple-media-emailer-form-container {
    background-color: #ffffff; /* Brighter background */
    padding: 30px 35px;
    border-radius: 12px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.06); /* Softer, layered shadow */
    max-width: 600px;
    margin: 30px auto;
    overflow: hidden;
    border: 1px solid #e0e0e0; /* Subtle border */
}

.simple-media-emailer-form {
    display: flex;
    flex-direction: column;
    gap: 25px; /* Increased gap for better spacing */
}

.simple-media-emailer-form .sme-form-group {
    display: flex;
    flex-direction: column;
    gap: 8px; /* Space between label and input within a group */
}

.simple-media-emailer-form label {
    font-weight: 600;
    color: #333;
    font-size: 1.05em; /* Slightly larger label */
}

.simple-media-emailer-form label .sme-required {
    color: #d9534f; /* Red asterisk */
    margin-left: 3px;
    font-weight: normal;
}

.simple-media-emailer-form input[type="email"],
.simple-media-emailer-form input[type="file"] {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ced4da; /* Standard border color */
    border-radius: 8px; /* More rounded corners */
    box-sizing: border-box;
    font-size: 16px;
    color: #495057;
    background-color: #fff;
    transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.simple-media-emailer-form input[type="email"]:focus,
.simple-media-emailer-form input[type="file"]:focus {
    border-color: #007bff;
    box-shadow: 0 0 0 0.25rem rgba(0, 123, 255, 0.2); /* Bootstrap-like focus */
    outline: none;
}

.simple-media-emailer-form input[type="file"] {
    padding: 10px; /* File input can have slightly different padding */
}

/* Button Styling */
.sme-button {
    display: inline-block;
    padding: 12px 28px; /* More horizontal padding */
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    border: 1px solid transparent;
    border-radius: 8px; /* Consistent rounded corners */
    transition: all 0.2s ease-in-out; /* Smooth transition for all properties */
}

/* Primary button style (Send Email) */
.sme-button-primary {
    color: #fff;
    background-color: #007bff; /* Primary blue */
    border-color: #007bff;
    box-shadow: 0 4px 10px rgba(0, 123, 255, 0.25);
}

.sme-button-primary:hover {
    color: #fff;
    background-color: #0069d9; /* Darker blue on hover */
    border-color: #0062cc;
    box-shadow: 0 6px 12px rgba(0, 105, 217, 0.3);
    transform: translateY(-2px); /* Subtle lift effect */
}

.sme-button-primary:active,
.sme-button-primary:focus {
    color: #fff;
    background-color: #0056b3; /* Even darker for active/focus */
    border-color: #004085;
    box-shadow: 0 0 0 0.25rem rgba(38, 143, 255, 0.5);
    outline: none;
}
.sme-button-primary:disabled,
.sme-button-primary.sme-button-loading { /* Added loading class for JS */
    background-color: #6c757d;
    border-color: #6c757d;
    box-shadow: none;
    color: #e9ecef;
    cursor: not-allowed;
    transform: translateY(0);
}

/* Secondary button style (Select from Media Library) */
.sme-button-secondary {
    color: #007bff;
    background-color: #ffffff;
    border: 1px solid #007bff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.sme-button-secondary:hover {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
    box-shadow: 0 4px 8px rgba(0, 123, 255, 0.2);
    transform: translateY(-1px);
}

/* File selection info text */
#sme-selected-media-name {
    margin-left: 15px; /* More space */
    font-style: italic;
    color: #555;
    display: inline-block;
    margin-top: 5px; /* Align better if button wraps */
    font-size: 0.95em;
}

.sme-or-upload-text {
    display: block;
    margin-top: 15px;
    margin-bottom: 8px;
    font-size: 0.9em;
    color: #6c757d; /* Softer color for helper text */
}

/* Feedback Messages */
.sme-feedback-message {
    padding: 18px 25px;
    margin-bottom: 25px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 1.05em; /* Slightly larger text */
    text-align: left; /* Better for longer messages */
    line-height: 1.6;
    display: flex; /* For potential icon alignment */
    align-items: center;
}

.sme-feedback-message.sme-success {
    color: #0f5132; /* Darker green for WCAG */
    background-color: #d1e7dd;
    border-color: #badbcc;
    box-shadow: 0 3px 7px rgba(15, 81, 50, 0.1);
}

.sme-feedback-message.sme-error {
    color: #842029; /* Darker red for WCAG */
    background-color: #f8d7da;
    border-color: #f5c2c7;
    box-shadow: 0 3px 7px rgba(132, 32, 41, 0.1);
}

/* Optional: Add icons to feedback messages (requires FontAwesome or SVGs) */
/* .sme-feedback-message::before {
    font-family: "Font Awesome 5 Free"; // Example
    font-weight: 900;
    margin-right: 10px;
}
.sme-feedback-message.sme-success::before { content: "\f058"; } // fa-check-circle
.sme-feedback-message.sme-error::before { content: "\f06a"; } // fa-exclamation-circle
*/