/*Write your custom css in this file.*/

/* WHITE_BG_FORCE_20260526 — Haim: pure white background everywhere */
html, body, .content, .main-content, .scrollable-page, .scrollable-page > div,
.page-container, #page-content, .clearfix, .default-bg,
.dataTable, .table, .table tbody, .table tbody tr {
    background-color: #ffffff !important;
}
body {
    overflow-y: auto !important;
    min-height: 100vh;
}
.page-container {
    min-height: calc(100vh - 65px);
    height: auto !important;
    min-height: calc(100vh - 65px);
    background-color: #ffffff !important;
}
/* דשבורד – גלילה עד הסוף: בלי גובה קבוע, התוכן יכול לגדול והדף גולל */
.scrollable-page.main-scrollable-page {
    min-height: calc(100vh - 65px) !important;
    height: auto !important;
    max-height: none !important;
    display: flex;
    flex-direction: column;
    background-color: #ffffff !important;
    overflow-y: visible !important;
    overflow-x: hidden !important;
}
#page-content {
    min-height: 100% !important;
    flex: 1;
    background-color: #ffffff !important;
    overflow-y: visible !important;
}

/* לוח אירועים – טבלה/לוח עד סוף המסך בלי גלילה */
#page-content.page-wrapper {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 65px) !important;
}
/* FullCalendar – גובה מלא כך שהתאריכים נראים בלי לגלול */
.fc {
    flex: 1;
    min-height: calc(100vh - 280px) !important;
}
.fc .fc-view-harness {
    min-height: 100%;
}
.fc-scroller-liquid-absolute {
    height: 100% !important;
}

/* Main area: fill 100% viewport so no white gap, content + chat block visible */

/* Chatwoot: 100% viewport, black background */
#ajaxModalchatwoot.modal {
    padding: 0 !important;
    background: #000 !important;
}
#ajaxModalchatwoot .modal-dialog.modal-lg {
    max-width: 100%;
    width: 100vw;
    margin: 0;
    height: 100vh;
}
#ajaxModalchatwoot .modal-content {
    height: 100vh;
    background: #000;
    border: none;
    border-radius: 0;
}
#ajaxModalContentchatwoot {
    height: 100%;
    background: #000;
}
#ajaxModalContentchatwoot iframe {
    height: 100vh;
    width: 100vw;
}
.chatwoot-iframe iframe {
    width: 100vw;
    height: 100vh;
}

