/**
 * Shared table/dashboard layout and toolbar button styles.
 * Applies to workers, children, and sites table mode (all use .ga-col-table, .ga-table-mode-active).
 */

/* Table content area: flex so panel-max-container fills full height (no unused pixels) */
.ga-table-content {
    display: flex !important;
    flex-direction: column !important;
}
.ga-table-content .panel-max-container {
    flex: 1 !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}
.ga-table-content .panel-max-container .wrapper-sm {
    flex: 1 !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}
/* Grid wrapper (report-height-container) fills remaining space so table + footer use full height */
.ga-table-content .panel-max-container .wrapper-sm > div {
    flex: 1 !important;
    min-height: 0 !important;
}

/* Toolbar row: padding override (app_rtl .wrapper-sm is 10px) */
.ga-col-table .ga-wrapper-flex-shrink.wrapper-sm,
.ga-table-mode-active .ga-wrapper-flex-shrink.wrapper-sm {
    padding: 12px 20px 7px 10px !important;
}

/* Toolbar row: same height and alignment for all buttons (dashboard, refresh, view mode, select) */
.ga-col-table .ga-wrapper-flex-shrink .row,
.ga-table-mode-active .ga-wrapper-flex-shrink .row {
    align-items: center !important;
}
.ga-col-table .ga-dashboard-buttons-wrap,
.ga-table-mode-active .ga-dashboard-buttons-wrap {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
}
.ga-col-table .ga-wrapper-flex-shrink .btn-modern-base,
.ga-col-table .ga-wrapper-flex-shrink .btn-view-mode-table,
.ga-col-table .ga-wrapper-flex-shrink .btn-view-mode-list,
.ga-table-mode-active .ga-wrapper-flex-shrink .btn-modern-base,
.ga-table-mode-active .ga-wrapper-flex-shrink .btn-view-mode-table,
.ga-table-mode-active .ga-wrapper-flex-shrink .btn-view-mode-list {
    min-height: 40px !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
}
.ga-col-table .ga-dashboard-buttons-wrap .btn-dashboard-toggle-modern,
.ga-table-mode-active .ga-dashboard-buttons-wrap .btn-dashboard-toggle-modern {
    min-height: 40px !important;
}

/* Dashboard toggle button - blue (shared: workers, children, sites) */
.ga-col-table .btn-dashboard-toggle-modern,
.ga-table-mode-active .btn-dashboard-toggle-modern {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 600 !important;
    padding: 10px 20px !important;
    border-radius: 10px !important;
}
.ga-col-table .btn-dashboard-toggle-modern:hover,
.ga-table-mode-active .btn-dashboard-toggle-modern:hover {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    color: #fff !important;
    box-shadow: 0 6px 20px rgba(59, 130, 246, 0.4) !important;
}

