/* Contact Section Plugin – style.css v2.0 */

.csp-section {
    direction: rtl;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    box-sizing: border-box;
    width: 100%;
}

.csp-section *,
.csp-section *::before,
.csp-section *::after {
    box-sizing: border-box;
}

.csp-container {
    width: 100%;
    padding: 0 60px;
}

/* ---- HEADER ---- */
.csp-header {
    text-align: center;
    margin-bottom: 48px;
}

.csp-label {
    display: block;
    font-size: 14px;
    letter-spacing: 0.06em;
    color: var(--csp-text, #3a3a3a);
    margin-bottom: 10px;
}

.csp-title {
    font-size: clamp(26px, 4vw, 44px);
    font-weight: 700;
    color: var(--csp-title, #1a2e1a);
    margin: 0 0 16px;
    line-height: 1.25;
}

.csp-subtitle {
    font-size: 17px;
    color: var(--csp-text, #3a3a3a);
    margin: 0 auto;
    line-height: 1.7;
}

/* ---- FLEX COLUMNS ---- */
.csp-cols {
    display: flex;
    align-items: flex-start;
    gap: var(--csp-gap, 56px);
}

/* Info column */
.csp-info {
    flex: 0 0 var(--csp-info-width, 35%);
    display: flex;
    flex-direction: column;
    padding: var(--csp-info-pt,0px) var(--csp-info-pr,0px) var(--csp-info-pb,0px) var(--csp-info-pl,0px);
    margin: var(--csp-info-mt,0px) var(--csp-info-mr,0px) var(--csp-info-mb,0px) var(--csp-info-ml,0px);
}

/* Form column */
.csp-form-wrap {
    flex: 1 1 var(--csp-form-width, 60%);
    background: var(--csp-fmbg, #f5f0eb);
    border-radius: 14px;
    box-shadow: 0 2px 20px rgba(0,0,0,0.06);
    padding: var(--csp-form-pt,36px) var(--csp-form-pr,32px) var(--csp-form-pb,32px) var(--csp-form-pl,32px);
    margin: var(--csp-form-mt,0px) var(--csp-form-mr,0px) var(--csp-form-mb,0px) var(--csp-form-ml,0px);
}

/* ---- FORM FIELDS ---- */
.csp-field {
    margin-bottom: 22px;
}

.csp-field-row {
    display: flex;
    gap: 16px;
    margin-bottom: 22px;
}

.csp-field-row .csp-field {
    flex: 1;
    margin-bottom: 0;
}

.csp-field input,
.csp-field textarea {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1.5px solid var(--csp-bdr, #c9bfb5);
    border-radius: 0;
    padding: 10px 4px;
    font-size: 15px;
    color: var(--csp-inpc, #2a2a2a);
    outline: none;
    transition: border-color 0.2s;
    font-family: inherit;
    text-align: right;
}

.csp-field input::placeholder,
.csp-field textarea::placeholder {
    color: var(--csp-inpc, #2a2a2a);
    opacity: 0.55;
}

.csp-field input:focus,
.csp-field textarea:focus {
    border-bottom-color: var(--csp-title, #1a2e1a);
}

.csp-field textarea {
    resize: none;
    height: 100px;
    line-height: 1.6;
}

/* ---- SUBMIT BUTTON ---- */
.csp-btn {
    display: block;
    width: 100%;
    background: var(--csp-btn, #2d4a2d);
    color: var(--csp-btntc, #ffffff);
    border: none;
    border-radius: 8px;
    padding: 15px 20px;
    font-size: 17px;
    font-weight: 600;
    cursor: pointer;
    letter-spacing: 0.03em;
    margin-top: 8px;
    transition: opacity 0.2s, transform 0.1s;
    font-family: inherit;
}

.csp-btn:hover   { opacity: 0.88; }
.csp-btn:active  { transform: scale(0.99); }
.csp-btn:disabled { opacity: 0.6; cursor: not-allowed; }

/* ---- MESSAGES ---- */
.csp-msg {
    padding: 12px 14px;
    border-radius: 7px;
    font-size: 14px;
    margin-bottom: 14px;
    text-align: center;
}
.csp-msg.csp-ok  { background:#d4edda; color:#155724; border:1px solid #c3e6cb; }
.csp-msg.csp-err { background:#f8d7da; color:#721c24; border:1px solid #f5c6cb; }

/* ---- INFO ROWS ---- */
/* Default: icon RIGHT, text LEFT  (direction controlled by --csp-info-dir) */
.csp-info-row {
    display: flex;
    align-items: center;
    flex-direction: var(--csp-info-dir, row);   /* row = icon right → text left (RTL) */
    gap: 14px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(0,0,0,0.07);
    text-decoration: none;
    color: var(--csp-text, #3a3a3a);
    transition: opacity 0.18s;
}
.csp-info-row:hover { opacity: 0.72; }

.csp-info-text {
    flex: 1;
    font-size: 16px;
    font-weight: 500;
    color: var(--csp-text, #3a3a3a);
}

.csp-info-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1.5px solid rgba(0,0,0,0.15);
    flex-shrink: 0;
    color: var(--csp-title, #1a2e1a);
}

.csp-wa-icon { border-color: #25d366; color: #25d366; }

.csp-right-note {
    margin-top: 24px;
    font-size: 14px;
    color: var(--csp-text, #3a3a3a);
    opacity: 0.8;
    line-height: 1.75;
}

/* ---- RESPONSIVE ---- */
@media (max-width: 820px) {
    .csp-container { padding: 0 24px; }

    .csp-cols {
        flex-direction: column !important;
        gap: 32px;
    }

    /* Force 100% width on mobile - overrides inline CSS variable */
    .csp-form-wrap {
        order: var(--csp-mobile-form-order, 1);
        flex: 1 1 100% !important;
        width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .csp-info {
        order: var(--csp-mobile-info-order, 2);
        flex: 1 1 100% !important;
        width: 100% !important;
        min-width: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .csp-field-row { flex-direction: column; gap: 0; }
    .csp-field-row .csp-field { margin-bottom: 22px; }
}

@media (max-width: 480px) {
    .csp-container { padding: 0 16px; }
    .csp-title    { font-size: 24px; }
    .csp-subtitle { font-size: 15px; }
    .csp-form-wrap { padding: 22px 16px; }
}