/* ──────────────────────────────────────────────────────────────────────────────
   HojaCRM Subscribe – Frontend Styles
   assets/css/subscribe.css
   ────────────────────────────────────────────────────────────────────────────── */

.hcs-subscribe-wrap {
    max-width: 480px;
}

/* ── Input + button row ────────────────────────────────────────────────────── */
.hcs-input-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.hcs-email-input {
    flex: 1 1 220px;
    padding: 10px 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.4;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    background: #fff;
    color: #333;
}

.hcs-email-input:focus {
    outline: none;
    border-color: #0073aa;
    box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.2);
}

.hcs-email-input.is-invalid {
    border-color: #dc3232;
    box-shadow: 0 0 0 2px rgba(220, 50, 50, 0.15);
}

/* ── Subscribe button ──────────────────────────────────────────────────────── */
.hcs-btn {
    flex-shrink: 0;
    padding: 10px 22px;
    background-color: #0073aa;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease;
    white-space: nowrap;
}

.hcs-btn:hover:not(:disabled) {
    background-color: #005f8d;
}

.hcs-btn:focus-visible {
    outline: 2px solid #0073aa;
    outline-offset: 2px;
}

.hcs-btn:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}

/* ── Feedback messages ─────────────────────────────────────────────────────── */
.hcs-message {
    margin: 8px 0 0;
    font-size: 13px;
    min-height: 1.4em;
}

.hcs-message.hcs-error {
    color: #dc3232;
}

.hcs-message.hcs-success {
    color: #46b450;
}

/* ── Responsive ────────────────────────────────────────────────────────────── */
@media ( max-width: 480px ) {
    .hcs-input-row {
        flex-direction: column;
    }

    .hcs-btn {
        width: 100%;
    }
}