/*
Theme Name: Magdanet Child
Description: قالب فرزند مگدانت — محل تمام تغییرات سفارشی سایت. با آپدیت قالب مادر پاک نمی‌شود.
Template: magdanet
Author: Mehdi Zamani
Author URI: https://mehdizamani.com/
Version: 1.0.0
Text Domain: magdanet-child
*/

/* استایل‌های سفارشی خود را از این پایین اضافه کنید */

/*
 * لوگوی هدر — بزرگ‌تر و خواناتر از قالب مادر.
 * نکته: قالب مادر روی این کلاس‌ها «max-height» گذاشته، نه «height». چون height و
 * max-height دو خاصیت جدا هستند و هر دو همزمان اعمال می‌شوند، مقدار نهایی
 * min(height, max-height) است؛ پس override باید حتماً روی خودِ max-height باشد
 * وگرنه max-height مادر (35px / 30px) همچنان لوگو را کوچک نگه می‌دارد.
 * این فایل بعد از استایل قالب مادر لود می‌شود (اولویت enqueue: 99)، پس همین
 * override در هر آپدیت قالب مادر هم پابرجا می‌ماند.
 */
.site-logo-light,
.site-logo-dark {
    height: auto;
    max-height: 60px; /* قالب مادر: 35px */
    width: auto;
    max-width: 200px;
    transition: opacity 0.3s ease-in-out;
}

/* قالب مادر در ≤768px: max-height 30px */
@media (max-width: 768px) {
    .site-logo-light,
    .site-logo-dark {
        max-height: 48px;
        max-width: 160px;
    }
}

/* قالب مادر در ≤576px: max-height 30px، ارتفاع هدر هم به 60px کاهش می‌یابد */
@media (max-width: 576px) {
    .site-logo-light,
    .site-logo-dark {
        max-height: 40px;
        max-width: 150px;
    }
}

/*
 * فرم «تماس با ما» (Contact Form 7).
 * نشانه‌گذاری فرم با کلاس‌های md-* داخل خود فرم CF7 (پیشخوان ← تماس) تعریف شده؛
 * همه استایل‌ها زیر .md-contact محدود شده‌اند تا به فرم‌های دیگر نشت نکنند.
 */
.md-contact {
    --md-bg: #fff;
    --md-field-bg: #f6f6f8;
    --md-border: #ececf0;
    --md-text: var(--color-secondary, #1c1c1c);
    --md-muted: var(--color-tertiary, #7d7d87);
    --md-accent: var(--color-primary, #ff0066);
    --md-ring: rgba(255, 0, 102, 0.14);
    --md-error: #e0364f;
    --md-icon-chat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3Cpath d='M8 9h8M8 13h5'/%3E%3C/svg%3E");

    position: relative;
    max-width: 760px;
    margin: 10px auto 30px;
    padding: 36px 36px 32px;
    background: var(--md-bg);
    border: 1px solid var(--md-border);
    border-radius: 18px;
    box-shadow: 0 10px 40px -18px rgba(28, 28, 28, 0.18);
    overflow: hidden;
    color: var(--md-text);
}

/* نوار رنگی بالای کارت */
.md-contact::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, var(--md-accent), #ff5c9d);
}

.md-contact__head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 28px;
}

.md-contact__badge {
    flex: none;
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 14px;
    background: var(--md-ring);
    color: var(--md-accent);
}

.md-contact__badge::before {
    content: "";
    width: 26px;
    height: 26px;
    background: currentColor;
    -webkit-mask: var(--md-icon-chat) center / contain no-repeat;
    mask: var(--md-icon-chat) center / contain no-repeat;
}

.md-contact__title {
    margin: 0 0 4px;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.5;
    color: var(--md-text);
}

.md-contact__lead {
    margin: 0;
    font-size: 14px;
    line-height: 1.9;
    color: var(--md-muted);
}

.md-contact__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 18px;
}

/* min-width: 0 — بدون آن، size="40" ورودی‌های CF7 ستون‌ها را در موبایل از کادر بیرون می‌زند */
.md-field { min-width: 0; }

.md-field--full { grid-column: 1 / -1; }

.md-field > label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 700;
    color: var(--md-text);
}

.md-req { color: var(--md-accent); }

/* آیکون داخل فیلد (سمت راست در RTL) */
.md-contact .wpcf7-form-control-wrap {
    position: relative;
    display: block;
}

.md-field .wpcf7-form-control-wrap::before {
    content: "";
    position: absolute;
    top: 15px;
    right: 16px;
    width: 18px;
    height: 18px;
    background: var(--md-muted);
    -webkit-mask: var(--md-icon) center / contain no-repeat;
    mask: var(--md-icon) center / contain no-repeat;
    pointer-events: none;
    transition: background-color .2s;
    z-index: 1;
}

.md-field:focus-within .wpcf7-form-control-wrap::before { background: var(--md-accent); }

