/* ==========================================================================
   Прозорци v2 (07.10.2026)

   ОПТ-ИН клас `.mv2` върху самия overlay: организации и потребители
   (organizations.js / users.js), прозорците през `modalManager.show(html, { v2: true })`
   (абонаменти, планове) и двата прозореца на заявките (#leadModal,
   #scriptFeedbackModal). Останалите `.modal-overlay` в таблото (артикули,
   седмично меню, абонамент на клиента) НЕ са пипани - затова няма глобални правила.

   ❗ Класовете `.modal`, `.modal-header`, `.modal-close` са общи и в
   sales-funnel.css (стара мобилна версия със `position: fixed` върху `.modal`) -
   затова тук има много `!important`: иначе `modalManager`-овата `.modal` излиза
   с чужди позиция и размери.
   ========================================================================== */

.mv2 {
    position: fixed !important; inset: 0 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important;
    max-width: none !important; margin: 0 !important; border-radius: 0 !important; box-sizing: border-box;
    z-index: 9000 !important; /* над долната лента (1000) и таблото, под потвържденията (10000) */
    background: rgba(43, 35, 29, .55) !important;
    backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
    align-items: center; justify-content: center;
    padding: 16px !important;
}

/* #leadModal/#scriptFeedbackModal са САМИЯТ overlay с класа .modal, а components.css му дава scale(.9) -> не покриваше целия екран */
.mv2.modal { transform: none !important; transition: none; }

/* ---- кутията */
.mv2 > .modal, .mv2 > .modal-content {
    position: relative !important; top: auto !important; left: auto !important;
    width: 100% !important; height: auto !important; max-width: 640px !important;
    max-height: calc(100vh - 32px) !important; max-height: calc(100dvh - 32px) !important;
    background: #fff !important; border-radius: 20px !important;
    box-shadow: 0 30px 80px rgba(43, 35, 29, .4) !important;
    display: flex !important; flex-direction: column; overflow: hidden !important; margin: 0 !important;
    animation: none !important; color: #2b231d;
}
.mv2 > .organization-modal, .mv2 > .user-modal { max-width: 760px !important; }