/* פופ אפ תיאור תיק – תיקים משפטיים */
.project-title-with-desc {
    cursor: help;
}
.popover .popover-body {
    max-width: 320px;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* ברכת כניסה – מוסתרת */
.user-greeting-banner {
    display: none !important;
}
.user-greeting-text {
    font-size: clamp(1.5rem, 4vw, 2.5rem);
    font-weight: 600;
    color: #1c2026;
    text-align: center;
    line-height: 1.4;
    direction: rtl;
}

/* דף משימות – נוח לנייד: מונע בריחה ימינה/שמאלה, כיתוב לא חורג */
#page-content,
.scrollable-page.main-scrollable-page,
.page-container {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}
#task-table_wrapper {
    overflow-x: auto;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
}
#task-table_wrapper .filter-form,
#task-table_wrapper .filter-item-box,
#task-table_wrapper .dataTables_wrapper {
    max-width: 100%;
}
#task-table_wrapper .dropdown-toggle,
#task-table_wrapper .dropdown-menu,
#task-table_wrapper select,
#task-table_wrapper input {
    max-width: 100%;
    box-sizing: border-box;
}
#task-table_wrapper table,
#task-table {
    max-width: 100%;
}
#task-table_wrapper td,
#task-table_wrapper th {
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-word;
}
/* מודל שיוך משימה / בחירת עובד – שלא יבריח את המסך */
.modal-dialog .form-group,
.modal-dialog .dropdown,
.modal-dialog select,
.modal-dialog .assigned-to,
.modal-body .dropdown-toggle,
.modal-body .select2 {
    max-width: 100% !important;
}
.modal-body {
    overflow-x: hidden;
    word-wrap: break-word;
}
.modal-content {
    max-width: 100vw;
}
@media (max-width: 768px) {
    html, body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
        width: 100% !important;
    }
    #page-content,
    .scrollable-page,
    .scrollable-page.main-scrollable-page,
    .page-container,
    .page-wrapper,
    .tab-content,
    .tab-pane,
    .chatwoot-iframe,
    .nav-tabs,
    #client-tabs {
        overflow-x: hidden !important;
        max-width: 100vw !important;
        width: 100% !important;
    }
    #client-tabs {
        overflow-x: auto !important;
    }
    iframe {
        max-width: 100vw !important;
        width: 100vw !important;
        height: calc(100vh - 80px) !important;
        border: none !important;
    }
    /* דף צ'אטים - מסך מלא בנייד */
    .leads-view .tab-content,
    .leads-view .tab-pane,
    .leads-view .chatwoot-iframe {
        padding: 0 !important;
        margin: 0 !important;
    }
    .leads-view #client-tabs li a div {
        font-size: 10px !important;
        line-height: 1.1 !important;
    }
    .leads-view #client-tabs li a small {
        font-size: 7px !important;
    }
    /* הסתרת פס כותרת בנייד בדף צ'אט */
    .leads-view .page-title {
        display: none !important;
    }
    .mobile-bottom-menu {
        max-width: 100vw !important;
        height: 56px !important;
    }
    /* ===== תיקון: bottom nav חוסם תוכן - פדינג תחתון =====
       ה-mobile-bottom-menu הוא fixed-bottom, אבל אין padding-bottom לתוכן.
       התוצאה: הפריטים בתחתית הרשימה מכוסים ולא ניתן ללחוץ עליהם. */
    .main-scrollable-page,
    .scrollable-page.main-scrollable-page,
    #page-content,
    .page-wrapper {
        padding-bottom: 70px !important;
    }
    #task-table_wrapper {
        margin-left: 0;
        margin-right: 0;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    /* Chat button - smaller on mobile */
    #js-init-chat-icon.init-chat-icon,
    .init-chat-icon {
        width: auto !important;
        min-width: auto !important;
        max-width: 140px !important;
        left: 10px !important;
        bottom: 10px !important;
        padding: 6px 10px !important;
        font-size: 11px !important;
    }
    .init-chat-icon svg {
        width: 20px !important;
        height: 20px !important;
    }
    .init-chat-icon-user-name {
        font-size: 10px !important;
        max-width: 80px !important;
    }
    /* Shortcuts button - smaller on mobile */
    #shortcuts-btn {
        width: 32px !important;
        height: 32px !important;
        font-size: 14px !important;
        bottom: 10px !important;
        right: 10px !important;
    }
    /* Idle counter - smaller on mobile */
    #idle-counter-widget.idle-counter-widget,
    .idle-counter-widget {
        right: 10px !important;
        top: 70px !important;
        font-size: 8px !important;
        padding: 1px 4px !important;
    }
    /* Top alert - smaller on mobile */
    #top-alert-container.top-alert-container,
    .top-alert-container {
        max-width: 80vw !important;
        left: 10px !important;
    }
    /* General fix */
    .page-title h1 {
        font-size: 14px !important;
        word-break: break-word !important;
    }
    .card, .table-responsive {
        max-width: 100vw !important;
        overflow-x: auto !important;
    }
}

/* אייקון צ'אט – קטן יותר, למעלה – 2026-03-21 */
#js-init-chat-icon.init-chat-icon,
.init-chat-icon {
    width: 100px !important;
    height: 28px !important;
    min-width: 100px !important;
    min-height: 28px !important;
    padding: 4px 8px !important;
    border-radius: 6px !important;
    left: 160px !important;
    right: auto !important;
    bottom: auto !important;
    top: 70px !important;
    background-color: #b8e6b8 !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
}
.init-chat-icon svg {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0;
}
.init-chat-icon-user-name {
    font-size: 10px;
    font-weight: 500;
    color: #1a5f1a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Announcement / greeting – above, top of screen */
#top-alert-container.top-alert-container,
.top-alert-container {
    position: fixed !important;
    top: 65px !important;
    left: 20px !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 99999 !important;
    max-width: 90vw;
}
body .top-alert-container .alert,
body #top-alert-container .alert {
    margin-bottom: 0;
    font-size: 1.15rem !important;
    font-weight: 600 !important;
    padding: 12px 18px !important;
}