.md-field--name    { --md-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); }
.md-field--email   { --md-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E"); }
.md-field--phone   { --md-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E"); }
.md-field--message { --md-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E"); }

.md-contact input.wpcf7-form-control:not(.wpcf7-submit),
.md-contact textarea.wpcf7-form-control {
    display: block;
    width: 100%;
    height: 48px;
    padding: 0 46px 0 16px;
    font: inherit;
    font-size: 15px;
    color: var(--md-text);
    background: var(--md-field-bg);
    border: 1.5px solid transparent;
    border-radius: 12px;
    outline: none;
    box-shadow: none;
    transition: border-color .2s, background-color .2s, box-shadow .2s;
    -webkit-appearance: none;
    appearance: none;
}

.md-contact textarea.wpcf7-form-control {
    height: 170px; /* CF7 به‌طور پیش‌فرض rows="10" می‌گذارد که بیش از حد بلند است */
    min-height: 120px;
    padding-top: 13px;
    padding-bottom: 13px;
    line-height: 1.9;
    resize: vertical;
}

/* ایمیل و شماره چپ‌به‌راست تایپ می‌شوند؛ جای‌نمای خالی راست‌چین می‌ماند */
.md-contact input[type="email"],
.md-contact input[type="tel"] {
    direction: ltr;
    text-align: right;
}
.md-contact input[type="email"]:not(:placeholder-shown),
.md-contact input[type="tel"]:not(:placeholder-shown) { text-align: left; }

.md-contact .wpcf7-form-control::placeholder {
    color: #a9a9b3;
    opacity: 1;
}

.md-contact input.wpcf7-form-control:not(.wpcf7-submit):hover,
.md-contact textarea.wpcf7-form-control:hover { border-color: var(--md-border); }

.md-contact input.wpcf7-form-control:not(.wpcf7-submit):focus,
.md-contact textarea.wpcf7-form-control:focus {
    background: var(--md-bg);
    border-color: var(--md-accent);
    box-shadow: 0 0 0 4px var(--md-ring);
}

/* خطای اعتبارسنجی */
.md-contact .wpcf7-not-valid:not(.wpcf7-submit) {
    border-color: var(--md-error) !important;
    background: rgba(224, 54, 79, 0.05) !important;
}

.md-contact .wpcf7-not-valid-tip {
    display: block;
    margin-top: 6px;
    font-size: 12.5px;
    color: var(--md-error);
}

/* پایین فرم و دکمه ارسال */
.md-contact__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 26px;
}

.md-contact__note {
    margin: 0;
    font-size: 13px;
    color: var(--md-muted);
}

.md-contact .wpcf7-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 190px;
    height: 50px;
    padding: 0 28px;
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    background: var(--md-accent);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 8px 20px -8px var(--md-accent);
    cursor: pointer;
    transition: transform .15s, box-shadow .2s, filter .2s;
}

.md-contact .wpcf7-submit:hover {
    filter: brightness(1.06);
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -8px var(--md-accent);
}

.md-contact .wpcf7-submit:active { transform: translateY(0); }

.md-contact .wpcf7-submit:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px var(--md-ring);
}

.md-contact .wpcf7-submit:disabled { opacity: .6; cursor: wait; transform: none; }

.md-contact .wpcf7-spinner { margin: 0 12px; }

/* پیام نتیجه ارسال — بیرون از .md-contact است؛ CF7 کلاس وضعیت را روی خود <form> می‌گذارد */
.wpcf7 form:has(.md-contact) .wpcf7-response-output {
    max-width: 760px;
    margin: -14px auto 30px;
    padding: 14px 18px;
    font-size: 14px;
    line-height: 1.8;
    border: 0;
    border-inline-start: 4px solid currentColor;
    border-radius: 12px;
}

.wpcf7 form.sent:has(.md-contact) .wpcf7-response-output {
    color: #14a06f;
    background: rgba(20, 160, 111, 0.08);
}

.wpcf7 form.invalid:has(.md-contact) .wpcf7-response-output,
.wpcf7 form.unaccepted:has(.md-contact) .wpcf7-response-output,
.wpcf7 form.failed:has(.md-contact) .wpcf7-response-output,
.wpcf7 form.aborted:has(.md-contact) .wpcf7-response-output,
.wpcf7 form.spam:has(.md-contact) .wpcf7-response-output {
    color: #e0364f;
    background: rgba(224, 54, 79, 0.07);
}

/* حالت تاریک قالب مگدانت */
body.dark-mode .md-contact {
    --md-bg: #1e1e1e;
    --md-field-bg: #262628;
    --md-border: #333;
    --md-text: #e0e0e0;
    --md-muted: #9a9aa5;
    --md-ring: rgba(255, 51, 133, 0.2);
    box-shadow: none;
}

body.dark-mode .md-contact .wpcf7-form-control::placeholder { color: #6f6f78; }

@media (max-width: 640px) {
    .md-contact {
        padding: 26px 18px 22px;
        border-radius: 14px;
    }
    .md-contact__grid { grid-template-columns: 1fr; gap: 16px; }
    .md-contact__badge { width: 46px; height: 46px; }
    .md-contact__title { font-size: 18px; }
    .md-contact__foot { flex-direction: column-reverse; align-items: stretch; }
    .md-contact .wpcf7-submit { width: 100%; }
    .md-contact__note { text-align: center; }
}