/* ---- заглавие и затваряне */
.mv2 .modal-header {
    position: relative !important; display: block !important; flex: none;
    padding: 18px 68px 14px 22px !important; margin: 0 !important; width: 100% !important; max-width: none !important; text-align: left !important; box-sizing: border-box;
    background: #fff !important; border: 0 !important; border-bottom: 1px solid #efe4d8 !important; box-shadow: none !important;
}
.mv2 .modal-header :is(h1, h2, h3, .modal-title) {
    margin: 0 !important; font-size: 1.2rem !important; font-weight: 800 !important; line-height: 1.25 !important;
    color: #2b231d !important; background: none !important; -webkit-text-fill-color: #2b231d !important; text-shadow: none !important;
}
.mv2 .modal-header p { margin: 3px 0 0 !important; color: #8a7866 !important; font-size: .86rem !important; text-shadow: none !important; }
.mv2 .modal-close {
    position: absolute !important; top: 12px !important; right: 14px !important; width: 40px !important; height: 40px !important;
    min-height: 0 !important; padding: 0 !important; border-radius: 12px !important; background: #fbf4ec !important;
    border: 1px solid #efe4d8 !important; color: #5a4a3a !important; font-size: 1.3rem !important; line-height: 1;
    display: grid !important; place-items: center; cursor: pointer; transform: none !important; box-shadow: none !important;
}
.mv2 .modal-close:hover { background: #f3e6d6 !important; color: #2b231d !important; }
.mv2 .modal-close i { font-size: 1rem; }

/* ---- тяло / форма: само то скролира, заглавието и бутоните остават */
.mv2 :is(.modal-body:not(.split-modal-body), form, .modal-form) { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 18px 22px 0 !important; margin: 0; }
.mv2 .modal-body.split-modal-body { padding: 0 !important; }
.mv2 .form-grid { display: grid !important; grid-template-columns: 1fr 1fr; gap: 14px 16px !important; margin: 0 !important; }
.mv2 .form-grid > .full-width, .mv2 .form-group.full-width { grid-column: 1 / -1; }
.mv2 .form-group { margin: 0 !important; display: block; }
.mv2 .form-group > label, .mv2 .form-group .form-label {
    display: block; margin: 0 0 6px !important; font-size: .78rem !important; font-weight: 800 !important; color: #5a4a3a !important; letter-spacing: .01em; text-transform: none;
}
.mv2 :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea) {
    width: 100%; min-height: 46px; padding: 11px 14px !important; border: 1px solid #e6d4bf !important; border-radius: 12px !important;
    background: #fff !important; color: #2b231d; font: inherit; font-size: 16px !important; box-shadow: none !important; box-sizing: border-box;
}
.mv2 textarea { min-height: 96px; resize: vertical; }
.mv2 :is(input, select, textarea):focus { outline: none !important; border-color: #d4a574 !important; box-shadow: 0 0 0 3px rgba(212, 165, 116, .28) !important; }
.mv2 :is(input, textarea)::placeholder { color: #b5a595; }
.mv2 .form-group small, .mv2 .form-help { display: block; margin-top: 5px; color: #8a7866 !important; font-size: .76rem !important; line-height: 1.4; }
.mv2 .price-conversion, .mv2 #priceInEur { margin-top: 6px; color: #a8743f; font-weight: 800; font-size: .86rem; }
.mv2 .checkbox-label, .mv2 .form-group label.checkbox-label { display: flex; align-items: center; gap: 10px; font-weight: 700 !important; font-size: .9rem !important; }

/* ---- бутони долу (залепени) */
.mv2 .modal-actions {
    position: sticky; bottom: 0; z-index: 2; display: flex !important; justify-content: flex-end; gap: 10px;
    margin: 16px -22px 0 !important; padding: 14px 22px calc(14px + env(safe-area-inset-bottom)) !important;
    background: #fff; border-top: 1px solid #efe4d8;
}
.mv2 .modal-actions .btn, .mv2 .modal-footer .btn {
    min-height: 46px; padding: 10px 20px !important; border-radius: 12px !important; font-weight: 800; font-size: .92rem;
    box-shadow: none !important; transform: none !important; display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin: 0 !important; min-width: 0 !important;
}
.mv2 .btn-primary, .mv2 .modal-actions button[type="submit"] { background: #3a2f26 !important; border: 1px solid #3a2f26 !important; color: #fff !important; }
.mv2 .btn-primary:hover { background: #2b231d !important; }
.mv2 .btn-secondary { background: #fff !important; border: 1px solid #e6d4bf !important; color: #2b231d !important; }
.mv2 .btn-secondary:hover { background: #fbf4ec !important; }
.mv2 .btn-danger { background: #fff !important; border: 1px solid #f0c4be !important; color: #b3261e !important; }
.mv2 .btn-danger:hover { background: #fdf3f2 !important; }

/* ---- телефон: лист от долу, една колона, големи бутони */
@media (max-width: 600px) {
    .mv2 { padding: 0 !important; align-items: flex-end; }
    .mv2 > .modal, .mv2 > .modal-content {
        max-width: 100% !important; border-radius: 20px 20px 0 0 !important;
        max-height: 94vh !important; max-height: 94dvh !important;
    }
    .mv2 .modal-header { padding: 16px 64px 12px 18px !important; }
    .mv2 :is(.modal-body:not(.split-modal-body), form, .modal-form) { padding: 16px 18px 0 !important; }
    .mv2 .form-grid { grid-template-columns: 1fr; }
    .mv2 .modal-actions { margin: 14px -18px 0 !important; padding: 12px 18px calc(12px + env(safe-area-inset-bottom)) !important; flex-direction: column-reverse; }
    .mv2 .modal-actions .btn { width: 100%; min-height: 50px; }
}

/* ==========================================================================
   Заявки: детайли (#leadModal)
   ========================================================================== */
#leadModal.mv2 > .modal-content { max-width: 600px !important; }
#leadModal .modal-body { padding: 18px 22px 22px !important; }
.ld-top { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.ld-ini { width: 52px; height: 52px; border-radius: 50%; background: #f3e6d6; color: #a8743f; display: grid; place-items: center; font-weight: 800; font-size: 1rem; flex: none; }
.ld-id { flex: 1; min-width: 0; }
.ld-id b { display: block; font-size: 1.15rem; line-height: 1.25; overflow-wrap: anywhere; color: #2b231d; }
.ld-id small { color: #8a7866; }
.ld-pill { display: inline-flex; align-items: center; border-radius: 999px; padding: 4px 12px; font-size: .78rem; font-weight: 800; background: #f3e6d6; color: #a8743f; }
.ld-pill.new { background: #3a2f26; color: #f1d3a6; }
.ld-pill.in_process { background: #fdf1dc; color: #9a5d0b; }
.ld-pill.prepared { background: #e7f4e8; color: #2f7a35; }
.ld-pill.rejected { background: #fbe9e7; color: #b3261e; }
.ld-acts { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; margin-bottom: 16px; }
.ld-act { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; border-radius: 12px; border: 1px solid #e6d4bf; background: #fff; color: #2b231d; font: inherit; font-weight: 800; font-size: .88rem; text-decoration: none; cursor: pointer; }
.ld-act i { color: #a8743f; }
.ld-act:hover { background: #fbf4ec; }
.ld-act--pri { background: #3a2f26; border-color: #3a2f26; color: #fff; }
.ld-act--pri i { color: #f1d3a6; }
.ld-act--pri:hover { background: #2b231d; }
.ld-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 18px; }
.ld-fact { border: 1px solid #efe4d8; border-radius: 12px; padding: 10px 12px; background: #fbf4ec; min-width: 0; }
.ld-fact span { display: block; font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #8a7866; margin-bottom: 2px; }
.ld-fact b { font-size: .92rem; overflow-wrap: anywhere; color: #2b231d; }
.ld-fact a { color: #a8743f; text-decoration: none; }
#leadModal .lead-actions, #leadModal .lead-notes { margin: 0 0 18px; padding: 0; border: 0; background: none; }
#leadModal :is(.lead-actions, .lead-notes, .lead-danger-zone) h3 { font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #8a7866; margin: 0 0 8px; }
#leadModal .status-buttons { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
#leadModal .status-btn { min-height: 42px; padding: 6px 8px; border-radius: 10px; border: 1px solid #e6d4bf; background: #fff; color: #5a4a3a; font: inherit; font-weight: 800; font-size: .8rem; cursor: pointer; }
#leadModal .status-btn.active { background: #3a2f26; border-color: #3a2f26; color: #fff; }
#leadModal .lead-notes textarea { min-height: 96px; }
#leadModal .lead-notes .btn { margin-top: 8px; min-height: 44px; border-radius: 12px; background: #3a2f26; border: 1px solid #3a2f26; color: #fff; font-weight: 800; box-shadow: none; }
#leadModal .lead-danger-zone { border: 1px solid #f0c4be; background: #fdf8f7; border-radius: 12px; padding: 10px 12px; margin: 0; }
#leadModal .lead-danger-zone summary { cursor: pointer; font-weight: 800; font-size: .84rem; color: #b3261e; }
#leadModal .lead-danger-zone .btn-danger { margin-top: 10px; min-height: 44px; border-radius: 12px; }
@media (max-width: 600px) { .ld-acts { grid-template-columns: 1fr; } .ld-facts { grid-template-columns: 1fr; } #leadModal .modal-body { padding: 16px 18px 22px !important; } }

/* ==========================================================================
   Заявки: „Скрипт + Обратна връзка“ (#scriptFeedbackModal)
   Десктоп: две колони. Под 900px: два таба (Скрипт / Обратна връзка).
   ========================================================================== */
#scriptFeedbackModal.mv2 > .modal-content { max-width: 1280px !important; height: calc(100dvh - 32px) !important; }
#scriptFeedbackModal .split-modal-body { display: flex !important; flex-direction: row !important; flex: 1 1 auto; height: auto !important; min-height: 0; overflow: hidden !important; }
#scriptFeedbackModal .script-panel { flex: 0 0 42% !important; background: #fbf4ec; border-right: 1px solid #efe4d8 !important; border-bottom: 0 !important; }
#scriptFeedbackModal .script-header { background: linear-gradient(135deg, #3a2f26, #57432f) !important; border: 0 !important; color: #fff; padding: 16px 20px; }
#scriptFeedbackModal .script-header h3 { color: #fff !important; margin: 0 0 6px; font-size: 1.05rem; }
#scriptFeedbackModal .script-header .lead-info-compact, #scriptFeedbackModal .script-header .lead-info-compact a { color: #f1d3a6 !important; }
#scriptFeedbackModal .feedback-panel { background: #fff; }
#scriptFeedbackModal .feedback-header { background: #fff !important; color: #2b231d !important; border-bottom: 1px solid #efe4d8 !important; padding: 16px 20px; }
#scriptFeedbackModal .feedback-header h3 { color: #2b231d !important; margin: 0; font-size: 1.05rem; }
#scriptFeedbackModal .script-content { padding: 16px 18px; }
#scriptFeedbackModal .script-section { background: #fff; border: 1px solid #efe4d8; border-left: 4px solid #d4a574; border-radius: 14px; box-shadow: none; padding: 14px 16px; margin-bottom: 12px; }
#scriptFeedbackModal .script-section h4 { color: #2b231d; font-size: .98rem; margin: 0 0 8px; }
.sf-tabs { display: none; }
@media (max-width: 899px) {
    #scriptFeedbackModal.mv2 > .modal-content { max-width: 100% !important; }
    #scriptFeedbackModal .split-modal-body { flex-direction: column !important; }
    #scriptFeedbackModal .script-panel, #scriptFeedbackModal .feedback-panel { flex: 1 1 auto !important; min-height: 0; border: 0 !important; display: none !important; }
    #scriptFeedbackModal.sf-show-script .script-panel { display: flex !important; }
    #scriptFeedbackModal.sf-show-feedback .feedback-panel { display: flex !important; }
    .sf-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 10px 14px; border-bottom: 1px solid #efe4d8; background: #fff; flex: none; }
    .sf-tabs button { min-height: 44px; border-radius: 12px; border: 1px solid #e6d4bf; background: #fff; color: #5a4a3a; font: inherit; font-weight: 800; cursor: pointer; }
    .sf-tabs button.on { background: #3a2f26; border-color: #3a2f26; color: #fff; }
}