/* Idle counter – bigger, red, above left side */
#idle-counter-widget.idle-counter-widget,
.idle-counter-widget {
    position: fixed !important;
    top: 120px !important;
    right: 20px !important;
    left: auto !important;
    z-index: 9998 !important;
    background: #fff5f5 !important;
    border: 2px solid #dc3545 !important;
    border-radius: 4px !important;
    padding: 2px 6px !important;
    font-size: 9px !important;
    display: flex !important;
    align-items: center !important;
    gap: 2px !important;
    box-shadow: none !important;
    direction: rtl;
    opacity: 0.8;
}
.idle-counter-label {
    color: #721c24 !important;
    font-weight: 500 !important;
    font-size: 9px !important;
}
.idle-counter-value {
    font-weight: 700 !important;
    color: #dc3545 !important;
    font-size: 9px !important;
    min-width: 0 !important;
}

/* תמלול - טקסט שחור כהה וקריא */
#voice-result {
    color: #111 !important;
    background: #fff !important;
    font-size: 16px !important;
}
#voice-box {
    background: #fff !important;
    color: #111 !important;
}
#voice-box h3 {
    color: #333 !important;
}

/* הבהוב כפתור צ'אט כשיש הודעה חדשה */
@keyframes blink-chat {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}
.init-chat-icon.has-message {
    animation: blink-chat 1s infinite !important;
}

/* ===== תיקון מובייל: לחיצות איטיות/לא מגיבות - 2026-04-14 =====
   touch-action: manipulation מבטל עיכוב 300ms של דפדפן מובייל.
   הדפדפן מחכה 300ms לראות אם זה double-tap לזום - זה מה שגורם לאיטיות.
   עם manipulation - הלחיצה מיידית. ================================================================= */
@media (max-width: 1024px) {
    a, button, [role="button"], input[type="button"], input[type="submit"],
    input[type="checkbox"], input[type="radio"], label,
    .btn, .nav-link, .nav-item, .list-group-item,
    .dropdown-item, .dropdown-toggle,
    td, tr, th,
    .modal-anchor, [data-act], [data-toggle],
    .page-link, .pagination li,
    .task-title, [href], .clickable,
    .mobile-bottom-menu *, .sidebar-toggled *,
    select, textarea {
        touch-action: manipulation;
        -webkit-tap-highlight-color: rgba(0,0,0,0.05);
        cursor: pointer;
    }
    /* DataTable rows - main click targets */
    #task-table tbody tr td,
    #client-table tbody tr td,
    #lead-table tbody tr td,
    #project-table tbody tr td,
    table.dataTable tbody tr td {
        touch-action: manipulation;
    }
}

/* WHITE_BG_ALL_20260527 - Haim: force white on every element that might have cream/beige */
html, body, .panel, .panel-body, .panel-default, .nav-tabs,
.card, .card-body, .modal-body, .tab-content, .tab-pane,
.dropdown-menu, .container, .row, .col, .alert,
.client-info, .clients-tabs, .scrollable-tabs,
[class*="client-"], [id*="client-"], #client-overview {
    background-color: #ffffff !important;
}
.tab-content { background: #ffffff !important; }
/* QR Code page (the WA Scan to Login) */
.qrcode-page, .bg-\[\#FCF5EB\] { background-color: #ffffff !important; }

/* PURE_WHITE_20260529 — Haim still sees gray; nuke ALL gray backgrounds */
html, body, .page-wrapper, .page-content-area, .main-area, .row, .col, .card,
.card-body, .card-header, .col-md-12, .col-lg-12, .panel, .panel-body,
.tab-content, .tab-pane, .clearfix, .container, .container-fluid,
.dataTables_wrapper, .table-responsive, table, table > thead, table > tbody,
table > thead > tr, table > tbody > tr, table.table-striped > tbody > tr,
.col-md-3, .col-md-4, .col-md-6, .col-md-8, .col-md-9, .col-md-10,
.row > div, .grid, [class*=col-], section, main, .container > div {
    background-color: #ffffff !important;
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: transparent !important;
    background-color: #ffffff !important;
}
.table > tbody > tr > td, .table > thead > tr > th {
    background-color: #ffffff !important;
}
