.ca-contenedor { font-family: Arial, sans-serif; margin: 20px 0; }
.ca-form-container { background: #fff; padding: 20px; border-radius: 8px; margin-bottom: 20px; box-shadow: 0 2px 4px rgba(0,0,0,0.05); }
.ca-table { border-collapse: collapse; width: 100%; font-size: 13px; background: #fff; }
.ca-table th, .ca-table td { border: 1px solid #ddd; padding: 10px; text-align: left; vertical-align: top; }
.ca-table th { background-color: #2c3e50; color: white; }
.ca-mensaje { padding: 12px; border-radius: 4px; margin: 10px 0; }
.ca-mensaje.info { background: #d1ecf1; border: 1px solid #bee5eb; color: #0c5460; }
.ca-mensaje.error { background: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; display: none; }
/* ... resto de estilos con prefijo ca- ... */
 body { font-family: Arial, sans-serif; margin: 0px; background: #fafafa; }
        h2 { color: #2c3e50; }
        
        .form-container { 
            background: #fff; 
            padding: 20px; 
            border-radius: 8px; 
            margin-bottom: 20px;
            box-shadow: 0 2px 4px rgba(0,0,0,0.05);
            display: inline-block;
        }
        .form-container label { margin-right: 10px; font-weight: bold; color: #34495e; }
        .form-container input[type="text"] { 
            padding: 8px 12px; 
            margin-right: 15px; 
            border: 1px solid #ccc; 
            border-radius: 4px;
            width: 160px;
            font-size: 14px;
        }
        .form-container button {
            padding: 8px 20px;
            background: #2c3e50;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-size: 14px;
            margin-right: 5px;
        }
        .form-container button:hover { background: #34495e; }
        .form-container button:disabled { background: #95a5a6; cursor: not-allowed; }
        .form-container button.btn-limpiar { background: #7f8c8d; }
        .form-container button.btn-limpiar:hover { background: #95a5a6; }
        
        table { border-collapse: collapse; width: 100%; font-size: 13px; background: #fff; }
        th, td { border: 1px solid #ddd; padding: 10px; text-align: left; vertical-align: top; }
        th { background-color: #2c3e50; color: white; position: sticky; top: 0; }
        tr:nth-child(even) { background-color: #f9f9f9; }
        tr:hover { background-color: #eef5ff; }
        
        /* Estilos para el campo de providencia con truncado */
        .celda-providencia {
            min-width: 50%;
            max-width: 700px;
            position: relative;
        }
        .texto-providencia {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            line-height: 1.4;
            transition: all 0.3s ease;
        }
        .texto-providencia.expandido {
            display: block;
            -webkit-line-clamp: unset;
            overflow: visible;
        }
        
        .btn-toggle-texto {
            display: inline-block;
            margin-top: 6px;
            padding: 3px 10px;
            font-size: 11px;
            background: #3498db;
            color: white;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }
        .btn-toggle-texto:hover { background: #2980b9; }
        
        .mensaje { padding: 12px; border-radius: 4px; margin: 10px 0; }
        .mensaje.info { background: #d1ecf1; border: 1px solid #bee5eb; color: #0c5460; }
        .mensaje.error { background: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; }
        
        .spinner {
            display: inline-block;
            width: 14px;
            height: 14px;
            border: 2px solid #f3f3f3;
            border-top: 2px solid #2c3e50;
            border-radius: 50%;
            animation: spin 1s linear infinite;
            vertical-align: middle;
            margin-right: 6px;
        }
        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }

        