/** * FastTable CSS * Lightweight styles for FastTable component * @version 1.0.0 *//* Table header container */.ft-table-header {    margin-bottom: 15px;    padding: 10px 0;}/* Primera fila: Título (izq) y Búsqueda (der) en misma línea */.ft-header-row {    display: flex;    justify-content: space-between;    align-items: center;    gap: 20px;    margin-bottom: 10px;}/* Título del header */.ft-title {    margin: 0;    font-size: 24px;    font-weight: 500;    flex: 1;}/* DisplayNum selector (in footer) */.ft-display-selector {    display: flex;    align-items: center;    gap: 5px;}.ft-display-selector label {    font-weight: normal;    font-size: 14px;    white-space: nowrap;}.ft-display-num-select {    width: 80px !important;    height: 34px;    padding: 6px 10px;    font-size: 14px;}/* Quick search */.ft-quick-search {    display: flex;    gap: 5px;    align-items: center;}.ft-search-input {    width: 250px;    display: inline-block;}.ft-search-btn {    padding: 6px 12px;}.ft-clear-search {    padding: 6px 10px;}/* User buttons - Posiciones */.ft-user-buttons {    display: flex;    gap: 8px;    flex-wrap: wrap;}.ft-user-buttons .btn {    margin: 0;}/* Posición: below (debajo del header row) - por defecto */.ft-buttons-below {    padding-top: 5px;}/* Posición: left (antes del título, en línea separada) */.ft-buttons-left {    margin-bottom: 10px;}/* Posición: bottom (después de paginación) */.ft-buttons-bottom {    margin-top: 15px;    padding: 10px 0;    border-top: 1px solid #dee2e6;}/* Checkbox column */.ft-checkbox-col {    width: 40px;    text-align: center;}.ft-checkbox-col input[type="checkbox"] {    margin: 0;    cursor: pointer;}.ft-select-all {    width: 18px;    height: 18px;}.ft-row-checkbox {    width: 18px;    height: 18px;}/* Selectable rows (when checkboxes are enabled) */.ft-selectable-row {    transition: background-color 0.15s ease;}.ft-selectable-row:hover {    background-color: #f8f9fa;}.ft-selectable-row:active {    background-color: #e9ecef;}/* Icon column */.ft-icons-col {    width: 100px;    text-align: center;    white-space: nowrap;}/* Sortable columns */.ft-sortable {    cursor: pointer !important;    user-select: none;    transition: background-color 0.2s;}.ft-sortable:hover {    background-color: #f0f0f0 !important;}.ft-sortable i {    margin-left: 5px;    font-size: 12px;}.ft-sortable sup {    font-size: 10px;    font-weight: bold;    color: #667eea;    margin-left: 2px;}/* Columna activamente ordenada */.ft-sorted {    background-color: #f8f9ff !important;    font-weight: 600;}.ft-sorted:hover {    background-color: #e8ebff !important;}/* Icono neutral en columnas no ordenadas */.ft-sortable .fa-sort {    transition: all 0.3s ease;}.ft-sortable:hover .fa-sort {    color: #667eea !important;    opacity: 1 !important;    transform: scale(1.1);}/* Column filters row */.ft-filter-row {    background-color: #f8f9fa;}.ft-filter-row th {    padding: 8px;    border-top: 1px solid #dee2e6;}/* When filters are first (bottom position), adjust border */thead .ft-filter-row:first-child th {    border-top: none;    border-bottom: 2px solid #dee2e6;}.ft-filter-cell {    padding: 5px !important;}.ft-column-filter {    width: 100%;    font-size: 13px;    padding: 4px 8px;    height: 32px;}.ft-column-filter:focus {    border-color: #667eea;    box-shadow: 0 0 0 0.2rem rgba(102, 126, 234, 0.25);}/* Footer section */.ft-footer-section {    display: flex;    justify-content: space-between;    align-items: center;    margin-top: 20px;    gap: 20px;}.ft-footer-left {    display: flex;    align-items: center;}.ft-footer-right {    display: flex;    flex-direction: column;    align-items: flex-end;}/* Pagination */.ft-pagination {    display: inline-block;}.ft-pagination .pagination {    margin: 0;    justify-content: flex-end;}/* Record info */.ft-record-info {    margin-top: 8px;    text-align: right;    font-size: 12px;    color: #666;    font-style: italic;}/* Tooltip messages */.ft-tooltip {    position: fixed;    top: 50%;    left: 50%;    transform: translate(-50%, -50%);    padding: 15px 30px;    border-radius: 5px;    z-index: 9999;    display: none;    box-shadow: 0 4px 6px rgba(0,0,0,0.3);    font-size: 14px;    max-width: 400px;    text-align: center;}.ft-tooltip-success {    background-color: #5cb85c;    color: white;}.ft-tooltip-error {    background-color: #d9534f;    color: white;}.ft-tooltip-info {    background-color: #333;    color: white;}/* AJAX Loader */.ft-ajax-loader {    position: fixed;    top: 50%;    left: 50%;    transform: translate(-50%, -50%);    z-index: 9998;    background: rgba(255, 255, 255, 0.95);    padding: 20px 30px;    border-radius: 8px;    box-shadow: 0 2px 10px rgba(0,0,0,0.2);}.ft-ajax-loader.hidden {    display: none !important;}/* Responsive table wrapper */.ft-table-wrapper {    overflow-x: auto;    -webkit-overflow-scrolling: touch;}/* Mobile optimizations */@media (max-width: 768px) {    .ft-table-header {        flex-direction: column;        align-items: flex-start;        gap: 10px;    }        .ft-user-buttons {        width: 100%;    }        .ft-checkbox-col {        width: 35px;    }        .ft-icons-col {        width: 80px;    }        .ft-table-header h3 {        font-size: 20px;    }        .ft-pagination .pagination {        font-size: 14px;    }        .ft-record-info {        font-size: 12px;        padding: 8px;    }}/* Action icon buttons */.ft-icon-btn {    display: inline-block;    padding: 5px 10px;    margin: 0 2px;    background-color: #fff;    border: 1px solid #ddd;    border-radius: 3px;    cursor: pointer;    transition: all 0.2s ease;    font-size: 14px;    line-height: 1;    vertical-align: middle;}.ft-icon-btn:hover {    border-color: #999;    box-shadow: 0 1px 3px rgba(0,0,0,0.15);    transform: translateY(-1px);}.ft-icon-btn:active {    transform: translateY(0);    box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);}.ft-icon-btn:focus {    outline: none;    border-color: #4CAF50;}/* Button colors */.ft-icon-edit {    color: #4CAF50;}.ft-icon-edit:hover {    background-color: #4CAF50;    color: white;    border-color: #4CAF50;}.ft-icon-copy {    color: #2196F3;}.ft-icon-copy:hover {    background-color: #2196F3;    color: white;    border-color: #2196F3;}.ft-icon-delete {    color: #f44336;}.ft-icon-delete:hover {    background-color: #f44336;    color: white;    border-color: #f44336;}/* Icons column sizing */.ft-icons-col {    white-space: nowrap;    text-align: center;    min-width: 120px;}/* Print styles */@media print {    .ft-pagination,    .ft-ajax-loader,    .ft-tooltip,    .ft-user-buttons {        display: none !important;    }        .ft-checkbox-col,    .ft-icons-col {        display: none !important;    }}