/* Refresh button - orange, 40x40, icon-only padding (higher specificity to override .btn-modern-base) */
.ga-col-table .btn-refresh-modern,
.ga-table-mode-active .btn-refresh-modern,
.ga-col-table .ga-dashboard-buttons-wrap .btn-refresh-modern,
.ga-table-mode-active .ga-dashboard-buttons-wrap .btn-refresh-modern {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    color: #fff !important;
    border: none !important;
    min-width: 40px !important;
    width: 40px !important;
    height: 40px !important;
    padding: 10px 15px !important; /* icon only, override btn-modern-base 10px 20px */
    border-radius: 10px !important;
}
/* Icon-only buttons: 3-class selector beats .workers-col-table .btn-modern-base (2 classes) from template */
.ga-col-table .btn-modern-base.btn-refresh-modern,
.ga-table-mode-active .btn-modern-base.btn-refresh-modern,
.ga-col-table .btn-modern-base.btn-export-excel-modern,
.ga-table-mode-active .btn-modern-base.btn-export-excel-modern {
    padding: 10px 15px !important;
    /* Prevent ellipsis (...) on icon - btn-modern-base has overflow:hidden + text-overflow:ellipsis */
    overflow: visible !important;
    text-overflow: clip !important;
}
.ga-col-table .btn-modern-base.btn-columns-config,
.ga-table-mode-active .btn-modern-base.btn-columns-config {
    padding: 10px 16px !important;
}
.ga-col-table .btn-refresh-modern:hover,
.ga-table-mode-active .btn-refresh-modern:hover {
    background: linear-gradient(135deg, #d97706 0%, #b45309 100%) !important;
    color: #fff !important;
    box-shadow: 0 6px 20px rgba(245, 158, 11, 0.4) !important;
}
.ga-col-table .btn-refresh-modern i,
.ga-table-mode-active .btn-refresh-modern i {
    margin: 0 !important;
}

/* Export to Excel - icon only, same compact padding as refresh (override .btn-modern-base) */
.ga-col-table .btn-export-excel-modern,
.ga-table-mode-active .btn-export-excel-modern,
.ga-col-table .ga-wrapper-flex-shrink .btn-export-excel-modern,
.ga-table-mode-active .ga-wrapper-flex-shrink .btn-export-excel-modern {
    padding: 10px 15px !important;
}
.ga-col-table .btn-export-excel-modern i,
.ga-table-mode-active .btn-export-excel-modern i {
    margin: 0 !important;
    font-family: "FontAwesome" !important; /* ensure Excel icon renders, not ellipsis fallback */
}

/* Columns button - short text, slightly less horizontal padding than default */
.ga-col-table .btn-columns-config,
.ga-table-mode-active .btn-columns-config,
.ga-col-table .ga-wrapper-flex-shrink .btn-columns-config,
.ga-table-mode-active .ga-wrapper-flex-shrink .btn-columns-config {
    padding: 10px 16px !important;
}

/* View mode table button - orange (all screens) */
.ga-col-table .btn-view-mode-table,
.ga-table-mode-active .btn-view-mode-table {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    color: #fff !important;
}
.ga-col-table .btn-view-mode-table:hover,
.ga-table-mode-active .btn-view-mode-table:hover {
    background: linear-gradient(135deg, #d97706 0%, #b45309 100%) !important;
    color: #fff !important;
}

/* View mode list button - cyan (all screens) */
.ga-col-table .btn-view-mode-list,
.ga-table-mode-active .btn-view-mode-list {
    background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%) !important;
    color: #fff !important;
}
.ga-col-table .btn-view-mode-list:hover:not(.active),
.ga-table-mode-active .btn-view-mode-list:hover:not(.active) {
    background: linear-gradient(135deg, #0891b2 0%, #06b6d4 100%) !important;
    color: #fff !important;
}
.ga-col-table .btn-view-mode-list.active,
.ga-table-mode-active .btn-view-mode-list.active {
    background: linear-gradient(135deg, #67e8f9 0%, #5eead4 100%) !important;
    color: #0f172a !important;
}

/* Select mode default (בחר עובדים / בחר גנים) - purple, distinct from cyan "תצוגת רשימה" */
.ga-col-table .ga-select-mode-btn-default,
.ga-table-mode-active .ga-select-mode-btn-default {
    background: linear-gradient(135deg, #6b5b9a 0%, #5a4f7e 100%) !important;
    color: #fff !important;
}
.ga-col-table .ga-select-mode-btn-default:hover,
.ga-table-mode-active .ga-select-mode-btn-default:hover {
    background: linear-gradient(135deg, #5a4f7e 0%, #4a4068 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(107, 91, 154, 0.35) !important;
}

/* Expand/collapse row: + and minus in blue (was in workers, now shared for workers/sites) */
.ga-grid-expandable .k-hierarchy-cell .k-icon svg {
    display: none !important;
}
.ga-grid-expandable .k-hierarchy-cell .k-icon.k-i-expand,
.ga-grid-expandable .k-hierarchy-cell .k-icon.k-i-collapse,
.ga-grid-expandable .k-hierarchy-cell .k-i-expand,
.ga-grid-expandable .k-hierarchy-cell .k-i-collapse {
    background: none !important;
    font-family: Arial, sans-serif !important;
    text-indent: 0 !important;
    line-height: 1 !important;
    font-weight: bold !important;
    color: #19a9d5 !important;
    font-size: 20px !important;
    position: relative !important;
    bottom: 3px !important;
}
.ga-grid-expandable .k-hierarchy-cell .k-i-expand:before,
.ga-grid-expandable .k-hierarchy-cell .k-icon.k-i-expand:before {
    content: "+" !important;
}
.ga-grid-expandable .k-hierarchy-cell .k-i-collapse:before,
.ga-grid-expandable .k-hierarchy-cell .k-icon.k-i-collapse:before {
    content: "\2212" !important; /* minus sign − */
}