/* ===================================
   New Editor Sidebar - Grammarly Style
   עיצוב מינימליסטי ומקצועי
   =================================== */

/* ===================================
   Custom Fonts - גופנים מותאמים אישית
   =================================== */

@font-face{font-family:'Galil';font-style:normal;font-weight:300 700;font-display:swap;src:url('/assets/fonts/rubik/rubik-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Galil';font-style:normal;font-weight:300 700;font-display:swap;src:url('/assets/fonts/rubik/rubik-hebrew.woff2') format('woff2');unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}

@font-face {
    font-family: 'Neta';
    src: url('../../fonts/Reisinger-Neta-web/Reisinger-Neta-Regular.woff2') format('woff2'),
         url('../../fonts/Reisinger-Neta-web/Reisinger-Neta-Regular.woff') format('woff'),
         url('../../fonts/Reisinger-Neta-web/Reisinger-Neta-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neta';
    src: url('../../fonts/Reisinger-Neta-web/Reisinger-Neta-Medium.woff2') format('woff2'),
         url('../../fonts/Reisinger-Neta-web/Reisinger-Neta-Medium.woff') format('woff'),
         url('../../fonts/Reisinger-Neta-web/Reisinger-Neta-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

/* CSS Variables - Color Palette */
:root {
    /* Background Colors */
    --bg-primary: #ffffff;
    --bg-secondary: #f8fafc;
    --bg-panel: #fafbfc;
    --bg-hover: #f1f5f9;

    /* Border Colors */
    --border-light: #e2e8f0;
    --border-medium: #cbd5e1;
    --border-strong: #94a3b8;

    /* Text Colors */
    --text-primary: #1e293b;
    --text-secondary: #475569;
    --text-muted: #64748b;

    /* Accent Colors */
    --accent-primary: #1e3a5f;
    --accent-success: #10b981;
    --accent-warning: #f59e0b;
}

/* ===================================
   Icon Bar - Right Side
   באותו גובה כמו הפאנל
   =================================== */

.editor-icon-bar {
    position: fixed;
    top: 70px; /* אותו מיקום כמו הפאנל */
    right: 18px; /* מרווח מהקצה */
    width: 54px;
    height: calc(100vh - 112px); /* אותו גובה כמו הפאנל */
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; /* Center icons vertically */
    gap: 4px;
    z-index: 999;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: top 0.3s ease, height 0.3s ease;
}

/* כבר לא נחוץ - מיקום קבוע */
body:not(.formatting-toolbar-open) .editor-icon-bar {
    top: 70px;
    height: calc(100vh - 112px);
}

/* Icon Bar Button */
.icon-bar-btn {
    width: 44px;
    height: 44px;
    border: none;
    background: transparent;
    color: var(--text-secondary);
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: all 0.2s ease;
    position: relative;
}

.icon-bar-btn:hover:not(.disabled) {
    background: var(--bg-hover);
    color: var(--accent-primary);
    transform: scale(1.05);
}

.icon-bar-btn.active {
    background: var(--accent-primary);
    color: white;
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.3);
}

/* Disabled State */
.icon-bar-btn.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

/* Tooltip on Hover */
.icon-bar-btn::after {
    content: attr(data-tooltip);
    position: absolute;
    right: 100%;
    margin-right: 12px;
    background: var(--text-primary);
    color: white;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-family: 'Galil', sans-serif;
    letter-spacing: normal;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    pointer-events: none;
    z-index: 10000;
}

.icon-bar-btn:hover::after {
    opacity: 1;
    visibility: visible;
    margin-right: 16px;
}

/* Icon Bar Logo (עוזר מילה) */
.icon-bar-logo {
    width: 24px;
    height: 24px;
    object-fit: contain;
    transition: transform 0.2s ease;
}

.icon-bar-btn:hover .icon-bar-logo {
    transform: scale(1.1);
}

.icon-bar-btn.active .icon-bar-logo {
    filter: brightness(0) invert(1); /* הופך ללבן כשפעיל */
}

/* ===================================
   Sidebar Panel Indicator
   אינדיקטור פאנל פעיל (OCR/תמלול) בסרגל הניווט
   =================================== */

.sidebar-panel-indicator-container {
    display: none;
    justify-content: center;
    align-items: center;
    margin-top: auto; /* דוחף למטה */
    padding: 8px 0;
}

.sidebar-indicator-btn {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    animation: sidebar-indicator-pulse 2s infinite;
}

.sidebar-indicator-btn:hover {
    transform: scale(1.08);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

.sidebar-indicator-btn i {
    font-size: 16px;
}

@keyframes sidebar-indicator-pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}

/* ===================================
   Central Tools Panel (280px)
   פאנל מרוכז עם מרווח מלמעלה ומלמטה
   =================================== */

.central-tools-panel {
    position: fixed;
    top: 70px; /* מרווח מהבר העליון */
    /* מיקום דינמי - מחוץ למסך על בסיס הרוחב הנוכחי */
    right: calc(-1 * var(--panel-width, 280px) - 10px);
    width: 280px;
    height: calc(100vh - 112px); /* מרווח סימטרי למעלה ולמטה */
    background: var(--bg-panel);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    /* visibility מתעדכן אחרי האנימציה בסגירה */
    transition: right 0.3s cubic-bezier(0.4, 0, 0.2, 1), top 0.3s ease, height 0.3s ease, visibility 0s linear 0.3s;
    z-index: 998;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* מונע הצגה בטעינה ראשונית */
    visibility: hidden;
}

/* כבר לא נחוץ - מיקום קבוע */
body:not(.formatting-toolbar-open) .central-tools-panel {
    top: 70px;
    height: calc(100vh - 112px);
}

.central-tools-panel.open {
    right: 72px; /* 🆕 צמוד לבר-האייקונים (18+54=72) — משטח-אחד מתרחב (ללא רווח 8px) */
    visibility: visible; /* נראה כשפתוח */
    border-radius: 12px 0 0 12px; /* 🆕 פינות חיצוניות (שמאל) מעוגלות; התפר מול הבר ישר */
    border-right: none; /* 🆕 תפר נקי — גבול בר-האייקונים משמש כמפריד יחיד */
    /* visibility מתעדכן מיד בפתיחה */
    transition: right 0.3s cubic-bezier(0.4, 0, 0.2, 1), top 0.3s ease, height 0.3s ease, visibility 0s linear 0s;
}

/* 🆕 כשהפאנל פתוח — בר-האייקונים מתחבר אליו (פינות פנימיות/שמאל ישרות) → נראה כמשטח אחד */
body.panel-open .editor-icon-bar {
    border-radius: 0 12px 12px 0;
}

/* 🆕 ===== חלונית "יצירת טקסט" (<dialog> — שלב 5) =====
   תוכן-הטופס משתמש במחלקות .create-* הקיימות; כאן רק ה-shell של ה-<dialog>. */
#createTextDialog {
    width: min(560px, 92vw);
    max-height: 88vh;
    padding: 0;
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
    background: var(--bg-primary, #fff);
    overflow: hidden;
    direction: rtl;
}
#createTextDialog::backdrop {
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(2px);
}
.create-dialog-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    border-bottom: 1px solid var(--border-light, #e2e8f0);
    background: var(--bg-primary, #fff);
}
.create-dialog-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 8px;
}
.create-dialog-close {
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 18px;
    color: var(--text-muted, #64748b);
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}
.create-dialog-close:hover {
    background: var(--bg-hover, #f1f5f9);
    color: var(--text-primary, #1e293b);
}
.create-dialog-body {
    padding: 16px 20px;
    overflow-y: auto;
    max-height: calc(88vh - 58px);
}
/* 🆕 כפתור "הוסף טקסט מהעורך כמקור" */
.create-from-editor-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    margin-bottom: 10px;
    padding: 8px 12px;
    background: var(--bg-hover, #f1f5f9);
    border: 1px dashed var(--border-medium, #cbd5e1);
    border-radius: 8px;
    color: var(--text-secondary, #475569);
    cursor: pointer;
    font-size: 13px;
    font-family: inherit;
    transition: all 0.15s ease;
}
.create-from-editor-btn:hover {
    background: #e8eef6;
    color: var(--accent-primary, #1e3a5f);
    border-color: var(--accent-primary, #1e3a5f);
}

/* 🆕 ===== פאנל-עריכה יחיד (עמודה אחת, כפתורים מוקטנים) — task 3 =====
   שימוש-חוזר ב-.panel-tool-btn / .basic-collapsible-* ; כאן רק הקטנה+עמודה+הבלטה. */
.edit-panel-compact {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 4px 2px 8px;
}
.edit-panel-compact .panel-tool-btn {
    width: 100% !important;
    justify-content: flex-start;
    gap: 8px;
    padding: 7px 10px;
    font-size: 12.5px;
    min-height: 0;
    margin: 0;
}
.edit-panel-compact .panel-tool-btn i {
    font-size: 12px;
    width: 16px;
    text-align: center;
    flex-shrink: 0;
}
.edit-panel-compact .panel-tool-btn span { flex: 1; text-align: right; }

/* * — כפתור בולט (לא גדול יותר, רק מובלט) */
.edit-panel-compact .edit-prom {
    background: #eef2f8;
    border-color: #c9d6e8;
    color: var(--accent-primary, #1e3a5f);
    font-weight: 600;
}
.edit-panel-compact .edit-prom i { color: var(--accent-primary, #1e3a5f); }
.edit-panel-compact .edit-prom:hover { background: #e2eaf5; }

/* & — כותרת קולַפְּס */
.edit-panel-compact .basic-collapsible-container { margin: 0; }
.edit-panel-compact .basic-collapsible-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 7px 10px;
    font-size: 12.5px;
    background: var(--bg-primary, #fff);
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 7px;
    cursor: pointer;
    color: var(--text-secondary, #475569);
    font-family: inherit;
}
.edit-panel-compact .basic-collapsible-header:hover { background: var(--bg-hover, #f1f5f9); color: var(--text-primary, #1e293b); }
.edit-panel-compact .basic-collapsible-header .btn-main-content { display: flex; align-items: center; gap: 8px; flex: 1; }
.edit-panel-compact .basic-collapsible-header i { font-size: 12px; }
.edit-panel-compact .basic-collapsible-header.edit-prom {
    background: #eef2f8; border-color: #c9d6e8; color: var(--accent-primary, #1e3a5f); font-weight: 600;
}
.edit-panel-compact .collapsible-arrow { transition: transform 0.2s ease; font-size: 11px; }
.edit-panel-compact .collapsible-arrow.rotated { transform: rotate(180deg); }

/* תוכן קולַפְּס — מוסתר עד .open (toggleBasicCollapsible מוסיף .open) */
.edit-panel-compact .basic-collapsible-content { display: none; flex-direction: column; gap: 4px; padding: 5px 6px 2px; }
.edit-panel-compact .basic-collapsible-content.open { display: flex; max-height: none; overflow: visible; }
.edit-panel-compact .edit-sub { font-size: 12px; padding: 6px 9px; background: transparent; border-color: transparent; opacity: 0.92; }
.edit-panel-compact .edit-sub:hover { background: var(--bg-hover, #f1f5f9); border-color: var(--border-light, #e2e8f0); opacity: 1; }

.edit-sep { border: none; border-top: 1px solid var(--border-light, #e2e8f0); margin: 6px 2px; }

/* שדה הוראה-מותאמת / שפה אחרת */
.edit-custom-input {
    width: 100%; padding: 6px 8px; font-size: 12px; font-family: inherit;
    border: 1px solid var(--border-medium, #cbd5e1); border-radius: 6px;
    resize: vertical; direction: rtl; box-sizing: border-box;
}
.edit-custom-run {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    margin-top: 5px; padding: 6px 10px; font-size: 12px; font-family: inherit;
    background: var(--accent-primary, #1e3a5f); color: #fff; border: none; border-radius: 6px; cursor: pointer;
}
.edit-custom-run:hover { filter: brightness(1.08); }
.edit-custom-row { display: flex; gap: 6px; align-items: center; margin-top: 4px; }
.edit-custom-row .edit-custom-input { flex: 1; }
.edit-custom-row .edit-custom-run { margin-top: 0; flex-shrink: 0; }

/* 🆕 הדגשה-מתמשכת של הבחירה בזמן כתיבה בשדה-הוראה/שפה (CSS Custom Highlight API) —
   משאיר את ה"היילייט האפור" גלוי גם כשהפוקוס בשדה-הקלט. */
::highlight(word-persist-sel) {
    background-color: rgba(120, 120, 120, 0.32);
    color: inherit;
}

/* 🆕 פונט רוביק לשורות-ההוראה (התאמה-אישית/תרגום/מרחף) — עצמאי בעורך */
@font-face {
    font-family: 'Rubik';
    src: url('/assets/fonts/rubik/rubik-hebrew.woff2') format('woff2');
    font-weight: 300 700; font-display: swap;
    unicode-range: U+0590-05FF, U+FB1D-FB4F, U+200F, U+20AA;
}
@font-face {
    font-family: 'Rubik';
    src: url('/assets/fonts/rubik/rubik-latin.woff2') format('woff2');
    font-weight: 300 700; font-display: swap;
}

/* 🆕 task4/fix: שורת "התאמה אישית" — מינימלית (פס כחול דק תחתון, רוביק), חץ פרופורציונלי */
.edit-panel-compact .edit-custom-bar {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 2px 2px 4px;
}
.edit-panel-compact .edit-custom-bar .edit-custom-input {
    flex: 1;
    min-width: 0;
    background: transparent;
    border: none;
    border-bottom: 1.5px solid var(--accent-primary, #1e3a5f);
    border-radius: 0;
    padding: 5px 2px;
    font-family: 'Rubik', 'Galil', sans-serif;
    font-size: 13px;
    color: var(--text-primary, #1e293b);
    outline: none;
}
.edit-panel-compact .edit-custom-bar .edit-custom-input::placeholder { color: var(--text-muted, #94a3b8); }
.edit-panel-compact .edit-custom-bar .edit-custom-run {
    margin-top: 0; flex-shrink: 0; width: 26px; height: 26px; padding: 0; font-size: 11px; border-radius: 6px;
}

/* 🆕 שורת-אייקונים עליונה (סריקה מהירה + צ'אט) */
.edit-panel-compact .edit-top-icons { display: flex; gap: 6px; align-items: center; }
.edit-panel-compact .edit-top-icons .edit-icon-only { align-self: auto; }
.edit-panel-compact .edit-chat-icon { width: 18px; height: 18px; object-fit: contain; }

/* 🆕 "כוונון מדויק" — צבע מובחן בתוך דרופדאון "עיבוד בסיסי" */
.edit-panel-compact .edit-tune { color: #7c3aed; }
.edit-panel-compact .edit-tune i { color: #7c3aed; }
.edit-panel-compact .edit-tune:hover { background: #f3effc; }

/* 🆕 task3a: טאבים עליונים בפאנל-הימני (עריכה | המרחב האישי) */
.panel-content .panel-tabs {
    display: flex;
    gap: 4px;
    padding: 0 0 8px;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--border-light, #e2e8f0);
}
.panel-content .panel-tab {
    flex: 1;
    padding: 7px 10px;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 6px 6px 0 0;
    cursor: pointer;
    font-family: 'Rubik', 'Galil', sans-serif;
    font-size: 13.5px;
    color: var(--text-muted, #64748b);
    transition: all 0.15s ease;
}
.panel-content .panel-tab:hover { background: var(--bg-hover, #f1f5f9); color: var(--text-primary, #1e293b); }
.panel-content .panel-tab.active {
    color: var(--accent-primary, #1e3a5f);
    border-bottom-color: var(--accent-primary, #1e3a5f);
    font-weight: 600;
}

/* 🆕 task3a: כפתור "יצירת טקסט חדש" (פעולת-יצירה — צבע ירוק מובחן) */
.edit-panel-compact .edit-create-btn { color: var(--accent-success, #10b981); font-weight: 600; }
.edit-panel-compact .edit-create-btn i { color: var(--accent-success, #10b981); }
.edit-panel-compact .edit-create-btn:hover { background: #eafaf2; }

/* 🆕 שורת-פעולות עליונה: בפתוח — צ'אט תופס חצי + סריקה + יצירה (רבע כל אחד, אייקון-בלבד).
   width:auto!important גובר על .panel-tool-btn{width:100%!important} ששובר את השורה. */
.edit-panel-compact .edit-top-actions { display: flex; align-items: stretch; gap: 6px; }
.edit-panel-compact .edit-top-actions .edit-chat-btn { flex: 2 1 0; width: auto !important; min-width: 0; }
.edit-panel-compact .edit-top-actions .edit-act-icon { flex: 1 1 0; width: auto !important; justify-content: center; padding: 7px 0; }
.edit-panel-compact .edit-top-actions .edit-act-icon i { width: auto; margin: 0; }
.edit-panel-compact .edit-top-actions .edit-chat-btn span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* מכווץ: רק אייקון הצ'אט (סריקה+יצירה מופיעים רק בפתוח) — שורה אחת, יישור 1:1 מול הפתוח */
.central-tools-panel:not(.open) .edit-top-actions .edit-act-icon { display: none !important; }
.central-tools-panel:not(.open) .edit-top-actions .edit-chat-btn { flex: 1 1 auto; width: 100% !important; }

/* 🆕 ================= task3b: פאנל-אחד (רצועה מתרחבת) ================= */
/* בר-האייקונים מבוטל ויזואלית (האלמנט נשאר ב-DOM כדי לא לשבור refs כמו assistantIconBtn) */
.editor-icon-bar { display: none !important; }

/* ===== מודל ג'מיני: רצועת-אייקונים תמיד-נוכחת; נפתח רק ע"י חץ-הפתיחה (לא בריחוף) ===== */
.central-tools-panel {
    right: 18px !important;
    width: 48px !important; /* רצועה צרה — בגודל אייקון + ריווח קטן */
    visibility: visible !important;
    transition: width 0.22s cubic-bezier(0.2, 0, 0, 1);
}
/* פתוח = .open בלבד. ריחוף לא מרחיב (כמו ג'מיני — ריחוף = טולטיפ בלבד). */
.central-tools-panel.open {
    width: var(--panel-width, 160px) !important;
}
.central-tools-panel .panel-content { overflow-y: auto; overflow-x: hidden; }
/* פאנל-העריכה: ריפוד-צד קטן (במקום 16px) — כך האייקון יושב ~16px מהקצה הימני
   ולכן ממורכז ברצועה 48px, וזהה בשני המצבים → בלי קפיצה. (סופרסטות/סורק נשארים 16px) */
.central-tools-panel .panel-content:has(.edit-panel-compact) { padding-right: 6px; padding-left: 6px; }

/* === מצב מכווץ (רצועה) — פריסה זהה למצב-הפתוח, רק צר + בלי תוויות/חצים/טאבים ===
   ⚠️ קריטי ל"בלי קפיצה": לא משנים justify-content / padding בין המצבים!
   האייקון נשאר flex-start (RTL=ימין) באותו אופסט בדיוק; רק התווית נחשפת
   והפאנל גדל שמאלה לעבר המרכז. האייקונים אף פעם לא זזים. */
.central-tools-panel:not(.open) .panel-tabs,
.central-tools-panel:not(.open) .edit-split-arrow,
.central-tools-panel:not(.open) .collapsible-arrow,
.central-tools-panel:not(.open) #panelTitle {
    display: none !important;
}
/* התוויות מוסתרות בלבד — בלי שינוי מיקום/גובה-שורה (האייקון לא זז) */
.central-tools-panel:not(.open) .panel-tool-btn span,
.central-tools-panel:not(.open) .btn-main-content span { display: none; }
/* ברצועה: בלי מסגרת/רקע (אבל אותו justify-content/padding כמו פתוח) */
.central-tools-panel:not(.open) .panel-tool-btn,
.central-tools-panel:not(.open) .basic-collapsible-header {
    border-color: transparent !important; background: transparent !important;
}
.central-tools-panel:not(.open) .panel-tool-btn:hover,
.central-tools-panel:not(.open) .basic-collapsible-header:hover { background: var(--bg-hover, #f1f5f9) !important; }
.central-tools-panel:not(.open) .panel-tool-btn:hover { transform: none; } /* בלי נדנוד-ריחוף ברצועה */
/* split (עיבוד/מראי/ניקוד) ברצועה: גובה מובטח כדי שהאייקון לא יקרוס לקו דק
   (ה-container עם overflow:hidden) — אותה פריסת-פתוח, רק החץ מוסתר */
.central-tools-panel:not(.open) .edit-split-row { min-height: 31px; }
/* ברצועה: ה-container לא חותך את האייקון (הדרופדאון מוסתר ממילא) — תיקון "אייקון חצוי" */
.central-tools-panel:not(.open) .basic-collapsible-container { overflow: visible; }
/* בלי פס-גלילה ברצועה הסגורה (עדיין נגלל בגלגלת) */
.central-tools-panel:not(.open) .panel-content { scrollbar-width: none; }
.central-tools-panel:not(.open) .panel-content::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none; }

/* כפתור-נעיצה + טאבים בראש הפאנל (שורה אחת) */
#panelHeaderTools { display: flex; align-items: center; gap: 8px; justify-content: flex-start; padding: 5px 8px; min-height: 0; border: none; border-bottom: 1px solid var(--border-light, #e2e8f0); }
#panelHeaderTabs { display: flex; gap: 2px; flex: 1; }
#panelHeaderTabs .panel-tab {
    flex: 1; padding: 6px 8px; background: transparent; border: none; border-bottom: 2px solid transparent;
    border-radius: 6px 6px 0 0; cursor: pointer; font-family: 'Rubik', 'Galil', sans-serif; font-size: 13px;
    color: var(--text-muted, #64748b); transition: all 0.15s ease;
}
#panelHeaderTabs .panel-tab:hover { color: var(--text-primary, #1e293b); background: var(--bg-hover, #f1f5f9); }
#panelHeaderTabs .panel-tab.active { color: var(--accent-primary, #1e3a5f); border-bottom-color: var(--accent-primary, #1e3a5f); font-weight: 600; }
/* 🆕 טאב ראשי "עריכה" בולט; "הכפתורים שלי" = כרטיסיה קטנה (אייקון + טולטיפ) כמו לשונית כרום */
#panelHeaderTabs .panel-tab[data-ptab="edit"] { flex: 1; text-align: center; }
#panelHeaderTabs .panel-tab.panel-tab-icon {
    flex: 0 0 auto; width: 32px; padding: 6px 0; position: relative;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--border-light, #e2e8f0); border-bottom: none; border-radius: 8px 8px 0 0;
    background: var(--bg-secondary, #f8fafc);
}
#panelHeaderTabs .panel-tab.panel-tab-icon i { font-size: 13px; }
#panelHeaderTabs .panel-tab.panel-tab-icon.active {
    background: var(--bg-primary, #fff); color: var(--accent-primary, #1e3a5f);
    border-color: var(--accent-primary, #1e3a5f); border-bottom: none; font-weight: 600;
}
/* 🆕 טולטיפ מותאם — אלמנט יחיד על body (JS: setupRailTooltips). לא נחתך, מיידי, אחד בלבד.
   עובד בשני המצבים (פתוח+מכווץ). מופיע משמאל לכפתור (לעבר המרכז). */
.rail-tooltip {
    position: fixed; z-index: 100000; pointer-events: none;
    /* מיקום מדויק (left/top) מחושב ב-JS — כולל גלישה למספר שורות והצמדה למסך */
    background: var(--text-primary, #1e293b); color: #fff;
    padding: 7px 11px; border-radius: 7px; font-size: 12.5px; font-family: 'Rubik', sans-serif; font-weight: 400;
    line-height: 1.45; white-space: normal; max-width: 260px; text-align: right;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.22);
    opacity: 0; transition: opacity 0.12s ease;
}
.rail-tooltip.show { opacity: 1; }
/* 🆕 ביטול הטולטיפ-הלבן הישן (::after/::before) בתוך הפאנל — מוחלף בטולטיפ-המותאם הכהה.
   מסיר את הכפילות בכל כפתורי-הפאנל (כולל split, תת-פעולות וסופרסטות). */
.central-tools-panel .panel-tool-btn[data-tooltip]::after,
.central-tools-panel .panel-tool-btn[data-tooltip]::before,
.central-tools-panel .panel-tool-btn[data-tooltip]:hover::after,
.central-tools-panel .panel-tool-btn[data-tooltip]:hover::before,
.central-tools-panel .basic-primary-main-btn[data-tooltip]::after,
.central-tools-panel .basic-primary-main-btn[data-tooltip]::before,
.central-tools-panel .basic-primary-settings-btn[data-tooltip]::after,
.central-tools-panel .basic-primary-settings-btn[data-tooltip]::before,
.central-tools-panel .editing-dropdown-btn[data-tooltip]::after,
.central-tools-panel .editing-dropdown-btn[data-tooltip]::before,
.central-tools-panel .dropdown-item[data-tooltip]::after,
.central-tools-panel .dropdown-item[data-tooltip]::before,
.central-tools-panel .basic-icon-btn[data-tooltip]::after {
    display: none !important;
    content: none !important;
}
/* במצב מכווץ — הטאבים מוסתרים (נשאר רק חץ-הפתיחה, באותו אופסט — לא זז) */
.central-tools-panel:not(.open) #panelHeaderTabs { display: none; }
/* חץ פתיחה/סגירה של הפאנל (לשעבר "נעיצה") — מסובב לפי מצב */
.panel-pin-btn {
    width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 7px; cursor: pointer;
    color: var(--text-muted, #64748b); transition: background 0.15s ease, color 0.15s ease;
}
.panel-pin-btn:hover { background: var(--bg-hover, #f1f5f9); color: var(--accent-primary, #1e3a5f); }
.panel-pin-btn i { transition: transform 0.22s cubic-bezier(0.2, 0, 0, 1); }
.central-tools-panel.open .panel-pin-btn { color: var(--accent-primary, #1e3a5f); }
/* מכווץ: החץ מצביע שמאלה (פתח לעבר המרכז); פתוח: ימינה (סגור לעבר הקצה) */
.central-tools-panel:not(.open) .panel-pin-btn i { transform: rotate(180deg); }

/* "הוראה מותאמת אישית" ברצועה המכווצת: אייקון-שרביט (מוסתר במצב מורחב) */
.edit-custom-railicon {
    display: none;
    width: 100%;
    align-items: center;
    justify-content: flex-start; /* כמו שאר האייקונים ברצועה — יישור זהה */
    gap: 8px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--accent-primary, #1e3a5f);
    padding: 7px 10px; /* זהה ל-.panel-tool-btn */
    border-radius: 7px;
}
.edit-custom-railicon i { font-size: 12px; width: 16px; text-align: center; flex-shrink: 0; }
.edit-custom-railicon:hover { background: var(--bg-hover, #f1f5f9); }
/* "הוראה מותאמת אישית" ברצועה: אייקון-שרביט בלבד (קלט+חץ מוסתרים; בפתוח השרביט מוסתר) */
.central-tools-panel:not(.open) .edit-custom-bar .edit-custom-input,
.central-tools-panel:not(.open) .edit-custom-bar .edit-custom-run { display: none; }
.central-tools-panel:not(.open) .edit-custom-bar { padding: 0; min-height: 32px; }
.central-tools-panel:not(.open) .edit-custom-railicon { display: flex; }

/* 🆕 כפתור "העתק" בסקירת-הטקסט — בראש עמודת-הפעולות (מעל "נסה שוב") */
.scanner-overview-copy {
    width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 6px;
    color: #9ca3af; cursor: pointer; font-size: 12px; transition: all 0.2s;
}
.scanner-overview-copy:hover { background: #f3f4f6; color: var(--accent-primary, #1e3a5f); }
.scanner-overview-copy.copied { color: var(--accent-success, #10b981); }

/* 🆕 task4: כפתור-מפוצל (פעולה ראשית + חץ→דרופדאון) — מראי מקומות / ניקוד */
.edit-panel-compact .edit-split-row {
    display: flex;
    align-items: stretch;
    gap: 4px;
}
.edit-panel-compact .edit-split-main { flex: 1; }
.edit-panel-compact .edit-split-arrow {
    flex-shrink: 0;
    width: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-primary, #fff);
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 7px;
    color: var(--text-muted, #64748b);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.edit-panel-compact .edit-split-arrow:hover { background: var(--bg-hover, #f1f5f9); color: var(--accent-primary, #1e3a5f); }
.edit-panel-compact .edit-split-arrow .collapsible-arrow { font-size: 11px; transition: transform 0.2s ease; }
.edit-panel-compact .edit-split-arrow .collapsible-arrow.rotated { transform: rotate(180deg); }

/* 🆕 task4: כפתור אייקון-בלבד (סריקה מהירה) — אייקון ממורכז + טולטיפ */
.edit-panel-compact .edit-icon-only {
    width: 38px !important;
    justify-content: center;
    align-self: flex-start;
}
.edit-panel-compact .edit-icon-only i { width: auto; }

/* Panel Header */
.panel-header {
    background: var(--bg-primary);
    border-bottom: 1px solid var(--border-light);
    border-radius: 12px 12px 0 0; /* פינות עליונות מעוגלות */
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 60px;
}

.panel-title {
    margin: 0;
    font-size: 15px;
    font-weight: 500;
    color: var(--text-primary);
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: normal;
}

/* Clickable Title Button */
.panel-title.clickable {
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 8px 12px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.panel-title.clickable:hover {
    background: var(--bg-hover);
    color: var(--accent-primary);
    transform: scale(1.02);
}

.panel-title.clickable:active {
    transform: scale(0.98);
}

.panel-back-btn,
.panel-close-btn {
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.panel-back-btn {
    margin-left: auto; /* Push close button to the right */
}

.panel-back-btn:hover,
.panel-close-btn:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

/* Panel Bulk Actions Bar - סגנון מינימליסטי כמו רשימת ההצעות */
.panel-bulk-actions {
    background: white;
    border-bottom: 1px solid var(--border-light);
    padding: 10px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
    min-width: 0; /* Allow shrinking */
}

.bulk-action-btn {
    flex: 1 1 auto;
    background: white;
    border: 1px solid;
    padding: 6px 10px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 600;
    font-family: 'Galil', sans-serif;
    letter-spacing: normal;
    line-height: 1;
    min-height: 32px;
    min-width: 0; /* Allow shrinking */
    white-space: nowrap;
}

.bulk-action-btn i {
    font-size: 13px;
}

/* כפתור החל הכל - כחול כמו הלוגו */
.btn-apply-all {
    color: #1e3a5f;
    border-color: #1e3a5f;
}

.btn-apply-all:hover {
    background: #eff6ff;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.3);
}

/* כפתור דחה הכל - אדום */
.btn-dismiss-all {
    color: #ef4444;
    border-color: #ef4444;
}

.btn-dismiss-all:hover {
    background: #fef2f2;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
}

.bulk-action-btn:active {
    transform: translateY(0);
}

.bulk-action-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

/* Panel Navigation Bar - ניווט בין הצעות */
.panel-navigation-bar {
    background: #f8fafc;
    border-bottom: 1px solid var(--border-light);
    padding: 8px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
    min-width: 0;
}

/* כפתורי ניווט - קודם/הבא */
.nav-btn {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: white;
    color: #6b7280;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: all 0.2s ease;
}

.nav-btn:hover:not(:disabled) {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #374151;
}

.nav-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* מונה הצעות */
.nav-counter {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    min-width: 50px;
    text-align: center;
    font-family: 'Galil', sans-serif;
    letter-spacing: normal;
}

/* מפריד */
.nav-separator {
    width: 1px;
    height: 20px;
    background: #e5e7eb;
    margin: 0 6px;
}

/* כפתורי פעולה - החל/דחה להצעה נוכחית */
.nav-action-btn {
    background: white;
    border: 1px solid;
    padding: 4px 8px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    font-size: 12px;
    font-weight: 600;
    font-family: 'Galil', sans-serif;
    letter-spacing: normal;
    line-height: 1;
    min-height: 28px;
    white-space: nowrap;
    flex-shrink: 0;
}

.nav-action-btn i {
    font-size: 10px;
}

/* כפתור החל - כחול */
.nav-apply {
    color: #1e3a5f;
    border-color: #1e3a5f;
}

.nav-apply:hover:not(:disabled) {
    background: #eff6ff;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(30, 58, 95, 0.25);
}

/* כפתור דחה - אדום */
.nav-dismiss {
    color: #ef4444;
    border-color: #ef4444;
}

.nav-dismiss:hover:not(:disabled) {
    background: #fef2f2;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.25);
}

.nav-action-btn:active {
    transform: translateY(0);
}

.nav-action-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

/* ===================================
   Unified Header - Single Responsive Row
   =================================== */

.panel-header-unified {
    background: white;
    border-bottom: 1px solid var(--border-light);
    border-radius: 12px 12px 0 0; /* פינות עליונות מעוגלות */
    padding: 8px 8px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    direction: rtl;
    overflow: hidden;
    max-width: 100%;
    box-sizing: border-box;
}

/* Back button */
.unified-back-btn {
    width: 32px;
    height: 32px;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: #f3f4f6;
    color: #6b7280;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    align-self: center;
}

.unified-back-btn:hover {
    background: #e5e7eb;
    color: #374151;
}

/* Title */
.unified-title {
    font-family: 'Galil', 'Heebo', sans-serif;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: normal;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 90px;
    flex-shrink: 1;
}

/* Navigation group */
.unified-nav {
    display: flex;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
}

.unified-nav-btn {
    width: 26px;
    height: 26px;
    padding: 0;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    background: white;
    color: #6b7280;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    transition: all 0.15s ease;
}

.unified-nav-btn:hover:not(:disabled) {
    background: #f3f4f6;
    border-color: #d1d5db;
}

.unified-nav-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.unified-counter {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    min-width: 36px;
    text-align: center;
}

/* Single actions group */
.unified-single-actions {
    display: flex;
    align-items: stretch;
    gap: 6px;
    flex-shrink: 0;
}

/* Single action buttons - Square with icon on top, text at bottom */
.unified-action-btn {
    background: white;
    border: 1px solid;
    padding: 4px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    font-size: 10px;
    font-weight: 400 !important;
    font-family: 'Neta', 'Heebo', sans-serif !important;
    letter-spacing: normal;
    line-height: 1;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
    flex-shrink: 0;
    flex-grow: 0;
}

.unified-action-btn .btn-icon-v,
.unified-action-btn .btn-icon-x {
    width: 22px;
    height: 22px;
    object-fit: contain;
}

.unified-action-btn.btn-apply-single {
    color: #1e3a5f;
    border: 1px solid #1e3a5f !important;
}

.unified-action-btn.btn-apply-single:hover:not(:disabled) {
    background: #e8eef5;
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.25);
    transform: scale(1.05);
}

.unified-action-btn.btn-dismiss-single {
    color: #ef4444;
    border: 1px solid #ef4444 !important;
}

.unified-action-btn.btn-dismiss-single:hover:not(:disabled) {
    background: #fef2f2;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.25);
    transform: scale(1.05);
}

.unified-action-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Spacer to push bulk actions to the end */
.unified-spacer {
    flex: 1;
    min-width: 8px;
}

/* More options button (three dots) */
.unified-more-btn {
    width: 28px;
    height: 28px;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #9ca3af;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.unified-more-btn:hover {
    background: #f3f4f6;
    color: #6b7280;
}

/* Bulk actions container */
.unified-bulk-actions {
    display: flex;
    align-items: stretch;
    gap: 6px;
    flex-shrink: 0;
}

/* Bulk action buttons - Square with icon on top, text at bottom */
.unified-bulk-btn {
    background: white;
    border: 1px solid;
    padding: 4px 4px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    font-size: 9px;
    font-weight: 500;
    font-family: 'Neta', 'Heebo', sans-serif;
    color: #1e3a5f;
    line-height: 1;
    min-width: 50px;
    height: 44px;
    white-space: nowrap;
    flex-shrink: 0;
}

.unified-bulk-btn .btn-icon-v,
.unified-bulk-btn .btn-icon-x {
    width: 18px;
    height: 18px;
    object-fit: contain;
}

.unified-bulk-btn.btn-apply-all {
    color: #1e3a5f;
    border-color: #1e3a5f;
    background: #e8eef5;
}

.unified-bulk-btn.btn-apply-all:hover:not(:disabled) {
    background: #d4dee8;
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.3);
    transform: scale(1.05);
}

.unified-bulk-btn.btn-dismiss-all {
    color: #ef4444;
    border-color: #ef4444;
    background: #fef2f2;
}

.unified-bulk-btn.btn-dismiss-all:hover:not(:disabled) {
    background: #fee2e2;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
    transform: scale(1.05);
}

.unified-bulk-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Close button */
.unified-close-btn {
    width: 32px;
    height: 32px;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #9ca3af;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    margin-right: auto; /* Push to left end in RTL */
    align-self: center;
}

.unified-close-btn:hover {
    background: #f3f4f6;
    color: #ef4444;
}

/* Status Indicator - shows count, fades after 3s, reappears on hover */
.unified-status-indicator {
    display: none; /* Hidden by default, shown via JS */
    background: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
    padding: 6px 12px;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    color: #495057;
    font-family: 'Galil', sans-serif;
    letter-spacing: normal;
    transition: opacity 0.3s ease, max-height 0.3s ease;
    opacity: 1;
    max-height: 40px;
    overflow: hidden;
    direction: rtl;
}

.unified-status-indicator.faded {
    opacity: 0.15;
    max-height: 20px;
    padding: 3px 12px;
    font-size: 10px;
}

.unified-status-indicator.faded:hover {
    opacity: 1;
    max-height: 40px;
    padding: 6px 12px;
    font-size: 12px;
}

.unified-status-indicator .status-text {
    margin-left: 6px;
}

.unified-status-indicator .status-icon {
    color: #10b981;
    font-weight: bold;
}

/* Wide mode - when panel is expanded (450px+) */
.central-tools-panel.wide-mode .panel-header-unified {
    flex-wrap: nowrap;
    padding: 8px 10px;
}

.central-tools-panel.wide-mode .unified-title {
    max-width: 120px;
    font-size: 15px;
}

.central-tools-panel.wide-mode .unified-nav-btn {
    width: 28px;
    height: 28px;
    font-size: 11px;
}

.central-tools-panel.wide-mode .unified-counter {
    font-size: 12px;
    min-width: 40px;
}

.central-tools-panel.wide-mode .unified-action-btn,
.central-tools-panel.wide-mode .unified-bulk-btn {
    width: 50px;
    height: 50px;
    font-size: 10px;
}

.central-tools-panel.wide-mode .unified-action-btn .btn-icon-v,
.central-tools-panel.wide-mode .unified-action-btn .btn-icon-x {
    width: 24px;
    height: 24px;
}

.central-tools-panel.wide-mode .unified-bulk-btn .btn-icon-v,
.central-tools-panel.wide-mode .unified-bulk-btn .btn-icon-x {
    width: 22px;
    height: 22px;
}

/* ===================================
   Legacy Unified Compact Toolbar (deprecated)
   =================================== */

.panel-unified-toolbar {
    background: white;
    border-bottom: 1px solid var(--border-light);
    padding: 8px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 48px;
}

/* Section containers */
.toolbar-section {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Navigation section - compact */
.toolbar-navigation {
    flex-shrink: 0;
}

.toolbar-navigation .nav-btn {
    width: 26px;
    height: 26px;
    font-size: 11px;
}

.toolbar-navigation .nav-counter {
    font-size: 11px;
    min-width: 40px;
    padding: 0 4px;
}

/* Single actions - icon-only buttons */
.toolbar-single-actions {
    flex-shrink: 0;
    gap: 3px;
}

.toolbar-icon-btn {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.toolbar-icon-btn .btn-icon-v,
.toolbar-icon-btn .btn-icon-x {
    width: 14px;
    height: 14px;
    object-fit: contain;
}

.toolbar-icon-btn.btn-apply-single {
    border-color: #1e3a5f;
}

.toolbar-icon-btn.btn-apply-single:hover:not(:disabled) {
    background: #eff6ff;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(30, 58, 95, 0.25);
}

.toolbar-icon-btn.btn-dismiss-single {
    border-color: #ef4444;
}

.toolbar-icon-btn.btn-dismiss-single:hover:not(:disabled) {
    background: #fef2f2;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.25);
}

.toolbar-icon-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Bulk actions - larger and prominent */
.toolbar-bulk-actions {
    flex: 1;
    justify-content: flex-end;
    gap: 6px;
}

.toolbar-bulk-btn {
    background: white;
    border: 2px solid;
    padding: 6px 12px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    font-family: 'Galil', sans-serif;
    letter-spacing: normal;
    line-height: 1;
    min-height: 36px;
    white-space: nowrap;
}

.toolbar-bulk-btn .btn-icon-v,
.toolbar-bulk-btn .btn-icon-x {
    width: 16px;
    height: 16px;
    object-fit: contain;
}

/* כפתור החל הכל - כחול בולט */
.toolbar-bulk-btn.btn-apply-all {
    color: #1e3a5f;
    border-color: #1e3a5f;
    background: #eff6ff;
}

.toolbar-bulk-btn.btn-apply-all:hover:not(:disabled) {
    background: #dbeafe;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.35);
}

/* כפתור דחה הכל - אדום בולט */
.toolbar-bulk-btn.btn-dismiss-all {
    color: #ef4444;
    border-color: #ef4444;
    background: #fef2f2;
}

.toolbar-bulk-btn.btn-dismiss-all:hover:not(:disabled) {
    background: #fee2e2;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.35);
}

.toolbar-bulk-btn:active {
    transform: translateY(0);
}

.toolbar-bulk-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

/* Responsive - smaller screens */
@media (max-width: 400px) {
    .panel-unified-toolbar {
        flex-wrap: wrap;
        padding: 6px 8px;
        gap: 6px;
    }

    .toolbar-bulk-btn span {
        display: none; /* Hide text on very small screens */
    }

    .toolbar-bulk-btn {
        padding: 6px 8px;
        min-height: 32px;
    }
}

/* Panel Status Bar */
.panel-status-bar {
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-light);
    padding: 10px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--text-secondary);
    min-height: 40px;
}

.panel-status-bar i {
    color: var(--accent-primary);
    font-size: 14px;
}

.panel-status-bar.success {
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.panel-status-bar.success i {
    color: var(--accent-success);
}

.panel-status-bar.error {
    background: #fef2f2;
    border-color: #fecaca;
}

.panel-status-bar.error i {
    color: #ef4444;
}

/* Panel Content */
.panel-content {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    margin-left: 10px; /* מרווח בין סרגל הגלילה לידית הגרירה */
}

/* Tool Button in Panel */
.panel-tool-btn {
    width: 100%;
    padding: 12px 16px;
    border: none;
    background: var(--bg-primary);
    color: var(--text-primary);
    text-align: right;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    font-family: 'Galil', 'Heebo', sans-serif;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: normal;
    border-radius: 8px;
    transition: all 0.2s ease;
    margin-bottom: 8px;
    border: 1px solid var(--border-light);
}

.panel-tool-btn:hover {
    background: var(--bg-hover);
    border-color: var(--accent-primary);
    color: var(--accent-primary);
    transform: translateX(-4px);
}

.panel-tool-btn i {
    width: 20px;
    text-align: center;
    color: var(--text-muted);
    font-size: 16px;
}

.panel-tool-btn:hover i {
    color: var(--accent-primary);
}

/* Advanced Settings Button */
.panel-tool-btn.advanced-settings {
    background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
    border-color: #d1d5db;
    font-weight: 500;
    position: relative;
}

.panel-tool-btn.advanced-settings::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    border-radius: 0 8px 8px 0;
}

.panel-tool-btn.advanced-settings i {
    color: #f59e0b;
}

.panel-tool-btn.advanced-settings:hover {
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
}

/* Disabled Tool Button */
.panel-tool-btn.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    background: #f3f4f6;
    position: relative;
}

.panel-tool-btn.disabled:hover {
    background: #f3f4f6;
    transform: none;
    box-shadow: none;
}

.panel-tool-btn.disabled i {
    color: #9ca3af;
}

.coming-soon-badge {
    font-size: 9px;
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
    padding: 2px 6px;
    border-radius: 8px;
    margin-right: 8px;
    font-weight: 600;
    letter-spacing: 0.3px;
}

/* Panel Sections */
.panel-section {
    margin-bottom: 24px;
}

.panel-section-title {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: normal;
    margin-bottom: 12px;
    padding: 0 4px;
}

/* Smooth Scrollbar */
.panel-content::-webkit-scrollbar {
    width: 6px;
}

.panel-content::-webkit-scrollbar-track {
    background: transparent;
}

.panel-content::-webkit-scrollbar-thumb {
    background: var(--border-medium);
    border-radius: 3px;
}

.panel-content::-webkit-scrollbar-thumb:hover {
    background: var(--border-strong);
}

/* ===================================
   Panel Footer - Suggestions Actions
   =================================== */

.panel-footer {
    background: var(--bg-primary);
    border-top: 1px solid var(--border-light);
    padding: 12px 16px;
    display: flex;
    gap: 8px;
    justify-content: space-between;
    min-height: 60px;
}

.panel-footer-btn {
    flex: 1;
    padding: 10px 16px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    font-family: 'Galil', sans-serif;
    letter-spacing: normal;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.panel-footer-btn i {
    font-size: 16px;
}

.btn-accept-all {
    background: linear-gradient(135deg, var(--accent-success) 0%, #059669 100%);
    color: white;
    box-shadow: 0 2px 4px rgba(16, 185, 129, 0.2);
}

.btn-accept-all:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
}

.btn-reject-all {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    color: white;
    box-shadow: 0 2px 4px rgba(239, 68, 68, 0.2);
}

.btn-reject-all:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3);
}

.panel-footer-btn:active {
    transform: translateY(0);
}

.panel-footer-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

/* ===================================
   Suggestions Cards - כרטיסי הצעות
   =================================== */

.panel-suggestions-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.panel-suggestion-card {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.2s ease;
}

.panel-suggestion-card:hover {
    border-color: var(--border-medium);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Suggestion Card Header */
.suggestion-card-header {
    padding: 10px 12px;
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-light);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.suggestion-category-badge {
    padding: 3px 8px;
    border-radius: 12px;
    font-size: 10px;
    font-weight: 600;
    color: white;
    text-transform: uppercase;
    letter-spacing: normal;
}

/* Category Colors - צבעי הפרויקט */
.category-grammar { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); }
.category-spelling { background: linear-gradient(135deg, #f97316 0%, #ea580c 100%); }
.category-punctuation { background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); }
.category-style { background: linear-gradient(135deg, #1e3a5f 0%, #162d4a 100%); }
.category-clarity { background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); }
.category-headers { background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%); }
.category-sources { background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%); }

/* Text Comparison */
.suggestion-text-comparison {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.suggestion-text-block {
    padding: 10px;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.6;
    border-right: 3px solid;
}

.suggestion-text-original {
    background: rgba(239, 68, 68, 0.08);
    border-color: #ef4444;
    color: #6b7280;
}

.suggestion-text-improved {
    background: rgba(30, 58, 95, 0.08);
    border-color: #1e3a5f;
    color: #1f2937;
    font-weight: 500;
}

.text-label {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: normal;
    color: var(--text-muted);
    margin-bottom: 4px;
    display: block;
}

/* Suggestion Actions */
.suggestion-card-actions {
    padding: 10px 12px;
    background: var(--bg-secondary);
    border-top: 1px solid var(--border-light);
    display: flex;
    gap: 6px;
    justify-content: flex-end;
}

.suggestion-action-btn {
    padding: 6px 12px;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    font-family: 'Galil', sans-serif;
    letter-spacing: normal;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all 0.2s ease;
}

.suggestion-action-btn i {
    font-size: 11px;
}

.btn-accept {
    background: white;
    color: #1e3a5f;
    border: 1px solid #1e3a5f;
}

.btn-accept:hover {
    background: #eff6ff;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(30, 58, 95, 0.3);
}

.btn-reject {
    background: white;
    color: #ef4444;
    border: 1px solid #ef4444;
}

.btn-reject:hover {
    background: #fef2f2;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.3);
}

.suggestion-action-btn:active {
    transform: translateY(0);
}

/* Empty State */
.panel-empty-state {
    text-align: center;
    padding: 40px 20px;
    color: var(--text-muted);
}

.panel-empty-state i {
    font-size: 48px;
    color: var(--border-medium);
    margin-bottom: 16px;
    display: block;
}

.panel-empty-state p {
    margin: 0;
    font-size: 14px;
}

/* ============================================
   🆕 Inline Results Container
   קונטיינר תוצאות בתוך הפאנל (בסוף הכפתורים)
   ============================================ */

.panel-inline-results {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e5e7eb;
}

.panel-inline-results-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: linear-gradient(to left, transparent, rgba(30, 58, 95, 0.05));
    border-radius: 8px;
    margin-bottom: 12px;
}

.panel-inline-results-header .results-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary, #1f2937);
}

.panel-inline-results-header .results-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 8px;
    background: var(--accent-primary, #1e3a5f);
    color: white;
    font-size: 12px;
    font-weight: 600;
    border-radius: 12px;
}

/* 🆕 פס בקרה inline (ניווט + כפתורי פעולה) */
.inline-control-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 12px;
    background: #f8fafc;
    border-radius: 8px;
    margin-bottom: 12px;
    border: 1px solid #e5e7eb;
}

.inline-nav-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.inline-nav-btn {
    width: 28px;
    height: 28px;
    border: none;
    background: white;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary, #64748b);
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.inline-nav-btn:hover {
    background: var(--accent-primary, #1e3a5f);
    color: white;
}

.inline-nav-counter {
    font-size: 12px;
    font-weight: 500;
    color: var(--text-primary, #1f2937);
    min-width: 50px;
    text-align: center;
}

.inline-action-btns {
    display: flex;
    align-items: center;
    gap: 8px;
}

.inline-action-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.inline-action-btn.apply {
    background: var(--accent-primary, #1e3a5f);
    color: white;
}

.inline-action-btn.apply:hover {
    background: #152a47;
}

.inline-action-btn.reject {
    background: #ef4444;
    color: white;
}

.inline-action-btn.reject:hover {
    background: #dc2626;
}

.inline-action-btn i {
    font-size: 11px;
}

/* 🔥 סימני Unicode לכפתורים */
.inline-action-btn .btn-icon,
.inline-nav-btn {
    font-weight: bold;
    font-size: 14px;
}

.panel-empty-state .empty-icon {
    font-size: 32px;
    color: #10b981;
    display: block;
    margin-bottom: 8px;
}

/* 🔥 סגנונות לאייקוני הצלחה וכפתורי ניקוד */
.nikud-success-header .success-icon {
    font-size: 16px;
    color: #10b981;
    font-weight: bold;
    margin-left: 6px;
}

.nikud-action-btn .btn-icon {
    font-size: 14px;
    margin-left: 4px;
}

.nikud-close-btn {
    font-size: 14px;
    font-weight: bold;
}

/* 🆕 כפתורי פעולה בודדים (החל/דחה לשינוי נוכחי) */
.inline-single-btns {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 8px;
    padding: 0 8px;
    border-left: 1px solid var(--border-light, #e2e8f0);
    border-right: 1px solid var(--border-light, #e2e8f0);
}

.inline-action-btn.apply-single {
    background: var(--accent-primary, #1e3a5f);
    color: white;
    padding: 5px 10px;
}

.inline-action-btn.apply-single:hover {
    background: #152a47;
}

.inline-action-btn.reject-single {
    background: #ef4444;
    color: white;
    padding: 5px 10px;
}

.inline-action-btn.reject-single:hover {
    background: #dc2626;
}

/* 🆕 Track Changes Panel Inline */
.track-changes-panel-inline {
    background: white;
    border-radius: 8px;
    overflow: hidden;
}

.inline-status-text {
    font-size: 12px;
    color: var(--text-secondary, #64748b);
}

/* ============================================
   🆕 Minimalist Processing Indicator
   אינדיקטור עיבוד מינימליסטי - עיגול מסתובב + שורה מתחלפת
   ============================================ */

/* קונטיינר האינדיקטור - ממקום מתחת לכפתורים */
.minimalist-indicator {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 16px;
    gap: 8px;
    margin-top: 16px;
    border-top: 1px solid #e5e7eb;
    animation: fadeIn 0.3s ease-out;
}

/* 🆕 שורה ראשית - ספינר + טקסט + כפתור עצור */
.minimalist-indicator-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
}

/* עיגול ספינר מינימליסטי */
.minimalist-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--accent-primary, #1e3a5f);
    border-radius: 50%;
    animation: spin 1s linear infinite;
    flex-shrink: 0;
}

/* 🆕 קונטיינר טקסט */
.minimalist-text-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

/* כותרת הפעולה - "מפעיל את כפתור..." */
.minimalist-title {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary, #1f2937);
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* שורת סטטוס מתחלפת - שורה אחת בלבד */
.minimalist-status {
    font-size: 12px;
    color: var(--text-secondary, #6b7280);
    text-align: right;
    min-height: 16px;
    animation: fadeSwitch 0.3s ease-out;
}

/* 🆕 כפתור עצור בתוך האינדיקטור - עיצוב כמו בצ'אט */
.minimalist-stop-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: #dc2626;
    color: white;
    border: none;
    border-radius: 50%;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.minimalist-stop-btn:hover {
    background: #b91c1c;
    transform: scale(1.05);
}

.minimalist-stop-btn:active {
    transform: scale(0.95);
}

.minimalist-stop-btn i {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
    font-weight: 900;
    font-style: normal;
}

/* שורת צ'אנקינג - "מעבד חלק X מתוך Y" */
.minimalist-chunk-progress {
    font-size: 11px;
    color: var(--accent-primary, #1e3a5f);
    font-weight: 500;
    margin-top: 4px;
    text-align: center;
}

/* אנימציית החלפת טקסט */
@keyframes fadeSwitch {
    0% {
        opacity: 0;
        transform: translateY(-3px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* אנימציית הופעה */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* ============================================
   🆕 Chat Inline Indicator
   אינדיקטור בתוך הצ'אט - לכפתורים שנלחצו מהצ'אט
   ============================================ */

.chat-processing-indicator {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 16px;
    margin: 12px 0;
    background: linear-gradient(to left, transparent, rgba(30, 58, 95, 0.03));
    border-radius: 12px;
    animation: fadeIn 0.3s ease-out;
}

.chat-processing-indicator .minimalist-indicator-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    width: 100%;
}

.chat-processing-indicator .minimalist-spinner {
    width: 24px;
    height: 24px;
    border-width: 2px;
}

.chat-processing-indicator .minimalist-text-content {
    flex: 1;
}

.chat-processing-indicator .minimalist-title {
    font-size: 13px;
}

.chat-processing-indicator .minimalist-status {
    font-size: 11px;
}

.chat-processing-indicator .minimalist-stop-btn {
    padding: 5px 12px;
    font-size: 11px;
}

/* ============================================
   Chat Track Changes & Nikud Results
   תוצאות עריכה וניקוד בתוך הצ'אט
   ============================================ */

.chat-track-changes-result,
.chat-nikud-result {
    margin: 8px 0;
    animation: fadeIn 0.3s ease-out;
}

.chat-track-changes-result .panel-inline-results,
.chat-nikud-result .panel-inline-results {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 12px;
}

.chat-inline-results .panel-inline-results-header {
    background: linear-gradient(to left, transparent, rgba(30, 58, 95, 0.08));
    border-radius: 8px;
    margin-bottom: 10px;
}

.chat-track-changes-info {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: #f0f9ff;
    border-radius: 6px;
    font-size: 12px;
    color: #0369a1;
    margin-top: 8px;
}

.chat-track-changes-info i {
    color: #0284c7;
}

/* ניקוד - עיצוב קומפקטי יותר לצ'אט */
.chat-nikud-result .nikud-result-inline {
    padding: 0;
}

.chat-nikud-result .nikud-success-header {
    padding: 10px 12px;
    font-size: 13px;
}

.chat-nikud-result .nikud-original-section {
    padding: 10px 12px;
}

.chat-nikud-result .nikud-original-box {
    max-height: 120px;
    overflow-y: auto;
}

.chat-nikud-result .nikud-actions {
    margin-top: 10px;
}

/* Empty state בצ'אט */
.chat-inline-results .panel-empty-state {
    padding: 16px;
    text-align: center;
}

.chat-inline-results .panel-empty-state i {
    font-size: 24px;
    color: #10b981;
    margin-bottom: 8px;
}

.chat-inline-results .panel-empty-state p {
    font-size: 13px;
    color: #6b7280;
    margin: 0;
}

/* 🔥 וידוא שהאייקונים מוצגים בקופסאות הצ'אט והפאנל */
.panel-inline-results .inline-action-btn i,
.panel-inline-results .inline-nav-btn i,
.chat-inline-results .inline-action-btn i,
.chat-inline-results .inline-nav-btn i {
    font-size: 12px;
    display: inline-block;
    margin-left: 4px;
}

.panel-inline-results .inline-action-btn.apply i,
.panel-inline-results .inline-action-btn.apply-single i,
.chat-inline-results .inline-action-btn.apply i,
.chat-inline-results .inline-action-btn.apply-single i {
    color: white;
}

.panel-inline-results .inline-action-btn.reject i,
.panel-inline-results .inline-action-btn.reject-single i,
.chat-inline-results .inline-action-btn.reject i,
.chat-inline-results .inline-action-btn.reject-single i {
    color: white;
}

.panel-inline-results .nikud-action-btn i,
.chat-inline-results .nikud-action-btn i {
    font-size: 12px;
    margin-left: 4px;
}

/* ============================================
   Chat Results Collapsed State
   תצוגה מקופלת של תוצאות בצ'אט
   ============================================ */

.chat-results-collapsed {
    padding: 8px 12px !important;
}

.collapsed-result-header {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    padding: 4px 0;
}

.collapsed-result-header:hover {
    opacity: 0.8;
}

.collapsed-icon {
    font-size: 16px;
    font-weight: bold;
}

.chat-results-collapsed.success .collapsed-icon {
    color: #10b981;
}

.chat-results-collapsed.rejected .collapsed-icon {
    color: #ef4444;
}

.collapsed-title {
    flex: 1;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}

.collapsed-toggle {
    font-size: 10px;
    color: #9ca3af;
    transition: transform 0.2s ease;
}

.collapsed-result-content {
    padding-top: 8px;
    margin-top: 8px;
    border-top: 1px solid #e5e7eb;
}

.collapsed-message p {
    font-size: 12px;
    color: #6b7280;
    margin: 0;
}

/* ============================================
   Legacy Loading State (נשמר לתאימות)
   ============================================ */

/* Loading State - רשימה מינימליסטית */
.loading-messages-list {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.loading-message-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid #e5e7eb;
    transition: all 0.3s ease;
    animation: slideIn 0.3s ease-out;
}

.loading-message-item:last-child {
    border-bottom: none;
}

.loading-message-item i {
    font-size: 16px;
    min-width: 16px;
    flex-shrink: 0;
}

.loading-message-item span {
    font-size: 14px;
    color: var(--text-secondary);
    line-height: 1.4;
}

/* הודעה פעילה - כחולה עם spinner */
.loading-message-item.active {
    background: linear-gradient(to left, transparent, rgba(30, 58, 95, 0.05));
}

.loading-message-item.active i {
    color: var(--accent-primary);
    animation: spin 1s linear infinite;
}

.loading-message-item.active span {
    color: var(--text-primary);
    font-weight: 500;
}

/* הודעה שהושלמה - כחולה עם V (צבעי הלוגו) */
.loading-message-item.completed i {
    color: #1e3a5f;
}

.loading-message-item.completed span {
    color: var(--text-muted);
}

/* אנימציית כניסה עדינה יותר */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* אנימציית ספין */
@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* אנימציית סיבוב איטית ועדינה */
@keyframes spinSlow {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* אנימציית פולס עדינה לטקסט */
@keyframes pulseText {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.6;
    }
}

/* 🔥 אפקט הבהוב לטקסט שנשלח לעיבוד - צבע אפור בהיר */
@keyframes processingFlash {
    0% {
        background-color: transparent;
    }
    25% {
        background-color: rgba(120, 120, 120, 0.15);
    }
    50% {
        background-color: rgba(120, 120, 120, 0.25);
    }
    75% {
        background-color: rgba(120, 120, 120, 0.15);
    }
    100% {
        background-color: transparent;
    }
}

.text-processing-flash {
    animation: processingFlash 1.2s ease-in-out infinite; /* 🆕 infinite - עד שמגיעות התוצאות */
    border-radius: 3px;
}

/* הבהוב על כל העורך כשמעבדים טקסט מלא */
#textEditor.processing-flash {
    animation: processingFlash 1.2s ease-in-out infinite; /* 🆕 infinite */
}

/* אנימציית הופעה */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===================================
   Responsive Adjustments
   =================================== */

@media (max-width: 768px) {
    .editor-icon-bar {
        width: 48px;
        top: 72px;
        right: 6px;
        height: calc(100vh - 114px);
    }

    .icon-bar-btn {
        width: 38px;
        height: 38px;
        font-size: 16px;
    }

    .central-tools-panel {
        --panel-width: 240px;
        width: 240px;
        /* מיקום דינמי - מחוץ למסך */
        right: calc(-1 * var(--panel-width, 240px) - 10px);
        top: 72px;
        height: calc(100vh - 114px);
    }

    .central-tools-panel.open {
        right: 54px; /* 🆕 צמוד לבר-האייקונים (6+48=54) — משטח-אחד מתרחב גם ב-1200px */
    }
}

/* ===================================
   Editor Container Shift (when panel open)
   =================================== */

/* Smooth transition */
.main-editor {
    transition: margin-right 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}


/* ===================================
   Animations
   =================================== */

@keyframes slideInFromRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.panel-tool-btn {
    animation: fadeIn 0.3s ease-out;
}

/* ===================================
   Panel Resize Handle
   =================================== */

.panel-resize-handle {
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    cursor: ew-resize;
    background: transparent;
    z-index: 1001;
    transition: background-color 0.2s ease;
}

.panel-resize-handle:hover {
    background: linear-gradient(90deg, rgba(30, 58, 95, 0.3), transparent);
}

.panel-resize-handle:active,
.panel-resize-handle.dragging {
    background: linear-gradient(90deg, rgba(30, 58, 95, 0.5), transparent);
}

/* Visual indicator line */
.panel-resize-handle::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 1px;
    transform: translateY(-50%);
    width: 3px;
    height: 40px;
    background: var(--border-medium);
    border-radius: 2px;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.panel-resize-handle:hover::after,
.panel-resize-handle.dragging::after {
    opacity: 1;
    background: var(--accent-primary);
}

/* Panel width CSS variable support - defined on :root for global access */
:root {
    --panel-width: 280px;
}

.central-tools-panel {
    width: var(--panel-width);
}

/* 🆕 מרווחי-העורך (text-editor/footnotes/tc-bar) מאוחדים כעת ל-var(--editor-space-*) ב-main.css
   (מקור-אמת יחיד על body). נשאר כאן רק ה-placeholder שמשתמש ב-`right` ולא ב-margin: */
body.panel-open .editor-placeholder-overlay {
    /* text-editor margin-right + padding(20px) */
    right: calc(var(--editor-space-right, 142px) + 20px);
}

/* Disable text selection while resizing */
body.panel-resizing {
    user-select: none;
    cursor: ew-resize !important;
}

body.panel-resizing * {
    cursor: ew-resize !important;
}

/* ===================================
   Style Panel - סגנון כתיבה
   =================================== */

.style-panel-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
}

/* Section styling */
.style-section {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    overflow: hidden;
}

.style-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    background: var(--bg-secondary);
    cursor: pointer;
    transition: background 0.2s ease;
}

.style-section-header:hover {
    background: var(--bg-hover);
}

.style-section-header .section-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
}

.style-section-header .section-title i {
    color: var(--accent-primary);
    font-size: 14px;
}

.style-section-header .section-toggle {
    color: var(--text-muted);
    font-size: 12px;
    transition: transform 0.3s ease;
}

.style-section-header .section-toggle.open {
    transform: rotate(180deg);
}

.style-section-content {
    padding: 16px;
    border-top: 1px solid var(--border-light);
}

/* Style Settings Section */
.style-settings-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 400px;
    overflow-y: auto;
}

.style-setting-item {
    background: var(--bg-secondary);
    border-radius: 8px;
    padding: 14px;
    margin-bottom: 4px;
}

.setting-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.setting-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 6px;
}

.setting-title i {
    color: var(--accent-primary);
    font-size: 12px;
}

.setting-value {
    font-size: 12px;
    font-weight: 600;
    color: var(--accent-primary);
    background: rgba(30, 58, 95, 0.1);
    padding: 4px 10px;
    border-radius: 12px;
}

/* Slider Container */
.setting-slider-container {
    margin-bottom: 8px;
}

/* Custom Slider */
.style-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 6px;
    background: var(--border-light);
    border-radius: 3px;
    outline: none;
    cursor: pointer;
    margin-bottom: 8px;
}

.style-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    background: #f59e0b;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(245, 158, 11, 0.4);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.style-slider::-webkit-slider-thumb:hover {
    transform: scale(1.15);
    box-shadow: 0 3px 10px rgba(245, 158, 11, 0.5);
}

.style-slider::-moz-range-thumb {
    width: 18px;
    height: 18px;
    background: #f59e0b;
    border-radius: 50%;
    cursor: pointer;
    border: none;
    box-shadow: 0 2px 6px rgba(245, 158, 11, 0.4);
}

/* Slider Labels */
.slider-labels {
    display: flex;
    justify-content: space-between;
    gap: 4px;
}

.slider-label {
    font-size: 10px;
    color: var(--text-muted);
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 4px;
    transition: all 0.2s ease;
    text-align: center;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.slider-label:hover {
    color: var(--accent-primary);
    background: rgba(30, 58, 95, 0.05);
}

.slider-label.active {
    color: var(--accent-primary);
    font-weight: 600;
}

/* Setting Description */
.setting-desc {
    font-size: 11px;
    color: var(--text-muted);
    margin: 8px 0 0 0;
    padding: 8px;
    background: var(--bg-primary);
    border-radius: 6px;
    border-right: 3px solid var(--accent-primary);
}

/* Apply button */
.style-apply-btn {
    width: 100%;
    padding: 12px 16px;
    margin-top: 16px;
    background: linear-gradient(135deg, var(--accent-primary) 0%, #2a4d7a 100%);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.style-apply-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.3);
}

.style-apply-btn:active {
    transform: translateY(0);
}

/* Personal Style Section */
.personal-style-create {
    margin-bottom: 20px;
}

.personal-style-create h4 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 8px 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.personal-style-create h4 i {
    color: var(--accent-primary);
}

.style-hint {
    font-size: 12px;
    color: var(--text-muted);
    margin: 0 0 12px 0;
}

.personal-style-create textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid var(--border-light);
    border-radius: 8px;
    font-family: 'Heebo', sans-serif;
    font-size: 13px;
    resize: vertical;
    min-height: 120px;
    background: var(--bg-primary);
    color: var(--text-primary);
    transition: border-color 0.2s ease;
    line-height: 1.6;
}

.personal-style-create textarea:focus {
    outline: none;
    border-color: var(--accent-primary);
}

.personal-style-create textarea::placeholder {
    color: var(--text-muted);
}

.personal-style-name-row {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}

.personal-style-name-row input {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid var(--border-light);
    border-radius: 6px;
    font-size: 13px;
    background: var(--bg-primary);
    color: var(--text-primary);
}

.personal-style-name-row input:focus {
    outline: none;
    border-color: var(--accent-primary);
}

.style-save-btn {
    padding: 10px 16px;
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s ease;
    white-space: nowrap;
    flex-shrink: 0;
    min-width: fit-content;
}

.style-save-btn:hover {
    background: #2a4d7a;
}

/* רספונסיביות - כשהפאנל צר מציגים רק אייקון */
.personal-style-name-row {
    flex-wrap: wrap;
}

@media (max-width: 450px), (min-width: 0px) {
    .panel-open .personal-style-name-row .style-save-btn .btn-text {
        display: none;
    }

    .panel-open .personal-style-name-row .style-save-btn {
        padding: 10px 12px;
    }
}

/* כאשר הפאנל רחב מספיק - הצגה מלאה */
.style-panel-container:not(.narrow) .style-save-btn .btn-text {
    display: inline;
}

/* Saved Styles List */
.personal-styles-list {
    border-top: 1px solid var(--border-light);
    padding-top: 16px;
}

.personal-styles-list h4 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 12px 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.personal-styles-list h4 i {
    color: var(--accent-primary);
}

.no-styles-msg {
    font-size: 13px;
    color: var(--text-muted);
    text-align: center;
    padding: 20px;
}

.saved-style-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 6px;
    margin-bottom: 8px;
}

.saved-style-name {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary);
}

.saved-style-actions {
    display: flex;
    gap: 4px;
}

.saved-style-actions button {
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: all 0.2s ease;
}

.saved-style-actions button:hover {
    background: var(--bg-hover);
    color: var(--accent-primary);
}

.saved-style-actions button:last-child:hover {
    color: #ef4444;
}

/* Preset Buttons Grid */
.style-presets-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.style-preset-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 16px 12px;
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
}

.style-preset-btn:hover {
    background: var(--bg-hover);
    border-color: var(--accent-primary);
    transform: translateY(-1px);
}

.style-preset-btn i {
    font-size: 20px;
    color: var(--accent-primary);
    margin-bottom: 8px;
}

.style-preset-btn span {
    font-size: 12px;
    font-weight: 500;
    color: var(--text-primary);
}

/* Scrollbar for settings list */
.style-settings-list::-webkit-scrollbar {
    width: 6px;
}

.style-settings-list::-webkit-scrollbar-track {
    background: var(--bg-secondary);
    border-radius: 3px;
}

.style-settings-list::-webkit-scrollbar-thumb {
    background: var(--border-medium);
    border-radius: 3px;
}

.style-settings-list::-webkit-scrollbar-thumb:hover {
    background: var(--border-strong);
}

/* Usage Badge */
.saved-style-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.usage-badge {
    font-size: 10px;
    color: var(--text-tertiary);
}

/* Style View Modal - צריך להיות מעל מודל הסגנון שלך */
.style-view-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10001;
    animation: fadeIn 0.2s ease;
}

.style-view-content {
    background: var(--bg-primary);
    border-radius: 12px;
    width: 90%;
    max-width: 600px;
    max-height: 80vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    animation: slideUp 0.3s ease;
}

.style-view-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border-light);
    background: var(--bg-secondary);
}

.style-view-header h3 {
    margin: 0;
    font-size: 18px;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
}

.style-view-header h3 i {
    color: var(--accent-primary);
}

.style-view-header .close-btn {
    background: none;
    border: none;
    font-size: 18px;
    color: var(--text-secondary);
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.style-view-header .close-btn:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

.style-view-body {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
}

.style-view-body .style-section {
    margin-bottom: 20px;
}

.style-view-body .style-section h4 {
    font-size: 14px;
    color: var(--accent-primary);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.style-view-body .sample-preview {
    background: var(--bg-secondary);
    padding: 12px;
    border-radius: 8px;
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.6;
    border: 1px solid var(--border-light);
}

.style-view-body .style-instructions {
    background: var(--bg-secondary);
    padding: 12px;
    border-radius: 8px;
    font-size: 13px;
    color: var(--text-primary);
    line-height: 1.8;
    white-space: pre-wrap;
    border: 1px solid var(--border-light);
}

.style-view-body .style-analysis {
    background: var(--bg-secondary);
    padding: 12px;
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.6;
    border: 1px solid var(--border-light);
}

.style-view-body .style-analysis p {
    margin: 8px 0;
    color: var(--text-secondary);
}

.style-view-body .style-analysis strong {
    color: var(--text-primary);
}

.style-view-body .style-meta {
    display: flex;
    gap: 20px;
    font-size: 12px;
    color: var(--text-tertiary);
    padding-top: 12px;
    border-top: 1px solid var(--border-light);
}

.style-view-body .style-meta span {
    display: flex;
    align-items: center;
    gap: 6px;
}

.style-view-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 20px;
    border-top: 1px solid var(--border-light);
    background: var(--bg-secondary);
}

.style-view-footer .apply-btn {
    background: var(--accent-primary);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.style-view-footer .apply-btn:hover {
    background: var(--accent-secondary);
}

.style-view-footer .cancel-btn {
    background: var(--bg-primary);
    color: var(--text-secondary);
    border: 1px solid var(--border-light);
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.style-view-footer .cancel-btn:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideDown {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(20px);
    }
}

/* ===================================
   Style Tune Panel - כוונן סגנון
   =================================== */

.style-tune-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
    height: 100%;
    overflow: hidden;
}

.style-tune-hint {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    background: linear-gradient(135deg, rgba(30, 58, 95, 0.08) 0%, rgba(30, 58, 95, 0.04) 100%);
    border-radius: 8px;
    border-right: 3px solid var(--accent-primary);
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.5;
    flex-shrink: 0;
}

.style-tune-hint i {
    color: var(--accent-primary);
    font-size: 14px;
    margin-top: 2px;
    flex-shrink: 0;
}

/* Scrollable settings area */
.style-tune-settings-scroll {
    flex: 1;
    overflow-y: auto;
    padding-left: 4px;
}

.style-tune-settings-scroll::-webkit-scrollbar {
    width: 6px;
}

.style-tune-settings-scroll::-webkit-scrollbar-track {
    background: transparent;
}

.style-tune-settings-scroll::-webkit-scrollbar-thumb {
    background: var(--border-medium);
    border-radius: 3px;
}

.style-tune-settings-scroll::-webkit-scrollbar-thumb:hover {
    background: var(--border-strong);
}

/* Settings list in style tune panel */
.style-tune-container .style-settings-list {
    max-height: none;
    overflow: visible;
}

/* Sticky footer with apply button */
.style-tune-sticky-footer {
    flex-shrink: 0;
    padding-top: 12px;
    border-top: 1px solid var(--border-light);
    background: var(--bg-panel);
}

.style-tune-sticky-footer .style-apply-btn {
    margin-top: 0;
}

/* ===================================
   OCR Result Preview - תצוגת תוצאת OCR
   =================================== */

.ocr-result-preview::-webkit-scrollbar {
    width: 6px;
}

.ocr-result-preview::-webkit-scrollbar-track {
    background: var(--bg-secondary);
    border-radius: 3px;
}

.ocr-result-preview::-webkit-scrollbar-thumb {
    background: var(--border-medium);
    border-radius: 3px;
}

.ocr-result-preview::-webkit-scrollbar-thumb:hover {
    background: var(--border-strong);
}

/* ===================================
   OCR File Preview - תצוגה מקדימה
   =================================== */

.ocr-file-preview {
    margin: 12px 0;
    padding: 12px;
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 8px;
    text-align: center;
}

.ocr-file-preview img {
    max-width: 100%;
    max-height: 200px;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    object-fit: contain;
}

.ocr-file-preview #ocrPdfPreview {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 20px;
    color: var(--text-secondary);
}

.ocr-file-preview #ocrPdfPreview i {
    font-size: 48px;
    color: #e74c3c;
}

.ocr-file-preview #ocrPdfPreview span {
    font-size: 14px;
    font-weight: 500;
}

/* =============================================
   CREATE TEXT PANEL - פאנל יצירת טקסט
   ============================================= */

.create-panel-container {
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Section */
.create-section {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Label */
.create-label {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 8px;
}

.create-label i {
    color: var(--primary-color, #1e3a5f);
    font-size: 13px;
}

/* Textarea */
.create-textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 10px;
    font-size: 14px;
    font-family: 'Heebo', sans-serif;
    line-height: 1.6;
    resize: vertical;
    transition: all 0.2s ease;
    background: var(--bg-primary, #ffffff);
    color: var(--text-primary, #1e293b);
}

.create-textarea:focus {
    outline: none;
    border-color: var(--primary-color, #1e3a5f);
    box-shadow: 0 0 0 3px rgba(30, 58, 95, 0.1);
}

.create-textarea::placeholder {
    color: var(--text-muted, #94a3b8);
}

.create-source-textarea {
    min-height: 100px;
}

/* Select / Dropdown */
.create-type-selector {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.create-select {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 10px;
    font-size: 14px;
    font-family: inherit;
    background: var(--bg-primary, #ffffff);
    color: var(--text-primary, #1e293b);
    cursor: pointer;
    transition: all 0.2s ease;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left 12px center;
    padding-left: 32px;
}

.create-select:focus {
    outline: none;
    border-color: var(--primary-color, #1e3a5f);
    box-shadow: 0 0 0 3px rgba(30, 58, 95, 0.1);
}

.create-select-small {
    padding: 8px 12px;
    font-size: 13px;
    border-radius: 8px;
    flex: 1;
    min-width: 120px;
}

/* Type Hint */
.create-type-hint {
    display: none;
    font-size: 12px;
    color: var(--text-secondary, #64748b);
    padding: 6px 10px;
    background: var(--bg-secondary, #f8fafc);
    border-radius: 6px;
}

.create-type-hint i {
    margin-left: 6px;
    color: var(--primary-color, #1e3a5f);
}

/* Collapsible Section */
.create-section-collapsible {
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 10px;
    overflow: hidden;
}

.create-collapse-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: var(--bg-secondary, #f8fafc);
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary, #64748b);
    transition: all 0.2s ease;
    font-family: inherit;
}

.create-collapse-toggle:hover {
    background: var(--bg-hover, #f1f5f9);
    color: var(--text-primary, #1e293b);
}

.create-collapse-toggle .collapse-icon {
    font-size: 10px;
    transition: transform 0.2s ease;
}

.create-source-content,
.create-settings-content {
    padding: 14px;
    background: var(--bg-primary, #ffffff);
    border-top: 1px solid var(--border-light, #e2e8f0);
}

.create-source-hint {
    font-size: 12px;
    color: var(--text-muted, #94a3b8);
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Settings Row */
.create-setting-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.create-setting-row:last-child {
    margin-bottom: 0;
}

.create-setting-row label {
    font-size: 13px;
    color: var(--text-secondary, #64748b);
    white-space: nowrap;
}

/* Generate Button */
.create-generate-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 14px 20px;
    background: linear-gradient(135deg, var(--primary-color, #1e3a5f) 0%, #2d4a6f 100%);
    color: white;
    border: none;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: inherit;
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.3);
}

.create-generate-btn:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(30, 58, 95, 0.4);
}

.create-generate-btn:active:not(:disabled) {
    transform: translateY(0);
}

.create-generate-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.create-generate-btn i {
    font-size: 16px;
}

/* Progress Section */
.create-progress-section {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: var(--bg-secondary, #f8fafc);
    border-radius: 10px;
}

.create-progress-section .progress-indicator {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--text-secondary, #64748b);
    font-size: 14px;
}

.create-progress-section .progress-spinner {
    width: 20px;
    height: 20px;
    border: 2px solid var(--border-light, #e2e8f0);
    border-top-color: var(--primary-color, #1e3a5f);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Result Section */
.create-result-section {
    border: 1px solid var(--success-light, #d1fae5);
    border-radius: 12px;
    overflow: hidden;
    background: var(--bg-primary, #ffffff);
}

.create-result-section .result-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    color: #047857;
    font-size: 14px;
    font-weight: 600;
}

.create-result-section .result-header i {
    font-size: 16px;
}

.create-result-preview {
    max-height: 250px;
    overflow-y: auto;
    padding: 16px;
    font-size: 14px;
    line-height: 1.7;
    color: var(--text-primary, #1e293b);
    white-space: pre-wrap;
    word-wrap: break-word;
    background: var(--bg-secondary, #f8fafc);
    border-top: 1px solid var(--border-light, #e2e8f0);
    border-bottom: 1px solid var(--border-light, #e2e8f0);
}

.create-result-section .result-actions {
    display: flex;
    gap: 8px;
    padding: 12px 16px;
    flex-wrap: wrap;
}

.create-result-section .result-btn {
    flex: 1;
    min-width: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 14px;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
}

.create-result-section .result-btn.primary {
    background: var(--primary-color, #1e3a5f);
    color: white;
}

.create-result-section .result-btn.primary:hover {
    background: #162d4a;
}

.create-result-section .result-btn.secondary {
    background: var(--bg-secondary, #f1f5f9);
    color: var(--text-secondary, #64748b);
}

.create-result-section .result-btn.secondary:hover {
    background: var(--bg-hover, #e2e8f0);
    color: var(--text-primary, #1e293b);
}

/* ===================================
   Index Table Styles (מפתחות לספר)
   =================================== */

.create-result-preview .index-table,
.create-result-preview table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    margin: 10px 0;
    direction: rtl;
}

.create-result-preview .index-table thead th,
.create-result-preview table thead th {
    background: var(--primary-color, #1e3a5f);
    color: white;
    padding: 10px 12px;
    text-align: right;
    font-weight: 600;
    position: sticky;
    top: 0;
}

.create-result-preview .index-table tbody td,
.create-result-preview table tbody td {
    padding: 8px 12px;
    border-bottom: 1px solid var(--border-light, #e2e8f0);
    vertical-align: top;
}

.create-result-preview .index-table tbody tr:nth-child(even),
.create-result-preview table tbody tr:nth-child(even) {
    background: var(--bg-secondary, #f8fafc);
}

.create-result-preview .index-table tbody tr:hover,
.create-result-preview table tbody tr:hover {
    background: var(--bg-hover, #e2e8f0);
}

.create-result-preview h3 {
    font-size: 15px;
    color: var(--primary-color, #1e3a5f);
    margin: 20px 0 10px 0;
    padding-bottom: 5px;
    border-bottom: 2px solid var(--primary-color, #1e3a5f);
}

.create-result-preview h3:first-child {
    margin-top: 0;
}

/* טבלה בעורך */
#textEditor .index-table,
#textEditor table {
    width: 100%;
    border-collapse: collapse;
    margin: 15px 0;
    direction: rtl;
}

#textEditor .index-table thead th,
#textEditor table thead th {
    background: var(--primary-color, #1e3a5f);
    color: white;
    padding: 10px 12px;
    text-align: right;
    font-weight: 600;
}

#textEditor .index-table tbody td,
#textEditor table tbody td {
    padding: 8px 12px;
    border: 1px solid var(--border-light, #e2e8f0);
}

#textEditor .index-table tbody tr:nth-child(even),
#textEditor table tbody tr:nth-child(even) {
    background: var(--bg-secondary, #f8fafc);
}

/* ===================================
   Basic Panel (עריכת ספרים) Styles
   =================================== */

.basic-panel-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow: visible;
    padding-top: 4px;
}

/* תיאור הפאנל - ללא מסגרת */
p.basic-panel-description {
    margin: 0 0 8px 0;
    font-size: 13px;
    color: var(--text-secondary, #64748b);
    line-height: 1.5;
    text-align: right;
}

/* כפתור עיבוד בסיסי - מרכזי ובולט */
.basic-primary-btn {
    width: 100%;
    padding: 16px 20px;
    background: linear-gradient(135deg, var(--primary-color, #1e3a5f) 0%, #2d4a6f 100%);
    color: white;
    border: none;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 1.2px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.2s ease;
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.25);
    font-family: 'Galil', 'Heebo', sans-serif;
}

.basic-primary-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(30, 58, 95, 0.35);
    background: linear-gradient(135deg, #2d4a6f 0%, #3d5a7f 100%);
}

.basic-primary-btn i {
    font-size: 18px;
}

/* כפתור הגדרות מתקדמות */
.basic-advanced-settings-btn {
    width: 100%;
    padding: 12px 16px;
    margin-top: 8px;
    background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
    color: var(--text-primary, #1e293b);
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
    font-family: 'Galil', 'Heebo', sans-serif;
    position: relative;
}

.basic-advanced-settings-btn::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    border-radius: 0 8px 8px 0;
}

.basic-advanced-settings-btn i {
    color: #f59e0b;
}

.basic-advanced-settings-btn:hover {
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
}

/* כפתור עיבוד בסיסי מפוצל - עם אייקון הגדרות בצד */
.basic-primary-split-btn {
    display: flex;
    width: 100%;
    border-radius: 10px;
    overflow: visible;
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.25);
}

.basic-primary-main-btn {
    flex: 1;
    padding: 16px 20px;
    background: linear-gradient(135deg, var(--primary-color, #1e3a5f) 0%, #2d4a6f 100%);
    color: white;
    border: none;
    border-radius: 0 10px 10px 0;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 1.2px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.2s ease;
    font-family: 'Galil', 'Heebo', sans-serif;
}

.basic-primary-main-btn:hover {
    background: linear-gradient(135deg, #2d4a6f 0%, #3d5a7f 100%);
}

.basic-primary-main-btn i {
    font-size: 18px;
}

.basic-primary-settings-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    background: linear-gradient(135deg, #2d4a6f 0%, #1e3a5f 100%);
    border: none;
    border-right: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px 0 0 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #f59e0b;
}

.basic-primary-settings-btn:hover {
    background: linear-gradient(135deg, #3d5a7f 0%, #2d4a6f 100%);
    color: #fbbf24;
}

.basic-primary-settings-btn i {
    font-size: 18px;
}

/* שורת כפתורים חצי רוחב */
.basic-half-row {
    display: flex;
    gap: 8px;
    width: 100%;
}

/* כפתור חצי רוחב */
.basic-half-btn {
    flex: 1;
    min-width: 0;
    padding: 10px 8px;
    font-size: 13px;
}

.basic-half-btn i {
    font-size: 14px;
}

.basic-half-btn span {
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* כפתור ברוחב מלא בתוך שורה */
.basic-half-btn.basic-full-btn {
    flex: 1 1 100%;
    max-width: 100%;
}

/* wrapper לדרופדאון בגודל חצי רוחב */
.basic-half-btn-wrapper {
    flex: 1;
    min-width: 0;
    position: relative;
}

/* כפתור דרופדאון בגודל חצי רוחב */
.basic-half-dropdown-btn {
    width: 100%;
    padding: 10px 8px !important;
    font-size: 13px !important;
    min-height: auto !important;
    border-radius: 8px !important;
}

.basic-half-dropdown-btn .btn-main-content {
    gap: 6px;
}

.basic-half-dropdown-btn .btn-main-content i {
    font-size: 14px;
}

.basic-half-dropdown-btn .btn-main-content span {
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.basic-half-dropdown-btn .dropdown-arrow {
    font-size: 10px;
}

/* כפתור מפוצל חצי רוחב - כמו עיבוד בסיסי */
.basic-half-split-btn {
    flex: 1;
    min-width: 0;
    display: flex;
    border-radius: 8px;
    overflow: visible;
    position: relative;
}

/* כפתור ראשי - חצי רוחב מפוצל */
.basic-half-main-btn {
    flex: 1;
    min-width: 0;
    padding: 7px 8px;
    background: var(--bg-primary, #ffffff);
    color: var(--text-primary, #1e293b);
    border: 1px solid var(--border-light, #e2e8f0);
    border-left: none;
    border-radius: 0 8px 8px 0;
    font-size: 13px;
    font-family: 'Galil', 'Heebo', sans-serif;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.basic-half-main-btn:hover {
    background: var(--bg-hover, #f1f5f9);
    border-color: var(--accent-primary, #1e3a5f);
    color: var(--accent-primary, #1e3a5f);
}

.basic-half-main-btn i {
    font-size: 14px;
}

.basic-half-main-btn span {
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* כפתור חץ - חצי רוחב מפוצל */
.basic-half-arrow-btn {
    width: 32px;
    min-width: 32px;
    padding: 7px 0;
    background: var(--bg-primary, #ffffff);
    color: var(--text-muted, #64748b);
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 8px 0 0 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.basic-half-arrow-btn:hover {
    background: var(--bg-hover, #f1f5f9);
    border-color: var(--accent-primary, #1e3a5f);
    color: var(--accent-primary, #1e3a5f);
}

.basic-half-arrow-btn i {
    font-size: 11px;
}

/* תפריט הדרופדאון - באותו רוחב של הכפתור המפוצל */
.basic-split-menu {
    left: 0;
    right: 0 !important;
    width: 100%;
    z-index: 1000;
}

/* שורת כפתורי אייקון */
.basic-icon-row {
    display: flex;
    gap: 6px;
    width: 100%;
    justify-content: center;
}

/* כפתור אייקון קטן */
.basic-icon-btn {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border: 1px solid var(--border-light, #e2e8f0);
    background: var(--bg-primary, #ffffff);
    color: var(--text-secondary, #475569);
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    transition: all 0.2s ease;
    position: relative;
}

.basic-icon-btn:hover:not(.disabled) {
    background: var(--bg-hover, #f1f5f9);
    color: var(--accent-primary, #1e3a5f);
    border-color: var(--accent-primary, #1e3a5f);
    transform: translateY(-1px);
}

.basic-icon-btn.disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* טולטיפ לכפתורי אייקון */
.basic-icon-btn[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    top: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--text-primary, #1e293b);
    color: white;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 12px;
    font-family: 'Galil', 'Heebo', sans-serif;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    pointer-events: none;
    z-index: 999999;
}

.basic-icon-btn[data-tooltip]:hover::after {
    opacity: 1;
    visibility: visible;
}

/* בוקס מתרחב (collapsible) בפאנל עיבוד בסיסי */
.basic-collapsible-container {
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 8px;
}

.basic-collapsible-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--border-light, #e2e8f0);
    background: var(--bg-primary, #ffffff);
    border-radius: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary, #1e293b);
    transition: all 0.2s ease;
    font-family: 'Galil', 'Heebo', sans-serif;
}

.basic-collapsible-header:hover {
    background: var(--bg-hover, #f1f5f9);
    border-color: var(--accent-primary, #1e3a5f);
}

.basic-collapsible-header .btn-main-content {
    display: flex;
    align-items: center;
    gap: 10px;
}

.basic-collapsible-header .btn-main-content i {
    color: var(--accent-primary, #1e3a5f);
    font-size: 14px;
}

.basic-collapsible-header .collapsible-arrow {
    color: var(--text-muted, #64748b);
    font-size: 12px;
    transition: transform 0.3s ease;
}

.basic-collapsible-header .collapsible-arrow.rotated {
    transform: rotate(180deg);
}

.basic-collapsible-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
    background: var(--bg-secondary, #f8fafc);
    border: 1px solid var(--border-light, #e2e8f0);
    border-top: none;
    border-radius: 0 0 10px 10px;
    padding: 0 10px;
}

.basic-collapsible-content.open {
    max-height: 300px;
    padding: 10px;
}

/* הסתרת הגבולות העליונים של ה-collapsible-content כשפתוח */
.basic-collapsible-container:has(.basic-collapsible-content.open) .basic-collapsible-header {
    border-radius: 10px 10px 0 0;
    border-bottom-color: transparent;
}

/* קו מפריד */
.basic-separator {
    border: none;
    border-top: 1px solid var(--border-light, #e2e8f0);
    margin: 8px 0 4px 0; /* צמצום המרחק */
}

/* כותרת סגמנט בפאנל עיבוד בסיסי */
.basic-section-title {
    font-size: 12px;
    font-weight: 500;
    color: var(--text-secondary, #64748b);
    margin: 0 0 6px 0; /* צמצום המרחק */
    padding: 0;
    text-align: right;
    font-family: 'Galil', 'Heebo', sans-serif;
}

/* סגנון לפריט dropdown מושבת */
.dropdown-item.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

/* כפתורים בגודל רגיל */
.basic-regular-buttons {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
}

/* כפתורים קטנים */
.basic-small-buttons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.basic-small-btn {
    padding: 10px 12px;
    background: var(--bg-primary, #ffffff);
    color: var(--text-primary, #1e293b);
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 6px;
    font-size: 12px;
    font-weight: 400;
    cursor: pointer;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 6px;
    transition: all 0.2s ease;
    font-family: 'Galil', 'Heebo', sans-serif;
    text-align: right;
}

.basic-small-btn i {
    flex-shrink: 0;
    margin-top: 2px;
}

.basic-small-btn span {
    text-align: right;
    flex: 1;
}

.basic-small-btn:hover {
    background: var(--bg-hover, #f1f5f9);
    border-color: var(--accent-primary, #1e3a5f);
    color: var(--accent-primary, #1e3a5f);
}

.basic-small-btn i {
    font-size: 12px;
    color: var(--text-muted, #94a3b8);
}

.basic-small-btn:hover i {
    color: var(--accent-primary, #1e3a5f);
}

/* כפתור קטן מושבת */
.basic-small-btn.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    background: var(--bg-secondary, #f8fafc);
}

.basic-small-btn.disabled:hover {
    background: var(--bg-secondary, #f8fafc);
    border-color: var(--border-light, #e2e8f0);
    color: var(--text-primary, #1e293b);
    transform: none;
}

.basic-small-btn.disabled:hover i {
    color: var(--text-muted, #94a3b8);
}

/* ===================================
   Editing Panel - Advanced Editing with Dropdowns
   פאנל עריכה מתקדמת עם כפתורי dropdown
   =================================== */

.editing-panel-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
}

.editing-panel-description {
    font-size: 13px;
    color: var(--text-muted, #64748b);
    margin: 0 0 8px 0;
    text-align: center;
}

/* כפתור רגיל בפאנל עריכה */
.editing-tool-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 12px 14px;
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 13px;
    color: var(--text-primary, #1e293b);
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: normal;
}

.editing-tool-btn:hover {
    background: var(--bg-hover, #f1f5f9);
    border-color: var(--accent-primary, #1e3a5f);
    transform: translateX(-2px);
}

.editing-tool-btn i {
    font-size: 16px;
    color: var(--accent-primary, #1e3a5f);
    width: 20px;
    text-align: center;
}

/* קונטיינר לדרופדאון */
.editing-dropdown-container {
    position: relative;
    width: 100%;
}

/* כפתור מפוצל (split button) */
.editing-split-btn {
    display: flex;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--border-light, #e2e8f0);
}

.editing-main-btn {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: var(--bg-primary, #ffffff);
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 13px;
    color: var(--text-primary, #1e293b);
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: normal;
}

.editing-main-btn:hover {
    background: var(--bg-hover, #f1f5f9);
}

.editing-main-btn i {
    font-size: 16px;
    color: var(--accent-primary, #1e3a5f);
    width: 20px;
    text-align: center;
}

.editing-dropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    background: var(--bg-primary, #ffffff);
    border: none;
    border-right: 1px solid var(--border-light, #e2e8f0);
    cursor: pointer;
    transition: all 0.2s ease;
    color: var(--text-muted, #64748b);
}

.editing-dropdown-toggle:hover {
    background: var(--bg-hover, #f1f5f9);
    color: var(--accent-primary, #1e3a5f);
}

/* כפתור דרופדאון מלא (לכוונן סגנון ושנה טון) */
.editing-dropdown-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 12px 14px;
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 13px;
    color: var(--text-primary, #1e293b);
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: normal;
}

.editing-dropdown-btn:hover {
    background: var(--bg-hover, #f1f5f9);
    border-color: var(--accent-primary, #1e3a5f);
}

.editing-dropdown-btn .btn-main-content {
    display: flex;
    align-items: center;
    gap: 10px;
}

.editing-dropdown-btn .btn-main-content i {
    font-size: 16px;
    color: var(--accent-primary, #1e3a5f);
    width: 20px;
    text-align: center;
}

.editing-dropdown-btn .dropdown-arrow {
    font-size: 12px;
    color: var(--text-muted, #64748b);
    transition: transform 0.2s ease;
}

/* תפריט dropdown */
.editing-dropdown-menu {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    left: 0;
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.2s ease;
    overflow: visible;
}

.editing-dropdown-menu.open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* כותרת סקשן בדרופדאון */
.dropdown-section-title {
    padding: 10px 14px 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-muted, #64748b);
    display: flex;
    align-items: center;
    gap: 6px;
}

.dropdown-section-title i {
    font-size: 11px;
}

.dropdown-section-divider {
    height: 1px;
    background: var(--border-light, #e2e8f0);
    margin: 6px 0;
}

/* פריט בדרופדאון */
.dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 14px;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: all 0.15s ease;
    font-size: 13px;
    color: var(--text-primary, #1e293b);
    text-align: right;
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: normal;
}

.dropdown-item:hover {
    background: var(--bg-hover, #f1f5f9);
}

.dropdown-item i {
    font-size: 14px;
    color: var(--accent-primary, #1e3a5f);
    width: 18px;
    text-align: center;
}

/* קו מפריד בתוך dropdown */
.dropdown-divider {
    height: 1px;
    background: var(--border-color, #e2e8f0);
    margin: 6px 10px;
}

/* שדה קלט מותאם אישית ב-dropdown */
.dropdown-custom-input {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-top: 1px solid var(--border-color, #e2e8f0);
    margin-top: 4px;
}

.custom-language-input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 6px;
    font-size: 13px;
    font-family: inherit;
    background: var(--bg-primary, white);
    color: var(--text-primary, #1e293b);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.custom-language-input:focus {
    outline: none;
    border-color: var(--accent-primary, #1e3a5f);
    box-shadow: 0 0 0 3px rgba(30, 58, 95, 0.1);
}

.custom-language-input::placeholder {
    color: var(--text-muted, #94a3b8);
}

.custom-language-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    background: var(--accent-primary, #1e3a5f);
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.custom-language-btn:hover {
    background: var(--accent-hover, #2d4a6f);
    transform: scale(1.05);
}

.custom-language-btn i {
    font-size: 14px;
    color: white;
    width: auto;
}

/* טולטיפים מותאמים - כל הכפתורים והפריטים - מופיעים למטה */
/* צבעים הפוכים: רקע לבן וטקסט כחול כהה */
.panel-tool-btn[data-tooltip],
.basic-primary-main-btn[data-tooltip],
.basic-primary-settings-btn[data-tooltip],
.editing-dropdown-btn[data-tooltip],
.dropdown-item[data-tooltip] {
    position: relative;
}

/* כשמרחפים על כפתור, הוא עולה מעל השאר כדי שהטולטיפ לא יוסתר */
.panel-tool-btn[data-tooltip]:hover,
.basic-primary-main-btn[data-tooltip]:hover,
.basic-primary-settings-btn[data-tooltip]:hover,
.editing-dropdown-btn[data-tooltip]:hover,
.dropdown-item[data-tooltip]:hover {
    z-index: 999998 !important;
    position: relative;
}

.panel-tool-btn[data-tooltip]::after,
.editing-dropdown-btn[data-tooltip]::after,
.dropdown-item[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    top: calc(100% + 8px);
    bottom: auto;
    right: 50%;
    transform: translateX(50%);
    width: max-content;
    max-width: 200px;
    background: white;
    color: var(--primary-color, #1e3a5f);
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: 0.5px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    pointer-events: none;
    z-index: 999999;
    box-shadow: 0 4px 16px rgba(30, 58, 95, 0.25);
    border: 1px solid var(--border-light, #e2e8f0);
    white-space: normal;
    text-align: center;
    line-height: 1.5;
}

/* טולטיפים לכפתור המפוצל - מופיעים למטה */
.basic-primary-main-btn[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    top: calc(100% + 8px);
    bottom: auto;
    right: 50%;
    transform: translateX(50%);
    width: max-content;
    max-width: 200px;
    background: white;
    color: var(--primary-color, #1e3a5f);
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: 0.5px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    pointer-events: none;
    z-index: 9999999;
    box-shadow: 0 4px 16px rgba(30, 58, 95, 0.25);
    border: 1px solid var(--border-light, #e2e8f0);
    white-space: normal;
    text-align: center;
    line-height: 1.5;
}

/* טולטיפ לכפתור הגדרות - ממוקם ימינה כדי לא להיחתך בצד שמאל */
.basic-primary-settings-btn[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    top: calc(100% + 8px);
    bottom: auto;
    left: 0;
    right: auto;
    transform: none;
    width: max-content;
    max-width: 200px;
    background: white;
    color: var(--primary-color, #1e3a5f);
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: 0.5px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    pointer-events: none;
    z-index: 9999999;
    box-shadow: 0 4px 16px rgba(30, 58, 95, 0.25);
    border: 1px solid var(--border-light, #e2e8f0);
    white-space: normal;
    text-align: center;
    line-height: 1.5;
}

.panel-tool-btn[data-tooltip]:hover::after,
.editing-dropdown-btn[data-tooltip]:hover::after,
.dropdown-item[data-tooltip]:hover::after {
    opacity: 1;
    visibility: visible;
    top: calc(100% + 12px);
    bottom: auto;
}

.basic-primary-main-btn[data-tooltip]:hover::after {
    opacity: 1;
    visibility: visible;
    top: calc(100% + 12px);
    bottom: auto;
}

.basic-primary-settings-btn[data-tooltip]:hover::after {
    opacity: 1;
    visibility: visible;
    top: calc(100% + 12px);
    bottom: auto;
    left: 0;
    right: auto;
}

/* חץ קטן מעל לטולטיפ - מצביע למעלה */
.panel-tool-btn[data-tooltip]::before,
.editing-dropdown-btn[data-tooltip]::before,
.dropdown-item[data-tooltip]::before {
    content: '';
    position: absolute;
    top: calc(100% + 2px);
    bottom: auto;
    right: 50%;
    transform: translateX(50%);
    border: 6px solid transparent;
    border-bottom-color: white;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    z-index: 999999;
}

/* חץ לכפתור המפוצל - מופיע למעלה כי הטולטיפ למטה */
.basic-primary-main-btn[data-tooltip]::before {
    content: '';
    position: absolute;
    top: calc(100% + 2px);
    bottom: auto;
    right: 50%;
    transform: translateX(50%);
    border: 6px solid transparent;
    border-bottom-color: white;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    z-index: 9999999;
}

/* חץ לכפתור הגדרות - ממוקם ימינה */
.basic-primary-settings-btn[data-tooltip]::before {
    content: '';
    position: absolute;
    top: calc(100% + 2px);
    bottom: auto;
    left: 15px;
    right: auto;
    transform: none;
    border: 6px solid transparent;
    border-bottom-color: white;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    z-index: 9999999;
}

.panel-tool-btn[data-tooltip]:hover::before,
.editing-dropdown-btn[data-tooltip]:hover::before,
.dropdown-item[data-tooltip]:hover::before {
    opacity: 1;
    visibility: visible;
    top: calc(100% + 6px);
    bottom: auto;
}

.basic-primary-main-btn[data-tooltip]:hover::before {
    opacity: 1;
    visibility: visible;
    top: calc(100% + 6px);
    bottom: auto;
}

.basic-primary-settings-btn[data-tooltip]:hover::before {
    opacity: 1;
    visibility: visible;
    top: calc(100% + 6px);
    bottom: auto;
    left: 15px;
    right: auto;
}

/* הסתרת טולטיפ של כפתור dropdown כשהוא פתוח */
.editing-dropdown-container:has(.editing-dropdown-menu.open) .editing-dropdown-btn[data-tooltip]::after,
.editing-dropdown-container:has(.editing-dropdown-menu.open) .editing-dropdown-btn[data-tooltip]::before {
    display: none !important;
}

/* דרופדאון כוונן סגנון - עם מחוונים */
.style-tune-dropdown {
    padding: 12px;
    min-width: 280px;
}

.style-tune-compact {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.compact-setting-item {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.compact-setting-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.compact-setting-title {
    font-size: 12px;
    font-weight: 500;
    color: var(--text-secondary, #475569);
    display: flex;
    align-items: center;
    gap: 6px;
}

.compact-setting-title i {
    font-size: 11px;
    color: var(--accent-primary, #1e3a5f);
}

.compact-setting-value {
    font-size: 11px;
    color: var(--accent-primary, #1e3a5f);
    font-weight: 600;
    background: var(--bg-secondary, #f8fafc);
    padding: 2px 8px;
    border-radius: 4px;
}

.compact-slider {
    width: 100%;
    height: 4px;
    -webkit-appearance: none;
    appearance: none;
    background: var(--border-light, #e2e8f0);
    border-radius: 2px;
    outline: none;
    cursor: pointer;
}

.compact-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    background: var(--accent-primary, #1e3a5f);
    border-radius: 50%;
    cursor: pointer;
    transition: transform 0.15s ease;
}

.compact-slider::-webkit-slider-thumb:hover {
    transform: scale(1.2);
}

.compact-slider::-moz-range-thumb {
    width: 14px;
    height: 14px;
    background: var(--accent-primary, #1e3a5f);
    border-radius: 50%;
    border: none;
    cursor: pointer;
}

/* כפתור החל סגנון בדרופדאון */
.style-apply-compact-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 10px 14px;
    margin-top: 12px;
    background: var(--accent-primary, #1e3a5f);
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.style-apply-compact-btn:hover {
    background: #2d4a6f;
    transform: translateY(-1px);
}

.style-apply-compact-btn i {
    font-size: 14px;
}

/* מפריד בין קבוצות כפתורים */
.editing-separator {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--border-light, #e2e8f0) 20%, var(--border-light, #e2e8f0) 80%, transparent 100%);
    margin: 12px 0;
}

/* כפתורים משניים (מקורות, ביאור, הערה) - בסגנון primary כמו "עיבוד בסיסי" */
.editing-secondary-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 14px 16px;
    background: linear-gradient(135deg, var(--primary-color, #1e3a5f) 0%, #2d4a6f 100%);
    color: white;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.2);
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: normal;
}

.editing-secondary-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.3);
    background: linear-gradient(135deg, #2d4a6f 0%, #3d5a7f 100%);
}

.editing-secondary-btn i {
    font-size: 16px;
    width: 20px;
    text-align: center;
}

/* כפתור סגנון בהתאמה אישית */
.editing-custom-style-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 14px 20px;
    background: linear-gradient(135deg, var(--primary-color, #1e3a5f) 0%, #2d4a6f 100%);
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.3);
    font-family: 'Galil', 'Heebo', sans-serif;
    letter-spacing: normal;
    margin-top: 8px;
}

.editing-custom-style-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.4);
    background: linear-gradient(135deg, #2d4a6f 0%, #3d5a7f 100%);
}

.editing-custom-style-btn i {
    font-size: 16px;
}

/* מודל סגנון בהתאמה אישית */
.style-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    backdrop-filter: blur(4px);
}

.custom-style-modal {
    background: white;
    border-radius: 16px;
    width: 90%;
    max-width: 500px;
    max-height: 85vh;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: modalSlideIn 0.3s ease;
}

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translateY(-20px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.style-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: linear-gradient(135deg, var(--primary-color, #1e3a5f) 0%, #2d4a6f 100%);
    color: white;
}

.style-modal-header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
}

.style-modal-header h3 i {
    color: #f59e0b;
}

.style-modal-close {
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: white;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.style-modal-close:hover {
    background: rgba(255, 255, 255, 0.2);
}

.style-modal-body {
    padding: 20px;
    max-height: calc(85vh - 70px);
    overflow-y: auto;
}

.style-modal-body .style-hint {
    color: var(--text-secondary, #64748b);
    font-size: 13px;
    line-height: 1.6;
    margin-bottom: 16px;
}

.style-modal-body .personal-style-create textarea {
    min-height: 120px;
}

.style-modal-body .personal-styles-list {
    margin-top: 20px;
}

.loading-styles {
    text-align: center;
    padding: 20px;
    color: var(--text-muted, #94a3b8);
}

/* ===================================
   PDF Source Upload - יצירה ממקורות PDF
   =================================== */

/* טאבים לבחירת סוג מקור */
.source-type-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
    background: var(--bg-secondary, #f1f5f9);
    padding: 4px;
    border-radius: 8px;
}

.source-type-tab {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 12px;
    background: transparent;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary, #64748b);
    cursor: pointer;
    transition: all 0.2s ease;
}

.source-type-tab:hover {
    color: var(--primary-color, #1e3a5f);
    background: rgba(30, 58, 95, 0.08);
}

.source-type-tab.active {
    background: white;
    color: var(--primary-color, #1e3a5f);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.source-type-tab i {
    font-size: 14px;
}

/* אזור העלאת PDF */
.pdf-upload-zone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    border: 2px dashed var(--border-color, #e2e8f0);
    border-radius: 12px;
    background: var(--bg-secondary, #f8fafc);
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
}

.pdf-upload-zone:hover {
    border-color: var(--primary-color, #1e3a5f);
    background: rgba(30, 58, 95, 0.04);
}

.pdf-upload-zone.dragover {
    border-color: var(--accent-color, #f59e0b);
    background: rgba(245, 158, 11, 0.08);
    transform: scale(1.01);
}

.pdf-upload-zone .upload-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ef4444, #dc2626);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}

.pdf-upload-zone .upload-icon i {
    font-size: 22px;
    color: white;
}

.pdf-upload-zone .upload-text {
    color: var(--text-secondary, #64748b);
}

.pdf-upload-zone .upload-text strong {
    display: block;
    color: var(--text-primary, #1e293b);
    font-size: 14px;
    margin-bottom: 4px;
}

.pdf-upload-zone .upload-text p {
    margin: 0;
    font-size: 12px;
}

/* מידע על קובץ שנבחר */
.pdf-file-info {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: linear-gradient(135deg, #fef2f2, #fee2e2);
    border: 1px solid #fecaca;
    border-radius: 10px;
}

.pdf-file-info .file-icon {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: #ef4444;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.pdf-file-info .file-icon i {
    font-size: 18px;
    color: white;
}

.pdf-file-info .file-details {
    flex: 1;
    min-width: 0;
}

.pdf-file-info .file-name {
    display: block;
    font-weight: 500;
    color: var(--text-primary, #1e293b);
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pdf-file-info .file-size {
    display: block;
    font-size: 11px;
    color: var(--text-secondary, #64748b);
    margin-top: 2px;
}

.pdf-file-info .file-remove-btn {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: none;
    background: rgba(239, 68, 68, 0.15);
    color: #ef4444;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.pdf-file-info .file-remove-btn:hover {
    background: #ef4444;
    color: white;
}

/* אזור תוכן המקור */
.source-input-area {
    animation: fadeIn 0.2s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===================================
   Nikud Result Panel - פאנל תוצאות ניקוד
   =================================== */

.nikud-result-panel {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 4px;
}

/* 🆕 פאנל הניקוד בפריסת tc-left-layout (כמו "עיבוד בסיסי"):
   ריווח/שוליים זהים לפאנל עיבוד בסיסי, והתוכן מתרחב לגובה המלא */
.panel-inline-results.tc-left-layout .nikud-result-panel {
    gap: 8px;
    padding: 0;
    flex: 1 1 auto;
    min-height: 0;
}
.tc-left-layout .nikud-success-header {
    flex-shrink: 0;
}

.nikud-success-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px;
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: white;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
}

.nikud-success-header i {
    font-size: 18px;
}

.nikud-partial-badge {
    margin-right: auto;
    padding: 2px 8px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    font-size: 11px;
}

.nikud-original-section {
    background: var(--bg-secondary, #f8fafc);
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 8px;
    overflow: hidden;
}

.nikud-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: var(--bg-hover, #f1f5f9);
    border-bottom: 1px solid var(--border-light, #e2e8f0);
}

.nikud-section-title {
    font-size: 12px;
    font-weight: 500;
    color: var(--text-secondary, #475569);
}

.nikud-close-btn {
    width: 24px;
    height: 24px;
    border: none;
    background: transparent;
    color: var(--text-muted, #64748b);
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.nikud-close-btn:hover {
    background: var(--border-light, #e2e8f0);
    color: var(--text-primary, #1e293b);
}

.nikud-original-box {
    padding: 12px;
    max-height: 200px;
    overflow-y: auto;
}

.nikud-original-text {
    font-family: 'Heebo', 'Tahoma', 'Arial', sans-serif;
    font-size: 14px;
    line-height: 1.8;
    color: var(--text-primary, #1e293b);
    white-space: pre-wrap;
    word-break: break-word;
}

.nikud-actions {
    display: flex;
    gap: 6px;
    padding: 8px 12px;
    border-top: 1px solid var(--border-light, #e2e8f0);
    background: var(--bg-primary, #ffffff);
}

.nikud-action-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 12px;
    border: 1px solid var(--border-light, #e2e8f0);
    background: var(--bg-primary, #ffffff);
    color: var(--text-secondary, #475569);
    border-radius: 6px;
    font-size: 12px;
    font-family: 'Galil', 'Heebo', sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.nikud-action-btn:hover {
    background: var(--bg-hover, #f1f5f9);
    border-color: var(--border-medium, #cbd5e1);
}

.nikud-action-btn i {
    font-size: 12px;
}

/* כפתור ביטול */
.nikud-undo-btn:hover {
    background: #fef3c7;
    border-color: #f59e0b;
    color: #d97706;
}

/* כפתור השוואה */
.nikud-compare-btn.active {
    background: var(--accent-primary, #1e3a5f);
    border-color: var(--accent-primary, #1e3a5f);
    color: white;
}

/* כפתור העתקה */
.nikud-copy-btn.copied {
    background: #d1fae5;
    border-color: #10b981;
    color: #059669;
}

/* תצוגת השוואה - Track Changes Style
   🆕 font: inherit - בפאנל היא יושבת בתוך .corrected-text-content שמקבל את פונט העורך inline
   (כמו בעיבוד בסיסי); בצ'אט היא יורשת את פונט הצ'אט. */
.nikud-comparison {
    font-family: inherit;
    font-size: inherit;
    line-height: 1.8;
    color: inherit;
    white-space: pre-wrap;
    word-break: break-word;
}

/* שינוי בודד בניקוד - כמו Track Changes */
.nikud-change-pair {
    position: relative;
    display: inline;
    cursor: pointer;
    border-radius: 3px;
    transition: all 0.2s ease;
}

.nikud-change-pair:hover {
    background-color: rgba(59, 130, 246, 0.1);
}

/* מילה מקורית (נמחקה) - 🆕 פונט יורש מהמכל (פונט העורך בפאנל) */
.nikud-delete {
    background-color: #fee2e2;
    color: #991b1b;
    text-decoration: line-through;
    padding: 1px 3px;
    border-radius: 2px;
    font-family: inherit;
}

/* מילה עם ניקוד (חדשה) - 🆕 פונט יורש מהמכל (פונט העורך בפאנל) */
.nikud-insert {
    background-color: #dcfce7;
    color: #166534;
    padding: 1px 3px;
    border-radius: 2px;
    font-family: inherit;
}

/* כפתור דחייה לשינוי בודד */
.nikud-reject-btn {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 16px;
    height: 16px;
    background: #ef4444;
    color: white;
    border: none;
    border-radius: 50%;
    font-size: 10px;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    z-index: 10;
}

.nikud-change-pair:hover .nikud-reject-btn {
    display: flex;
}

.nikud-reject-btn:hover {
    background: #dc2626;
    transform: scale(1.1);
}

/* שינוי שנדחה */
.nikud-change-pair.rejected .nikud-delete {
    background-color: #fef9c3 !important;
    color: #92400e;
    text-decoration: none;
}

.nikud-change-pair.rejected .nikud-insert {
    background-color: #e5e7eb !important;
    color: #6b7280;
    text-decoration: line-through;
    opacity: 0.6;
}

/* 🆕 שורת סיום בפאנל הניקוד - "סיים" בעיצוב "סיים וסגור" של עיבוד בסיסי, ו"בטל" קטן לידו */
.nikud-footer-actions {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 2px 12px 12px;
}
.nikud-footer-actions .tc-original-close-btn {
    flex: 1 1 auto;
    margin: 0;
}
.nikud-undo-small {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 8px 10px;
    font-size: 11.5px;
    font-weight: 600;
    font-family: inherit;
    color: var(--text-secondary, #64748b);
    background: transparent;
    border: 1px solid var(--border-light, #e2e8f0);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
}
.nikud-undo-small:hover {
    background: #fef3c7;
    border-color: #f59e0b;
    color: #d97706;
}
.nikud-undo-small i { font-size: 10px; }

/* 🆕 כפתור "העתק" בתוך קופסת הטקסט (מקורי/השוואה) - פינה שמאלית עליונה, צף מעל התוכן */
.nikud-result-panel .corrected-text-panel { position: relative; }
.nikud-result-panel .corrected-text-panel .nikud-copy-in-box {
    position: absolute;
    top: 6px;
    left: 18px;
    z-index: 5;
    background: rgba(255, 255, 255, 0.92);
}

.nikud-word-changed {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
    color: #1e40af;
    padding: 1px 4px;
    border-radius: 3px;
    cursor: help;
}

/* ===================================
   WORKSTATION PANEL - Tab System
   מערכת טאבים Chrome-like
   =================================== */

.workstation-container {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Tabs Container - צמוד לראש הפאנל */
.workstation-tabs-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-top: -8px; /* צמוד יותר לראש */
}

/* אזור תוכן הטאבים */
#workstation-tab-content-area {
    padding-top: 12px; /* רווח בין הטאבים לכפתור הראשון */
}

/* Tabs Header - Chrome Style */
.workstation-tabs {
    display: flex;
    background: var(--panel-header-bg, #f8fafc);
    border-bottom: 2px solid var(--border-color, #e2e8f0);
    padding: 0;
    gap: 0;
    flex-shrink: 0;
}

.workstation-tab {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px 8px;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    color: var(--text-secondary, #64748b);
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.workstation-tab i {
    font-size: 14px;
}

.workstation-tab:hover {
    color: var(--text-primary, #1e293b);
    background: var(--hover-bg, rgba(0, 0, 0, 0.04));
}

.workstation-tab.active {
    color: #1e3a5f;
    border-bottom-color: #1e3a5f;
    font-weight: 600;
    background: var(--bg-primary, #ffffff);
}

/* Tab Content */
.workstation-tab-content {
    display: none;
    padding: 16px;
    overflow-y: auto;
    flex: 1;
    animation: fadeInTab 0.2s ease;
}

.workstation-tab-content.active {
    display: block;
}

@keyframes fadeInTab {
    from {
        opacity: 0;
        transform: translateY(5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Tools Grid */
.workstation-tools-grid {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.workstation-tools-grid .panel-tool-btn {
    width: 100%;
    justify-content: flex-start;
    padding: 12px 16px;
    border-radius: 8px;
}

.workstation-tools-grid .panel-tool-btn.primary-tool {
    background: linear-gradient(135deg, var(--primary-color, #3b82f6) 0%, var(--primary-hover, #2563eb) 100%);
    color: white;
    font-weight: 600;
}

.workstation-tools-grid .panel-tool-btn.primary-tool:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

/* Tools Separator */
.tools-separator {
    display: flex;
    align-items: center;
    margin: 12px 0 8px 0;
    color: var(--text-tertiary, #94a3b8);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tools-separator::before,
.tools-separator::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--border-color, #e2e8f0);
}

.tools-separator span {
    padding: 0 10px;
}

/* Style Tab - Dropdown Styles */
.workstation-style-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.style-dropdown-container {
    position: relative;
}

.style-dropdown-btn {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: var(--bg-secondary, #f8fafc);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    cursor: pointer;
    color: var(--text-primary, #1e293b);
    font-size: 14px;
    transition: all 0.2s ease;
}

.style-dropdown-btn:hover {
    background: var(--hover-bg, #f1f5f9);
    border-color: var(--primary-color, #3b82f6);
}

.style-dropdown-btn .dropdown-arrow {
    margin-right: auto;
    transition: transform 0.2s ease;
}

.style-dropdown-container.open .dropdown-arrow {
    transform: rotate(180deg);
}

.style-dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    z-index: 100;
    margin-top: 4px;
    max-height: 250px;
    overflow-y: auto;
}

.style-dropdown-container.open .style-dropdown-menu {
    display: block;
    animation: dropdownFadeIn 0.2s ease;
}

@keyframes dropdownFadeIn {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.style-dropdown-item {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--text-primary, #1e293b);
    font-size: 13px;
    text-align: right;
    transition: background 0.15s ease;
}

.style-dropdown-item:hover {
    background: var(--hover-bg, #f1f5f9);
}

.style-dropdown-item:first-child {
    border-radius: 7px 7px 0 0;
}

.style-dropdown-item:last-child {
    border-radius: 0 0 7px 7px;
}

.style-tune-btn,
.custom-style-btn {
    margin-top: 8px;
}

/* ===================================
   MY SPACE PANEL
   פאנל המרחב האישי
   =================================== */

.myspace-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 8px 0;
}

.myspace-section {
    background: var(--bg-secondary, #f8fafc);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 12px;
    padding: 16px;
}

.myspace-section-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border-color, #e2e8f0);
}

.myspace-section-header i {
    color: var(--primary-color, #3b82f6);
    font-size: 16px;
}

.myspace-section-header h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary, #1e293b);
    flex: 1;
}

.myspace-refresh-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 6px;
    color: var(--text-muted, #94a3b8);
    font-size: 12px;
    border-radius: 4px;
    transition: all 0.2s ease;
    margin-right: auto;
}

.myspace-refresh-btn:hover {
    color: var(--primary-color, #3b82f6);
    background-color: var(--hover-bg, rgba(59, 130, 246, 0.1));
}

.myspace-refresh-btn:active i {
    animation: spin 0.5s linear;
}

.myspace-hint {
    font-size: 12px;
    color: var(--text-tertiary, #94a3b8);
    margin: 0 0 10px 0;
}

.myspace-list {
    min-height: 60px;
    margin-bottom: 10px;
}

.myspace-empty-state {
    text-align: center;
    padding: 16px;
    color: var(--text-tertiary, #94a3b8);
}

.myspace-empty-state i {
    font-size: 24px;
    margin-bottom: 8px;
    opacity: 0.5;
}

.myspace-empty-state p {
    margin: 0;
    font-size: 13px;
}

.myspace-empty-state small {
    display: block;
    margin-top: 4px;
    font-size: 11px;
}

.myspace-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    margin-bottom: 6px;
    transition: all 0.2s ease;
}

.myspace-item:hover {
    border-color: var(--primary-color, #3b82f6);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.myspace-item-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.myspace-item-name {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary, #1e293b);
}

.myspace-item-info small {
    font-size: 11px;
    color: var(--text-tertiary, #94a3b8);
}

.myspace-item-actions {
    display: flex;
    gap: 4px;
}

.myspace-item-btn {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 6px;
    cursor: pointer;
    color: var(--text-secondary, #64748b);
    transition: all 0.2s ease;
}

.myspace-item-btn:hover {
    background: var(--hover-bg, #f1f5f9);
    color: var(--primary-color, #3b82f6);
}

.myspace-item-btn.danger:hover {
    background: #fef2f2;
    color: #ef4444;
    border-color: #fecaca;
}

.myspace-add-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    background: transparent;
    border: 2px dashed var(--border-color, #e2e8f0);
    border-radius: 8px;
    cursor: pointer;
    color: var(--text-secondary, #64748b);
    font-size: 13px;
    transition: all 0.2s ease;
}

.myspace-add-btn:hover {
    border-color: var(--primary-color, #3b82f6);
    color: var(--primary-color, #3b82f6);
    background: rgba(59, 130, 246, 0.05);
}

.myspace-textarea {
    width: 100%;
    min-height: 80px;
    padding: 10px 12px;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.5;
    resize: vertical;
    font-family: inherit;
    color: var(--text-primary, #1e293b);
    background: var(--bg-primary, #ffffff);
    transition: border-color 0.2s ease;
}

.myspace-textarea:focus {
    outline: none;
    border-color: var(--primary-color, #3b82f6);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.myspace-textarea::placeholder {
    color: var(--text-tertiary, #94a3b8);
}

.myspace-save-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 10px 16px;
    margin-top: 10px;
    background: var(--primary-color, #3b82f6);
    color: white;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.myspace-save-btn:hover {
    background: var(--primary-hover, #2563eb);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.25);
}

/* ===================================
   User Buttons Section - הכפתורים שלי
   =================================== */

.user-buttons-section {
    background: linear-gradient(135deg, rgba(30, 58, 95, 0.03), rgba(30, 58, 95, 0.05));
}

/* רשימת כפתורים מותאמים */
.user-buttons-section .myspace-list {
    min-height: auto;
}

.user-custom-btn {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--btn-color, #4a90d9);
    border-radius: 20px;
    font-size: 13px;
    color: var(--btn-color, #4a90d9);
    cursor: pointer;
    transition: all 0.2s ease;
    margin: 4px;
}

.user-custom-btn:hover {
    background: var(--btn-color, #4a90d9);
    color: white;
}

.user-custom-btn:hover .btn-actions {
    opacity: 1;
    visibility: visible;
}

.user-custom-btn i {
    font-size: 12px;
}

.btn-actions {
    position: absolute;
    top: -8px;
    left: -8px;
    display: flex;
    gap: 2px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
}

.btn-action-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: none;
    background: var(--bg-secondary, #f1f5f9);
    color: var(--text-secondary, #64748b);
    font-size: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.btn-action-icon:hover {
    background: var(--primary, #3b82f6);
    color: white;
}

.btn-action-icon.danger:hover {
    background: #ef4444;
}

/* User Button Creator - אזור יצירת כפתור */
.user-button-creator {
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 12px;
    margin-top: 12px;
    overflow: hidden;
}

.creator-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: linear-gradient(135deg, rgba(30, 58, 95, 0.08), rgba(30, 58, 95, 0.12));
    border-bottom: 1px solid var(--border-color, #e2e8f0);
    font-size: 14px;
    font-weight: 600;
    color: var(--accent-primary, #1e3a5f);
}

.creator-close-btn {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: none;
    background: transparent;
    color: var(--text-secondary, #64748b);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.creator-close-btn:hover {
    background: rgba(0, 0, 0, 0.1);
    color: var(--text-primary, #1e293b);
}

.creator-field {
    padding: 12px 16px;
    border-bottom: 1px solid var(--border-light, #f1f5f9);
}

.creator-field:last-of-type {
    border-bottom: none;
}

.creator-field label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary, #64748b);
    margin-bottom: 8px;
}

.creator-field input[type="text"] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    font-size: 14px;
    font-family: inherit;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
}

.creator-field input[type="text"]:focus {
    outline: none;
    border-color: var(--primary, #3b82f6);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.creator-textarea-wrapper {
    position: relative;
}

.creator-textarea-wrapper textarea {
    width: 100%;
    padding: 10px 12px;
    padding-left: 44px;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    font-size: 14px;
    resize: vertical;
    min-height: 80px;
    font-family: inherit;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
    line-height: 1.5;
}

.creator-textarea-wrapper textarea:focus {
    outline: none;
    border-color: var(--primary, #3b82f6);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.polish-btn {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, var(--accent-primary, #1e3a5f), #2d4a6f);
    color: white;
    font-size: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    z-index: 1;
}

.polish-btn:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.4);
}

.polish-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* מונה תווים להוראות */
.instructions-counter {
    text-align: left;
    font-size: 11px;
    color: #6b7280;
    margin-top: 4px;
    padding-right: 4px;
    transition: color 0.2s ease;
}

.instructions-counter.warning {
    color: #f59e0b;
    font-weight: 500;
}

.instructions-counter.over-limit {
    color: #ef4444;
    font-weight: 600;
}

.response-type-selector {
    display: flex;
    gap: 8px;
}

.response-type-option {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 12px;
    background: var(--bg-secondary, #f8fafc);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s ease;
}

.response-type-option:hover {
    border-color: var(--accent-primary, #1e3a5f);
}

.response-type-option:has(input:checked) {
    background: var(--accent-primary, #1e3a5f);
    border-color: var(--accent-primary, #1e3a5f);
    color: white;
}

.response-type-option input[type="radio"] {
    display: none;
}

.response-type-option i {
    font-size: 12px;
}

.save-user-btn {
    width: calc(100% - 32px);
    margin: 16px;
    padding: 12px;
    background: linear-gradient(135deg, var(--accent-primary, #1e3a5f), #2d4a6f);
    border: none;
    border-radius: 8px;
    color: white;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.save-user-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.4);
}

/* Loading state */
.myspace-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 20px;
    color: var(--text-secondary, #64748b);
    font-size: 13px;
}

.myspace-loading i {
    color: var(--primary, #3b82f6);
}

.myspace-empty-state.small {
    padding: 12px;
}

.myspace-empty-state.small i {
    font-size: 20px;
}

.myspace-empty-state.small p {
    font-size: 12px;
}

/* ===================================
   Editing Assistant - Chat Components
   עיצוב תיקונים מוצעים ופעולות מוצעות
   =================================== */

/* תיקונים מוצעים - קונטיינר */
.assistant-edits-preview {
    margin: 12px 0;
    background: var(--bg-secondary, #f8fafc);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 12px;
    overflow: hidden;
}

.assistant-edits-header {
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary, #1e293b);
    background: var(--bg-primary, #ffffff);
    border-bottom: 1px solid var(--border-color, #e2e8f0);
    display: flex;
    align-items: center;
    gap: 8px;
}

.assistant-edits-badge {
    background: var(--accent-primary, #1e3a5f);
    color: white;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 12px;
    min-width: 20px;
    text-align: center;
}

.assistant-edits-preview-list {
    padding: 8px;
}

/* פריט תיקון בודד */
.assistant-edit-preview-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 10px;
    margin-bottom: 6px;
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.assistant-edit-preview-item:hover {
    border-color: var(--accent-primary, #1e3a5f);
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.1);
}

.assistant-edit-preview-item.applied {
    opacity: 0.5;
    text-decoration: line-through;
    pointer-events: none;
}

/* 🆕 הדגשת ההצעה הבאה */
.assistant-edit-preview-item.next-edit-highlight {
    border-color: var(--accent-primary, #1e3a5f);
    background: linear-gradient(to left, transparent, rgba(30, 58, 95, 0.08));
    box-shadow: 0 0 0 2px rgba(30, 58, 95, 0.2);
    animation: pulseHighlight 1s ease-out;
}

@keyframes pulseHighlight {
    0% {
        box-shadow: 0 0 0 0 rgba(30, 58, 95, 0.4);
    }
    70% {
        box-shadow: 0 0 0 6px rgba(30, 58, 95, 0);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(30, 58, 95, 0.2);
    }
}

/* 🆕 הודעה שכל התיקונים יושמו */
.all-edits-applied-message {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 16px;
    margin-top: 12px;
    background: linear-gradient(to left, transparent, rgba(16, 185, 129, 0.1));
    border: 1px solid rgba(16, 185, 129, 0.3);
    border-radius: 8px;
    color: #059669;
    font-size: 13px;
    font-weight: 500;
    animation: fadeIn 0.3s ease-out;
}

.all-edits-applied-message .checkmark {
    font-size: 16px;
}

.edit-preview-content {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    overflow: hidden;
}

.edit-preview-original {
    color: #9ca3af;
    text-decoration: line-through;
    text-decoration-color: #ef4444;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.edit-preview-arrow {
    color: var(--text-muted, #64748b);
    font-size: 12px;
    flex-shrink: 0;
}

.edit-preview-improved {
    color: var(--accent-primary, #1e3a5f);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* כפתור החלף בודד - כמו החלף הכל */
.edit-preview-accept-btn {
    background: var(--accent-primary, #1e3a5f);
    color: white;
    border: 1px solid var(--accent-primary, #1e3a5f);
    border-radius: 8px;
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.edit-preview-accept-btn:hover {
    background: #2d4a6f;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* תיקונים נוספים */
.edit-preview-more {
    text-align: center;
    padding: 8px;
    color: var(--accent-primary, #1e3a5f);
    font-size: 12px;
    cursor: pointer;
    transition: color 0.2s ease;
}

.edit-preview-more:hover {
    color: #2d4a6f;
    text-decoration: underline;
}

/* כפתורי פעולה */
.assistant-edits-actions {
    display: flex;
    gap: 8px;
    padding: 10px;
    background: var(--bg-primary, #ffffff);
    border-top: 1px solid var(--border-color, #e2e8f0);
}

.assistant-apply-edits-btn {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    background: var(--bg-primary, #ffffff);
    color: var(--text-primary, #1e293b);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.assistant-apply-edits-btn.primary {
    background: var(--accent-primary, #1e3a5f);
    color: white;
    border-color: var(--accent-primary, #1e3a5f);
}

.assistant-apply-edits-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.assistant-apply-edits-btn.primary:hover {
    background: #2d4a6f;
}

.assistant-highlight-edits-btn {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    background: var(--bg-primary, #ffffff);
    color: var(--text-primary, #1e293b);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.assistant-highlight-edits-btn:hover {
    background: var(--bg-hover, #f1f5f9);
}

/* פעולות מוצעות - קונטיינר (🆕 עיצוב חדש עם מסגרת) */
.assistant-suggested-buttons {
    margin: 12px 0;
    background: var(--bg-secondary, #f8fafc);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 12px;
    overflow: hidden;
}

.assistant-suggested-buttons.file-suggestions {
    border-color: var(--accent-primary, #1e3a5f);
    background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
}

.assistant-suggested-header {
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary, #1e293b);
    background: var(--bg-primary, #ffffff);
    border-bottom: 1px solid var(--border-color, #e2e8f0);
}

.assistant-suggested-list {
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* כפתורי הצעה (chips) */
.assistant-suggestion-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 20px;
    color: var(--text-primary, #1e293b);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.assistant-suggestion-chip:hover {
    border-color: var(--accent-primary, #1e3a5f);
    background: linear-gradient(135deg, #ffffff 0%, #f0f4ff 100%);
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.12);
    transform: translateY(-1px);
}

.assistant-suggested-btn,
.assistant-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 8px;
    color: var(--text-primary, #1e293b);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.assistant-suggested-btn:hover,
.assistant-action-btn:hover {
    border-color: var(--accent-primary, #1e3a5f);
    background: var(--bg-hover, #f1f5f9);
}

/* ===================================
   Smart Suggestions - הצעות חכמות
   =================================== */

.smart-suggestions-area {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 4px 0;
    margin-bottom: 8px;
}

/* רק כשיש תוכן */
.smart-suggestions-area:empty {
    display: none;
}

.smart-suggestion-chip {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 16px;
    color: var(--text-primary, #1e293b);
    font-size: 12px;
    font-weight: 400;
    cursor: pointer;
    transition: all 0.2s ease;
    max-width: 100%;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.smart-suggestion-chip:hover {
    border-color: var(--accent-primary, #1e3a5f);
    background: linear-gradient(135deg, #ffffff 0%, #e0e7ff 100%);
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.15);
    transform: translateY(-1px);
}

.smart-suggestion-chip:active {
    transform: translateY(0);
    box-shadow: none;
}

/* ===================================
   Responsive - Workstation & MySpace
   =================================== */

@media (max-width: 768px) {
    .workstation-tab span {
        display: none;
    }

    .workstation-tab {
        padding: 10px 6px;
    }

    .workstation-tab i {
        font-size: 16px;
    }
}