/**
 * Tickets Column Resize - CSS
 * Estilos para redimensionamento de colunas da tabela de tickets (modo Lista)
 * 
 * @version 1.0
 */

/* ============================================
   1. BASE - Position relative no th para handles
   ============================================ */
#table_tickets thead th {
    position: relative;
    user-select: none;
}

/* ============================================
   2. HANDLE DE REDIMENSIONAMENTO
   ============================================ */
.th-resize-handle {
    position: absolute;
    top: 0;
    right: -3px;
    width: 6px;
    height: 100%;
    cursor: col-resize;
    z-index: 10;
    background: transparent;
    transition: background-color 0.15s ease;
}

.th-resize-handle:hover {
    background-color: rgba(30, 64, 175, 0.3);
}

.th-resize-handle:active,
.th-resize-handle.dragging {
    background-color: rgba(30, 64, 175, 0.6);
}

/* Dark mode */
[data-theme="dark"] .th-resize-handle:hover,
.dark-mode .th-resize-handle:hover,
body.dark .th-resize-handle:hover {
    background-color: rgba(59, 130, 246, 0.4);
}

[data-theme="dark"] .th-resize-handle:active,
[data-theme="dark"] .th-resize-handle.dragging,
.dark-mode .th-resize-handle:active,
.dark-mode .th-resize-handle.dragging,
body.dark .th-resize-handle:active,
body.dark .th-resize-handle.dragging {
    background-color: rgba(59, 130, 246, 0.7);
}

/* ============================================
   3. ESTADO DE ARRASTE GLOBAL
   ============================================ */
body.col-resizing {
    cursor: col-resize !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
}

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

/* Prevenir interferência com outros elementos durante drag */
body.col-resizing iframe,
body.col-resizing embed,
body.col-resizing object {
    pointer-events: none;
}

/* ============================================
   4. INDICADOR VISUAL DE COLUNA SENDO REDIMENSIONADA
   ============================================ */
#table_tickets thead th.resizing {
    background-color: rgba(30, 64, 175, 0.08);
}

[data-theme="dark"] #table_tickets thead th.resizing,
.dark-mode #table_tickets thead th.resizing,
body.dark #table_tickets thead th.resizing {
    background-color: rgba(59, 130, 246, 0.15);
}

/* ============================================
   5. TOOLTIP INDICANDO FUNCIONALIDADE (opcional)
   ============================================ */
.th-resize-handle::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 1px;
    height: 52px;
    background-color: #475569a1;
    border-radius: 1px;
    transition: background-color 0.15s ease;
}

.th-resize-handle:hover::after {
    background-color: rgba(30, 64, 175, 0.5);
}

[data-theme="dark"] .th-resize-handle:hover::after,
.dark-mode .th-resize-handle:hover::after,
body.dark .th-resize-handle:hover::after {
    background-color: rgba(59, 130, 246, 0.6);
}

/* ============================================
   6. RESPONSIVO - Esconder handles em mobile
   ============================================ */
@media (max-width: 768px) {
    .th-resize-handle {
        display: none;
    }
}

/* ============================================
   7. PRINT - Esconder handles na impressão
   ============================================ */
@media print {
    .th-resize-handle {
        display: none !important;
    }
}